How to get the parameters on MVC Controller send by ajax serverSide datatable 1.10

jhpe

Hi
I'm working on MVC 5, and I'm trying to get the parameters send by the ajax serverSide (DataTables 10), currently I'm using the following example:

        public JsonResult AjaxHandler(jQueryDataTableParamModel param)
        {
            var dataResult = new List<string[]>() {
                    new string[] {"1", "Microsoft", "Redmond", "USA"},
                    new string[] {"2", "Google", "Mountain View", "USA"},
                    new string[] {"3", "Gowi", "Pancevo", "Serbia"}
                    };

            return Json(new
            {
                draw = param.draw,
                recordsTotal = dataResult.Count(),
                recordsFiltered = dataResult.Count(),
                data = dataResult
            },
            JsonRequestBehavior.AllowGet);
        }

and my questions is about how to configure my jQueryDataTableParamModel class in order to get the parameters send by the DataTable.

    public class jQueryDataTableParamModel
    {
        public int draw { get; set; }
        public int start { get; set; }
        public int length { get; set; }
        public Dictionary<string, string> search { get; set; }
         List<Dictionary<string, string>> order { get; set; }
        List<Dictionary<string, string>> columns { get; set; }
    }

Right now my example is working however I'm not getting the values for order and columns, just draw, start,length and search.
Can you help me to define the correct definition for order and columns in order to get the values send by the datatable.
I debug the request send to the controller and I get the following:

Request GET /Home/AjaxHandler?
draw=1&
columns[0][data]=0&
columns[0][name]=&
columns[0][searchable]=true&
columns[0][orderable]=true&
columns[0][search][value]=&
columns[0][search][regex]=false&
columns[1][data]=1&
columns[1][name]=&
columns[1][searchable]=true&
columns[1][orderable]=true&
columns[1][search][value]=&
columns[1][search][regex]=false&
columns[2][data]=2&
columns[2][name]=&
columns[2][searchable]=true&
columns[2][orderable]=true&
columns[2][search][value]=&
columns[2][search][regex]=false&
columns[3][data]=3&
columns[3][name]=&
columns[3][searchable]=true&
columns[3][orderable]=true&
columns[3][search][value]=&
columns[3][search][regex]=false&
order[0][column]=0&
order[0][dir]=asc&
start=0&
length=10&
search[value]=&
search[regex]=false&

I really appreciate your help about how to get the columns and order values...

trashMe72

same problem here...
Developin in Visual Strudio 2013 fw 4.5.1 and datatablesd 1.10.7.
I'm not able to get in request string params like "sEcho" or "sSearch"
any idea?
thank you all!

my datatables

$('#tabella').DataTable({
processing: true,
serverSide: true,
language: dataTables.it,
search: {
"caseInsensitive": true
},
pageLength: 10,
lengthChange: false,
columns: [
{
data: "Nome",
name: "Nome"
}, {
data: "Cognome",
name: "Cognome"
}]});

DaveMiller

I am having the same issue here. The parameters being passed in, especially the search[value] parameter are not able to be processed by the server side language.

I did read some information about activating a legacy mode to get the pre version 1.10 parameters to be passed in.

...
$.fn.dataTable.ext.legacy.ajax = true;
...
I will try this one later and let you know, however, it would be nice to have parameters sent in that make more sense.

The search[value] parameter as processed by ColdFusion would assume that 'value' is a an integer index to an array position or a string key for a structure. However, 'value' is never declared on it's own, so there is no real way to know.

DaveMiller

I found this elsewhere to process the search[value]

http://www.datatables.net/forums/discussion/22255/coldfusion-1-10-search-value-question

<cfset search_value = form['search[value]']>

fatih

Here is my solution

Here Is classes

public class JQDTParams
    {
        public int draw { get; set; }

        public int start { get; set; }
        public int length { get; set; }


        public JQDTColumnSearch  /*Dictionary<string, string>*/ search { get; set; }
        public List<JQDTColumnOrder/*Dictionary<string, string>*/> order { get; set; }
        public List<JQDTColumn/*Dictionary<string, string>*/> columns { get; set; }

    }


    public enum JQDTColumnOrderDirection
    {
        asc, desc
    }

    public class JQDTColumnOrder
    {
        public int column { get; set; }
        public JQDTColumnOrderDirection dir { get; set; }
    }
    public class JQDTColumnSearch
    {
        public string value { get; set; }
        public string regex { get; set; }
    }

    public class JQDTColumn
    {
        public string data { get; set; }
        public string name { get; set; }
        public Boolean searchable { get; set; }
        public Boolean orderable { get; set; }
        public JQDTColumnSearch search { get; set; }
    }

And Usage

HTML

<div>

    <table id="aractipiListesi" class="display" cellspacing="0" width="100%">
        <thead>
            <tr class="filter-input">
                <th>PK</th>
                <th>Markası</th>
                <th>Modeli</th>
                <th></th>
            </tr>
            <tr>
                <th>PK</th>
                <th>Markası</th>
                <th>Modeli</th>
                <th></th>
            </tr>
        </thead>
    </table>

    <script type="text/javascript">

      $(document).ready(function () {
          $('#aractipiListesi').DataTable({
              "processing": true,
              "serverSide": true,
              "filter": true,
              "pageLength": 8,
              "columns": [
                  {
                      "name": "ID",
                      "orderable": false
                  },
                  {
                      "name": "MARKAADI",
                      "orderable": true
                  },
                  {
                      "name": "TIPADI",
                      "orderable": true
                  },
                  {
                      "name": "SEC",
                      "orderable": false
                  }
              ],
              "ajax":
                  {
                      url: "@Url.Action("AracTipiAra", "Common", new { area = "" })",
                      type: "post"
                  },
              "columnDefs":
                  [
                      {
                          "render": function (data, type, row) { return AracTipiListesiTableDropDownToggle(data, type, row); },
                          "targets": [3]
                      },
                      {
                          "visible": false,
                          "targets": [0]
                      }
                  ],

              "language": DTConstants.Language


          });

          var aractipi_filtrelenecekBasliklar = ['Markası', 'Modeli'];
          // Setup - add a text input to each footer cell
          $('#aractipiListesi thead .filter-input th').each(function () {
              var title = $(this).text();
              if (title != '' && $.inArray(title, aractipi_filtrelenecekBasliklar) >= 0) {
                  $(this).html('<input type="text" placeholder="' + title + ' Ara" />');
              }
          });

          // DataTable
          var table = $('#aractipiListesi').DataTable();

          // Apply the search
          table.columns().every(function () {
              var that = this;

              $('input', this.footer()).on('keyup change', function () {
                  if (that.search() !== this.value) {
                      that.search(this.value).draw();
                  }
              });
          });
        });
    </script>


</div>

---

Controller

---

 public JsonResult AracTipiAra(JQDTParams param)
        {
            using (var db = new MBOSSEntities())
            {
                var q = from x in db.VW_ARACMARKATIPI select x;
                var nonfilteredcount = q.Count();
                //filter 
                //-------------------------------------------------------------------
                foreach (var item in param.columns)
                {
                    var filterText = item.search.value;
                    if (!String.IsNullOrEmpty(filterText))
                    {
                        filterText = filterText.ToLower();
                        switch (item.name)
                        {
                            case "MARKAADI":
                                q = q.Where(
                       x =>
                           x.MARKAADI.ToLower().Contains(filterText)

                   );
                                break;
                            case "TIPADI":
                                q = q.Where(
                       x =>
                           x.TIPADI.ToLower().Contains(filterText)

                   );
                                break;
                        }
                    }
                }
                //order
                //-------------------------------------------------------------------
                foreach (var item in param.order)
                {
                    string orderingFunction = "MARKAADI";
                    switch (item.column)
                    {
                        case 1: orderingFunction = "MARKAADI";
                            break;

                        case 2: orderingFunction = "TIPADI";
                            break;

                    }

                    q = OrderClass.OrderBy<VW_ARACMARKATIPI>(q, orderingFunction, item.dir.GetStringValue());
                }

                //result
                //-------------------------------------------------------------------
                var filteredCount = q.Count();
                q = q.Skip(param.start).Take(param.length);
                var data = q.ToList()
                    .Select(r => new[] {
                        r.ARACMARKAPK.ToString(),
                        r.MARKAADI,
                        r.TIPADI,
                    }

                    );
                return Json(new
                {
                    draw = param.draw,
                    recordsTotal = nonfilteredcount,
                    recordsFiltered = filteredCount,
                    data = data
                }, JsonRequestBehavior.AllowGet);

            }

        }