khushboo
khushboo

Reputation: 715

Bootstrap table search and pagination is not work properly

I'm using Node.js with bootstrap 4 and to display data in ejs file, I used bootstrap table from this link.

https://datatables.net/examples/styling/bootstrap4.html

The Issue is then I put static data in table it works fine. But when I fetch from database(MySql) and going to print data. Data print's fine but search and pagination not active/display.

When page load I have set this code to active it.

<script>
        $(document).ready(function () {
            $('#example').DataTable({
                "paging": true,
                "ordering": true,
                "info": false
            });
        });
</script>

And in table I print data in this way.

 <tbody>
     <% if(data.length > 0) { %>
         <% for(var i = 0 ; i < data.length ; i++){ %>
             <tr>
                <td>
                  <%= i+1 %>
                </td>
                <td>
                  <%= data[i].customer_name %>
                </td>                    
             </tr>
         <% } %>
     <% } %>
 </tbody>

Upvotes: 0

Views: 677

Answers (1)

Sachin Shah
Sachin Shah

Reputation: 4533

As I look into your code, Every thing looks good. I have a sample working code in same situation. It may help you.

<table id="example" class="table table-striped table-bordered" style="width:100%">
        <thead>
            <tr>
                <th>Index</th>
                <th>Your_header_name</th>                    
            </tr>
        </thead>
        <tbody>
            <% if(data.length > 0) { %>
                <% for(var i = 0 ; i < data.length ; i++){ %>
                    <tr>
                        <td>
                            <%= i+1 %>
                        </td>
                        <td>
                            <%= data[i].filed_name %>
                        </td>                                                        
                    </tr>
                <% } %>
            <% } %>
        </tbody>
    </table>

Upvotes: 1

Related Questions