I am trying to use the datatable jquery plugin to a table that is populated by a JSP . I add the datatable initialisation in the $(document).ready(function()) but for some reason the plugin is not able to perform the search or pagination . my code snippet is

<table class="data-table" id="test">
    <thead>
        <tr>
            <th>value1</th>
            <th>value2</th>
            <th>value3</th>
            <th>value4</th>

        </tr>
    </thead>
    <tbody>


        <tr>
            <td class="class1"><%= value.valueOne() %></td>
            <td class="class2"><%= value.valueTwo() %></td>
            <td class="class3"><%= value.valueThree() %></td>


            <td class="class4"><%= value.valueFour() %></td>
        </tr>
        <%
        }
        %>
    </tbody>
</table>


<script>
   $(document).ready(function()  {
        alert("HELLO");
        $('#test').dataTable();

       });
</script>

Anybody else who has faced this issue , any help would be appreciated .

I am trying to use the datatable jquery plugin to a table that is populated by a JSP . I add the datatable initialisation in the $(document).ready(function()) but for some reason the plugin is not able to perform the search or pagination . my code snippet is

<table class="data-table" id="test">
    <thead>
        <tr>
            <th>value1</th>
            <th>value2</th>
            <th>value3</th>
            <th>value4</th>

        </tr>
    </thead>
    <tbody>


        <tr>
            <td class="class1"><%= value.valueOne() %></td>
            <td class="class2"><%= value.valueTwo() %></td>
            <td class="class3"><%= value.valueThree() %></td>


            <td class="class4"><%= value.valueFour() %></td>
        </tr>
        <%
        }
        %>
    </tbody>
</table>


<script>
   $(document).ready(function()  {
        alert("HELLO");
        $('#test').dataTable();

       });
</script>

Anybody else who has faced this issue , any help would be appreciated .

• javascript
• jquery
• html
• jsp
• datatables

• Is this loaded using ajax, or just when the main page loads? – TGH Commented Oct 28, 2013 at 2:22
• 1 It is loaded when the main page loads . – user1801279 Commented Oct 28, 2013 at 2:23
• 2 Isn't JSP executed server-side? How could something client-side run before something server-side? – Paul S. Commented Oct 28, 2013 at 2:25
• The one thing to check is to see if the java script defining the plugin is loaded at this point. Does it give you an error message if you debug it in developer tools? – TGH Commented Oct 28, 2013 at 2:25
• 1 @PaulS.: it's probably a rhetorical question, but (for clarification), no, it can't. – Qantas 94 Heavy Commented Oct 28, 2013 at 2:30

1 Answer 1

$(document).ready() function is executed when your full page is loaded, no matter where you write it in code. More info: http://learn.jquery./using-jquery-core/document-ready/