Sharepoint Key Filters

by jansian

HTML

<div id="idKeyFiltersContainer" >
    <div class="ms-KFHeadV3 ms-KFHead">    
        <div class="ms-KFHeadV3 ms-KFHead">
            <SPAN id="idKeyFiltersTitle">Key Filters</SPAN> 
            <SPAN id="idKeyFiltersHeader">
                <BUTTON>Apply</BUTTON>
                <BUTTON >Clear</BUTTON> 
            </SPAN>
        </div>
        <DIV class=ms-KFLabel>Created </DIV>
        <DIV class=ms-KFBody>
            <SELECT> 
                <OPTION selected value=Eq>On</OPTION> 
                <OPTION value=Leq>On or Before</OPTION> 
                <OPTION value=Geq>On or After</OPTION>
            </SELECT>
        </DIV>
        <SPAN dir=none>
            <LABEL style="DISPLAY: none" >Created Date</LABEL> 
            <INPUT class=ms-input title=Created>
        </SPAN>
        <DIV class=ms-KFLabel>Modified </DIV>
        <DIV class=ms-KFBody>
            <SELECT> 
                <OPTION selected value=Eq>On</OPTION> 
                <OPTION value=Leq>On or Before</OPTION> 
                <OPTION value=Geq>On or After</OPTION>
            </SELECT>
        </DIV>
        <SPAN dir=none>
            <LABEL style="DISPLAY: none" >Modified Date</LABEL> 
            <INPUT class=ms-input title=Modified>
        </SPAN>
    </div>
</div>

CSS

#divFilterDate1{
 border:1px solid black;   
}

#divFilterDate2{
 border:1px solid red;   
}

JavaScript

$(document).ready(function() {
        //alert($($('#idKeyFiltersContainer div').children()[2]).html());
        var newContent = '<div class=ms-KFLabel>Received Date</div><div class=ms-KFBody><select id="selFilter"><option value="1">All</option><option value="2">Today</option><option value="3">Last 1 Week</option><option value="4">Last 1 Month</option><option value="5">Specific Range</option></select><div id="divFilterDates"><div id="divFilterDate1"></div><div id="divFilterDate2"></div></div>';
        var myFilterKeyCookieName = "MyFilterKey";
        var myFilterKeyCookieTimeOut = 30;
        
        $('#idKeyFiltersTitle').parent().after(newContent);
        
        function MoveChildren(Index, ParentName) {
            for (x = 1; x <= 3; x++) {
                //alert($($('#idKeyFiltersContainer div').children()[Index]).html);
                $($('#idKeyFiltersContainer div').children()[Index]).appendTo('#' + ParentName);
            }
        }
        
        var $TaxonomyTreeContainer = $('#idKeyFiltersContainer').parent().children('span').children('div');
        $TaxonomyTreeContainer.addClass('ms-KFMenu');
        
        
        function createCookieDays(name,value,days) {
            if (days) {
                var date = new Date();
                //set cookie to expire in days
                date.setTime(date.getTime()+(days*24*60*60*1000));
                var expires = "; expires="+date.toGMTString();
            }
            else var expires = "";
            document.cookie = name+"="+value+expires+"; path=/";
        }
        
        function createCookieMins(name,value,mins) {
            if (mins) {
                var date = new Date();
                //set cookie to expire in minutes
                date.setTime(date.getTime()+(mins*60*1000));
                
                var expires = "; expires="+date.toGMTString();
            }
            else var expires = "";
            document.cookie = name+"="+value+expires+";...