jquery table filter script not not working

Question

I have JSP page which displays the records fetched from mysql through java servlet. Now I want filter the obtained records using jquery. I used the following code with head section of jsp page

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.0.min.js">
</script><script type= "text/javascript">{$(document).ready(function()
{$("#searchInput").keyup(function() {
    var rows = $("#fbody").find("tr").hide();
    var data = this.value.split(" ");
    $.each(data, function(i, v) {
        rows.filter(":contains('" + v + "')").show();
    });
})})};
</script>

The code for getting the records from servlet and displaying it in the JSP is given below

 <body><input id="searchInput" ><br/>


<TABLE  align="Center" border="1px" width="80%">
<thead>
<tr><th><b>User_ID</b></th>
    <th><b>User_Name</b></th>
    <th><b>Password</b></th>
    <th><b>Designation</b></th>
</tr>
</thead>
    <%Iterator itr;%>
    <%List data=(List) request.getAttribute("UserData");
    for(itr=data.iterator();itr.hasNext();)
    {%>
        <tbody id="fbody">
        <tr>
            <% String s= (String) itr.next(); %> 
            <td><%=s %></td>
            <td><%=itr.next() %></td>
            <td><%=itr.next() %></td>
            <td><%=itr.next() %></td>

            <form id="edit" action="EditRecord" method="post" >
            <td><input type="hidden" name="hidden_edit" id="edit_id" value="<%=s %>"/> 
            <input type="submit" value="Edit" name="edit"> </td>
            </form>

            <td><form id="delete" action="DeleteRecord" method="post" >
            <td><input type="hidden" name="hidden_delete" id="delete_id" value="<%=s %>"/>
            <input type="submit" value="delete" name="delete"> </td>
            </form></td>    
    <%} %>
        </tr>
        </tbody>
</TABLE></body>

I am able to get all the records but the script is not filtering my record. Dont know where is the problem.Could any one help me out please.

try var rows = $("#fbody").find("tr"); and rows.hide(); afterwards — Timur
– Timur, Commented Apr 27, 2014 at 19:46
@Timur Thanks for your reply. But could elaborate where should I put the above line afterwards? — Dinesh
– Dinesh, Commented Apr 27, 2014 at 20:23
check the answert from @Abimbole Esuruoso it looks like you are having multiple tbody tags with same id which should not happen. — Timur
– Timur, Commented Apr 27, 2014 at 20:26

Abimbola Esuruoso · Accepted Answer · 2014-04-27 19:48:32Z

1

Take tbody out of your for loop.

answered Apr 27, 2014 at 19:48

Abimbola Esuruoso

4,2371 gold badge21 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery table filter script not not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related