Filter Your Ads on Classipress Dashboard - firestormcs Freebie
.<table border="0" cellpadding="4" cellspacing="1" class="tblwide" id="myads">...</table>
<h3 class="" id="adheader">Search Your Ads</h3>
<img src="<?php bloginfo('template_url'); ?>/images/search_16.png" class=""/>
input.filterinput {
border:1px solid #BBBBBB;
color:#4F4F4F;
margin:10px 0;
padding:6px;
width:289px;
}
<script type="text/javascript">
// custom css expression for a case-insensitive contains()
//convert all text to uppercase then compare it
jQuery.expr[':'].Contains = function(a,i,m){
return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
function listFilter(header, list) { // header is any element, list is an unordered list
// create and add the filter form to the header
var form = jQuery("<form>").attr({"class":"filterform","action":"#"}),
input = jQuery("<input>").attr({"class":"filterinput","type":"text"});
jQuery(form).append(input).appendTo(header);
//
jQuery(input).change( function () {
var filter = jQuery(this).val();
if(filter) {
// this finds all links in a list that contain the input,
// and hide the ones not containing the input while showing the ones that do
jQuery(list).find("td h3:not(:Contains(" + filter + "))").parent().parent().hide();
jQuery(list).find("td h3:Contains(" + filter + ")").parent().parent().fadeIn('medium');
} else {
jQuery(list).find("tr").fadeIn('medium');
}
return false;
}).keyup( function () {
// fire the above change event after every letter
jQuery(this).change();
});
}
//initiate the search form
jQuery(function () {
listFilter(jQuery("#adheader"), jQuery("#myads"));
});
</script>
There are currently 1 users browsing this thread. (0 members and 1 guests)
Reply With Quote
You must be an AppThemes customer and logged in to view this response.