jquery - display:block kills my style -
i have table has inputbox in 1 of elements wich use filter table with.
when wright in box table gets filtered.
the wierd thing if use display:block show rows want see totally destroys of row. if use jquery .toggle(); works fine.
why that?
html:
<body> <table> <tr><th>users<input type="text" id="filter"/></th></tr> <tr class="user" data="patrick"><td>patrick</td></tr> <tr class="user" data="john"><td>john</td></tr> </table> </body> filter script works
$('#filter').keyup(function(){ $(".user").css("display", "none"); if($("#filter").val()!=''){ var filterstr = $("#filter").val().tolowercase(); $("[data*="+filterstr+"].user").toggle(); }else{ $(".user").toggle(); } }); if use display:block

css:
table { width: 200px; } td { border: 1px solid #000; font: bold 10px helvetica, arial, sans-serif; padding: 5px; } th { background: #f3f3f3; border: 1px solid #000; font: bold 10px helvetica, arial, sans-serif; padding: 5px; }
use display:table-row instead, because table rows not display:block default!
Comments
Post a Comment