I noticed that isotope.js has a problem in IE whenever I try to filter my app the results looks out of place(in my case it's out of the table). I was wondering if there are any available solutions for this one? here is my Fiddle and sample code
var data = [{
"RM_Name": "Russ Martin",
"Division": "East",
"RM_Phone": "(603) 491-1259",
"RC_Name": "Jacob Sucoff",
"RC_Phone": "(800) 247-4154 x3403",
"States_Covered": "MT,VT, NH, ME (all firms)",
"Latitude": 46.6797995,
"Longitude": -110.044783,
"Coordinates": "46.6797995,-110.044783"
}, {
"RM_Name": "Carey Fortnam",
"Division": "East",
"RM_Phone": "(585)-259-7394",
"RC_Name": "Matt Wrzesniewsky",
"RC_Phone": "(800) 247-4154 x3088",
"States_Covered": "NY- Upstate ex Rockland County (BD, FP)",
"Latitude": 40.7056308,
"Longitude": -73.9780035,
"Coordinates": "40.7056308,-73.9780035"
}];
$.each(data, function(i, item) {
var rm_name = item.RM_Name,division = item.Division,rm_phone = item.RM_Phone,rc_name = item.RC_Name,rc_phone = item.RC_Phone,states = item.States_Covered;
var dataset='<tr class="'+rm_name+' '+rc_name+'"><td>'+rm_name+'</td><td>'+division+'</td><td>'+rm_phone+'</td><td>'+rc_name+'</td><td>'+rc_phone+'</td><td>'+states+'</td></tr>';
$('.rm-data').append(dataset);
});
// init Isotope
var $container = $('.rm-data');
$('#search').on('keypress',function(e){
if(e.which == 13){
var query = $('#search').val();
query = "tr:contains("+query+")";
$container.isotope({ filter: query });
console.log(query);
}
});
Any suggestions are welcome.Thanks.
I've completely abandoned the Isotope.js idea and instead I created my own filtering function. Fiddle here.
I have replaced this:
// init Isotope
var $container = $('.rm-data');
$('#search').on('keypress',function(e){
if(e.which == 13){
var query = $('#search').val();
query = "tr:contains("+query+")";
$container.isotope({ filter: query });
console.log(query);
}
});
With this:
$('#search').on('keypress',function(e){
if(e.which=='13'){
$('.rm-data tr').css('display','none');
$('.error-msg').css('display','none');
var query = $('#search').val();
if($('.rm-data tr').hasClass(query)){
$('.rm-data tr:contains('+query+')').fadeIn('slow',function(){
$('.rm-data tr:contains('+query+')').css('display','block').slideDown();
});
}
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.