Showing 0 to 0 of 0 entries (filtered from NaN total entries)

mpm

My datatable shows some rows but doesn't show a good format of Date, this is a screenshot :

and this is my Ajax code:

@section scripts {
   
    <script src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#tableconsommation").DataTable({
                "ajax": {
                    "url": "/Consommations/GetList",
                    "type": "POST",
                    "datatype": "json"
                },
                "columns": [
                    { "data": "Date_consommation", "name": "Date_consommation" },
                    { "data": "Qtité_consommée", "name": "Qtité_consommée" },
                    { "data": "Id_unité", "name": "Id_unité" },
                    { "data": "Id_consommation", "name": "Id_consommation" },
                    { "data": "Unités_de_prod", "name": "Unités_de_prod" },
                ],
                "serverSide": "true",
                "order": [0, "asc"],
                "processing": "true",
                "language": {
                    "processing": "encours....veuillez patienter"
                }

            });
        });
    </script>

}

colin

Hi mpm,

I suspect the JSON response to the Ajax request is sending the date in that format - DataTables would just display it 'as is'. It's then possible that the slashes are messing up something else internally.

I'd say fix the JSON format first, even post it here if that would help, and hopefully that'll resolve the status summary line.

Cheers,

Colin

mpm

Thank you colin for your reply, this is the code in my Controller:

[HttpPost]
        public ActionResult GetList()
{
       var list=db.Consommation.select(x=>new
        {
         Id_consommation=x.Id_consommation,
          Date_consommation=x.Date_consommation,
          Qtité_consommée=x.Qtité_consommée,
           Id_unité=x.Id_unité,
            Unités_de_prod=x.Unités_de_prod
           });
  return Json(new { data = list }, JsonRequestBehavior.AllowGet);
        }

colin

Would you be able to post the JSON that it sends, please? That would be the most useful as we can see what's being passed to DataTables.

mpm

I thought that you mean the Controller method, In my project I have this Model:

namespace wb01.Models
{
    using System;
    using System.Collections.Generic;
    
    public partial class Consommation
    {
        public System.DateTime Date_consommation { get; set; }
        public double Qtité_consommée { get; set; }
        public int Id_unité { get; set; }
        public int Id_consommation { get; set; }
    
        public virtual Unités_de_prod Unités_de_prod { get; set; }
    }
}

And the Controller:

public class ConsommationsController : Controller
    {
        private database db = new database();

        // GET: Consommations
        public ActionResult Index()
        {
           
            return View();
        }
        [HttpPost]
        public ActionResult GetList()
        {
            List<Consommation> listconsom = new List<Consommation>();
            //using (database db = new database())
      
            var list = db.Consommation.Select(x => new
            {
                Date_consommation = x.Date_consommation,
                Qtité_consommée = x.Qtité_consommée,
                Id_unité = x.Id_unité,
                Id_consommation = x.Id_consommation,         
                    
                Unités_de_prod = x.Unités_de_prod.Commentaires,
            });
            return Json(new { data = list }, JsonRequestBehavior.AllowGet);

        }

And in my View:

<table @*class="display"*@ id="tableconsommation">
    <thead>
        <tr>
            <th>Date_consommation</th>
            <th>Qtité_consommée</th>
            <th>Id_unité</th>
            <th>Id_consommation</th>
            <th>Unités_de_prod</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Date_consommation</th>
            <th>Qtité_consommée</th>
            <th>Id_unité</th>
            <th>Id_consommation</th>
            <th>Unités_de_prod</th>
        </tr>
    </tfoot>
</table>
@section scripts {
    
    <script src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#tableconsommation").DataTable({
                "ajax": {
                    "url": "/Consommations/GetList",
                    "type": "POST",
                    "datatype": "json"
                },
                "columns": [
                    { "data": "Date_consommation", "name": "Date_consommation" },
                    { "data": "Qtité_consommée", "name": "Qtité_consommée" },
                    { "data": "Id_unité", "name": "Id_unité" },
                    { "data": "Id_consommation", "name": "Id_consommation" },
                    { "data": "Unités_de_prod", "name": "Unités_de_prod" },
                ],
                "serverSide": "true",
                "order": [0, "asc"],
                "processing": "true",
                "language": {
                    "processing": "encours....veuillez patienter"
                }
 
            });
        });
    </script>
 
}

Hope that I understand your request, Thanks in advance .

colin

Hi,

No, I was hoping to see the data that gets transferred from the server, back to DataTables - so in this example here, it's what you see in the Ajax tab. You can also get in the browser's Network tab.

Cheers,

Colin

mpm

Hi colin, that's what I get when I changed [HttPost] to [HttpGet]:

{"data":[{"Date_consommation":"\/Date(1520377200000)\/","Qtité_consommée":0,"Id_unité":5,"Id_consommation":1,"Unités_de_prod":"Phosphorique 1"},{"Date_consommation":"\/Date(1520377200000)\/","Qtité_consommée":0,"Id_unité":6,"Id_consommation":2,"Unités_de_prod":"Phosphorique 2"},{"Date_consommation":"\/Date(1520377200000)\/","Qtité_consommée":0,"Id_unité":7,"Id_consommation":3,"Unités_de_prod":"Phosphorique 3"},{"Date_consommation":"\/Date(1539298800000)\/","Qtité_consommée":50,"Id_unité":5,"Id_consommation":4,"Unités_de_prod":"Phosphorique 1"},{"Date_consommation":"\/Date(1518217200000)\/","Qtité_consommée":50,"Id_unité":5,"Id_consommation":5,"Unités_de_prod":"Phosphorique 1"}]}

colin

Thanks for that, and yep, you're sending those backslashes and Date(number) back in your request. They don't appear to do any harm, as shown here, but I suspect that's not what you really want to be showing.

The problem with the summary status, I think, is because of the JSON response, you're not including the paging information. It should also contain elements like these:

  "draw": 1,
  "recordsTotal": 57,
  "recordsFiltered": 57,

See this example, the format is in Ajax tab.

mpm

Thank you colin, how can I fix the format problem of Date,?

colin

There's two ways you can.

1. change your server-side script to send data in the format you wish to display. This is the best solution, since the server is likely to be nimbler and better suited to that, especially if the dataset is large.

2. render the column on the client, with columns.render - see the functions near the bottom of that page. Here, you can strip out the blackslashes from\/Date(1520377200000)\/and convert the date. However, while it will work, there may be a performance cost to doing this.

Hope that helps,

Cheers,

Colin