5
Làm cách nào để thực hiện việc này?tìm kiếm jquery trong dữ liệu bảng và thẻ
Tôi có mã html và jquery cho loại và dữ liệu bảng lọc (http://jsfiddle.net/tutorialdrive/YM488/), và nhập dữ liệu thẻ và trong cùng một hộp nhập, nhưng tôi muốn hợp nhất cả hai.
Tôi có mã thẻ cũng nhưng bị mất tên thư viện của nó vì vậy tôi không thể nói thêm rằng trên jsfiddle,
tức là khi tôi gõ vào tên tìm kiếm, hoặc bấm vào bảng dữ liệu (01 Tên Last name vv). Dữ liệu phải được gắn thẻ trong khu vực thẻ ở trên (kiểm tra x, thử nghiệm x).
Dưới đây là html của tôi và mã jquery cho tìm kiếm trong bảng
HTML
<!-- table for search and filter start -->
<label for="kwd_search">Search:</label> <input type="text" id="kwd_search" value=""/>
<table id="my-table" border="1" style="border-collapse:collapse">
<thead>
<tr>
<th>Name</th>
<th>Sports</th>
<th>Country</th>
</tr>
</thead>
<tbody>
<tr>
<td>Sachin Tendulkar</td>
<td>Cricket</td>
<td>India</td>
</tr>
<tr>
<td>Tiger Woods</td>
<td>Golf</td>
<td>USA</td>
</tr>
<tr>
<td>Maria Sharapova</td>
<td>Tennis</td>
<td>Russia</td>
</tr>
</tbody>
</table>
<!-- table for search and filter ends -->
Jquery Mã
/* jquery for search nad filter table start*/
$(document).ready(function(){
// Write on keyup event of keyword input element
$("#kwd_search").keyup(function(){
// When value of the input is not blank
var term=$(this).val()
if(term != "")
{
// Show only matching TR, hide rest of them
$("#my-table tbody>tr").hide();
$("#my-table td").filter(function(){
return $(this).text().toLowerCase().indexOf(term) >-1
}).parent("tr").show();
}
else
{
// When there is no input or clean again, show everything back
$("#my-table tbody>tr").show();
}
});
});
/* jquery for search nad filter table ends*/
bạn có thể mô tả vấn đề của bạn hơn –
@Ganesh, ok, tôi cố gắng thêm cơ sở tag và tôi có mã của nó, nhưng tôi muốn thêm một cái gì đó nhiều hơn, ở trên hình ảnh trong "khu vực tìm kiếm" khi tôi gõ một cái gì đó trong đó, dữ liệu bảng lọc (demo trong jsfiddle). và trong khu vực thẻ, tôi có thể thêm thẻ theo loại trong đó, nhưng tôi phải làm gì, khi tôi nhấp vào dữ liệu của bảng và dữ liệu thêm vào khu vực thẻ ở trên. –
hoạt động đối với tôi miễn là đầu vào là chữ thường ... thay đổi việc gán cụm từ thành 'var term = $ (this) .val(). ToLowerCase();' – Orangepill