How to refresh datatable list jquery?

Wrap the datatable initialization into a function, like initDataTable(), and add the option bDestroyto the settings :

function initDataTable() {
   if (fnServerObjectToArray) {
      var oTable = $('.datatable').dataTable({
         "bDestroy" : true, //<-- add this option
         "bJQueryUI" : true,
         ...
         //anything as above
      });
   }
}

$(document).ready(function () {
  initDataTable();
});

when you want to refresh / reload, like by a click on a button :

<button id="refresh">Refresh</button>

$("#refresh").click(function() {
   initDataTable();
});

here is a demo -> http://jsfiddle.net/cxe5L/

---

To avoid the cache-issue
jQuery dataTables has hardcoded cache : true into its AJAX-calls. You have "sAjaxSource": $('.datatable').attr('data'). I assume data holds the path to an external resource, like /data/getdata.asp or similar? Add a timestamp as param to that resource, like

sAjaxSource : $('.datatable').attr('data')+'?param='+new Date().getTime()

so the sAjaxSource becomes on the form

/data/getdata.asp?param=1401278688565 

This is basically the same thing jQuery is doing, when cache : false is set on a AJAX-request.

 

Source: https://stackoverflow.com/questions/23909590/how-to-refresh-datatable-list-jquery

 

 

USING HTML5’S “DATA” ATTRIBUTES WITH ASP.NET MVC’S INPUT HELPERS

Source: http://timgthomas.com/2012/02/using-html5s-data-attributes-with-asp-net-mvcs-input-helpers/

 

HTML5’s “data” attributes are a great way to store metadata about a particular
element in your markup without invalidating your HTML. They’re easy to use (just
add “data-myvalue” as an attribute on your markup) and tools like jQuery can
access the data stored therein easily. Take this example:

<input id='Email' name='Email' type='text' data-icon='envelope' />

We can get to this data with a simple jQuery call:

var icon = $('a#lnk-email').data('icon');

However, if you’re using ASP.NET MVC’s input helpers (as I am on my current
project), you may run into an issue adding attributes to your input elements.
As a reminder, the syntax for one overload of the TextBoxFor() method, for
example, looks like this:

@Html.TextBoxFor(
   x => x.Email, // A lambda expression pointing to a property on the model
   new {  }) // An anonymous object representing any HTML attributes to apply

The anonymous object above is the source of our problem. Why? That’s an actual
block of C# code, where hyphens aren’t allowed inside variable names. So
dropping-in a “data” attribute, like this:

@Html.TextBoxFor(x => x.Email, new { data-icon = "envelope" })
//                                       ^ The problem.

…throws a syntax error. Fortunately, the MVC team has provided us with an easy
workaround: replace the hyphen with an underscore, and you’re good to go!

@Html.TextBoxFor(x => x.Email, new { data_icon = "envelope" })
//                                       ^ The workaround.

This is both valid C# and renders out to our desired markup:

<input id='Email' name='Email' type='text' data-icon='envelope' />

HTML5’s “data” attributes are an excellent solution for embedding data in your
markup, and, thanks to a convenient method overload, even ASP.NET MVC users
aren’t left out due to variable naming rules.