JQuery DataTables Plugin - sAjaxSource

Question

I get my data from the asp.net web service and I was wondering if there is a way to pass this data (in json formar directly from the web service) to the DataTables object. I would like to do something like:

$(document).ready(function() { $('#example').dataTable( { "bProcessing": true, "bServerSide": true, "sAjaxSource": "http://localhost/WebService/GetData", } ); } ); 

Answer 1

Yes you can do it. Is that what you mean? ... transfer data to the server?

 $(document).ready(function() { $('#example').dataTable( { "bProcessing": true, "bServerSide": true, "sAjaxSource": "../examples_support/server_processing.php", "fnServerData": function ( sSource, aoData, fnCallback ) { /* Add some extra data to the sender */ aoData.push( { "name": "more_data", "value": "my_value" } ); // this line will give additional data to the server... $.getJSON( sSource, aoData, function (json) { /* Do whatever additional processing you want on the callback, then tell DataTables */ fnCallback(json) } ); } } ); } ); 

Answer 2

Here you can find one article about using DataTables with ASP.NET MVC Integrating jQuery DataTables with ASP.NET MVC .

Hope this helps you. There are a few things that can help you (a model class for accessing parameters and a DataTables class for direct serialization in JSON). This makes the code a little cleaner.

Hi

Answer 3

I'm working on it right now. I am using ASP.Net MVC 2 web application using religious data tables and you need to show over 1000 records in each table. Server-side processing is the way for me. Here is what we have.

Here is our ad in view (/ Admin / Unassigned).

 <script type="text/javascript" charset="utf-8"> $(document).ready(function() { $('#adminUnassignedTable').dataTable({ "bProcessing": true, "bServerSide": true, "sAjaxSource": "/Admin/UnassignedTable" }); }); </script> 

Here is our controller function (/ Admin / UnassignedTable).

 public void UnassignedTable() { statusID = (int)PTA.Helpers.Constants.Queue; locationID = (int)PTA.Helpers.Constants.Reviewer; _AdminList = PTA.Models.IPBRepository.GetIPBsByStatus(Convert.ToInt32(statusID), Convert.ToInt32(locationID)); //_AdminList is an IEnumerable<IPB>, IPB being our class IEnumerable<IPB> _NewList; int nDisplayStart = Convert.ToInt32(HttpContext.Request.QueryString.Get("iDisplayStart"); int nDisplayLength = Convert.ToInt32(HttpContext.Request.QueryString.Get("iDisplayLength"); _NewList = _AdminList.Skip<IPB>(nDisplayStart).Take<IPB>(nDisplayLength).ToList<IPB>(); string strOutput = "{"; strOutput += "\"sEcho\":" + HttpContext.Request.QueryString.Get("sEcho") + ", "; strOutput += "\"iTotalRecords\":" + _AdminList.Count().ToString() + ", "; strOutput += "\"iTotalDisplayRecords\":" + _AdminList.Count().ToString() + ", "; strOutput += "\"aaData\":["; foreach (IPB ipb in _NewList) { strOutput += "[ "; strOutput += "\"" + ipb.IPBName + "\","; strOutput += "\"" + ipb.PubDate + "\","; strOutput += "\"" + ipb.Change + "\","; strOutput += "\"" + ipb.ChangeDate + "\","; strOutput += "\"" + ipb.TotalParts + "\","; strOutput += "\"" + ipb.TotalPartsReports + "\","; strOutput += "\"" + ipb.ALC + "\","; strOutput += "\"" + ipb.DateAdded + "\","; strOutput += "\"" + "" + "\","; //Need to add drop down control, that why it blank. strOutput += "\"" + "" + "\","; //Need to add drop down control, that why it blank. strOutput += "\"" + "" + "\","; //Need to add drop down control, that why it blank. strOutput += "\"" + "" + "\""; //Need to add drop down control, that why it blank. strOutput += "]"; if (ipb != _NewList.Last()) { strOutput += ", "; } } strOutput += "]}"; Response.Write(strOutput); } 

Note!!!!!!! When adding a control, you must put your quotation marks for your control values ​​as \\ "because the backslash must be in the JSON data.

We hope that in the controller you can access your web service. I am not very familiar with web programming, so I don’t know what you need to do. I just thought that would help.

Answer 4

Perhaps if your web service meets the requirements of the DataTables API. Take a look at http://datatables.net/usage/server-side

---

UPDATE

I used the AjaxSource DataTables in my ASP.NET MVC application the way you want, specifying it in the initialization procedure. However, my server side has been specifically designed so that DataTables can talk to it.

Answer 5

I ended up compiling a table. Enough for my purposes, which are pretty minimal right now.

Answer 6

Yes.

Create an object that will store Datatables data in the correct format. I used the structure:

 Public Structure DatatablesObject Public sEcho As Integer Public iTotalRecords As Integer Public iTotalDisplayRecords As Integer Public aaData As List(Of List(Of String)) End Structure 

We actually created our own Serializer for this, but the concept is the same. Scroll through your data source and populate this object, then serialize and answer:

 Dim ser As New JavascriptSerializer Dim obj As New DatatablesObject With {.sEcho = {Passed In}, .iTotalRecords = {Passed In}, .iTotalDisplayRecords = {Passed In}} Dim container As New List(Of List(Of String)) If value IsNot Nothing Then For Each dr As DataRow In value.Rows Dim list As New List(Of String) For Each dc As DataColumn In dr.Table.Columns list.Add(If(dr(dc.ColumnName) Is DBNull.Value, String.Empty, "" & dr(dc.ColumnName) & "")) Next container.Add(list) Next End If obj.aaData = container Response.Cache.SetCacheability(HttpCacheability.NoCache) Response.ContentType = "application/json" Response.Write(ser.Serialize(obj)) 

This should be serialized in the correct format. If you need to add data in a specific order, you will need to change the loop. Keep in mind that {Passed In} are values ​​that are passed to a function or directly assigned to these variables from a query.