Reload datatable without reloading page?

Question

How do I reload the datatable without reloading the entire page? I want it to get the new values from "AllSales". I am also using jquery plugin "datatable" for my table.

   $("#SalesTable").dataTable();

Here is my table :

<table id="SalesTable">
                        <thead>
                            <tr>
                                <th>Date</th>
                                <th>Email</th>
                            </tr>
                        </thead>
                        <tbody>
                          <% {
                                foreach (var item in AllSales)
                                {
                                   %>
                                   <tr>
                                     <td><%=item.Date %></td>
                                     <td><%=item.Email%> </td>
                                   </tr>
                                <%}
                            }
                         %>

                        </tbody>
                    </table>

Do you want the reload to occur at a set time or on an event? — Index
– Index, Commented Dec 30, 2012 at 14:57
@KG Christensen: It will be every time I get a new sale so on an event. — syncis
– syncis, Commented Dec 30, 2012 at 15:00
Okay, but where does the sale come from? What kind of page is it you're making? Is it supposed to monitor "all sales"? — Index
– Index, Commented Dec 30, 2012 at 15:01
I have a background thread that counts the sales in my database, and if the counter have increased from the last saved value, then we have a sale. This page is just showing the sales, and if there is a new sale, i want it to be shown as well without reloading the page. — syncis
– syncis, Commented Dec 30, 2012 at 15:03
If you have something running in the background checking for updates, isn't it as simple as calling the function that builds the datatables again? — Index
– Index, Commented Dec 30, 2012 at 15:06

matt · Accepted Answer · 2012-12-30 22:32:10Z

1

Grab the data using ajax, throw it into an object and dynamically change the content of your datatable based on the object. It's been years since I've used any .net languages, so I can't write you an example in asp.

<html>
<tbody id='datatable'>
</tbody>
</html>

var tbodyData;
var post = $.ajax({
 url: "someurl.asp",
 type: "POST",
 data: {"some data"},
 success: function() {
  var object = post.responseText;
  object.parseJSON();
  for (data in object) {
   tbodyData += "<tr><td>" + object[data] + "</td></tr>\n";
  }
  $("datatable").html(tbodyData);
 }
});

Something like that should do it.

answered Dec 30, 2012 at 22:32

matt

627 bronze badges

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

Collectives™ on Stack Overflow

Reload datatable without reloading page?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related