QUESTION:
I don't understand why the 'contentType' parameter cannot be found. I have it spelled correctly. I'm assuming I'm not setting the parameters correctly.

Any ideas?

ERROR:
DataTables warning: table id=attachment - Requested unknown parameter 'contentType' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4

JSON:

[{
    "_data$p$0": {
        "id": "AAMkADU4MzkxN2RmLTdiZS53ao=",
        "name": "somefile.xlsx",
        "contentType": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
        "size": 43069,
        "attachmentType": 0,
        "isInline": false
    }
}]

JAVASCRIPT:

Office.initialize = function (reason) {
    $(document).ready(function () {
        app.initialize();
        window.alert = function (message) { app.showNotification("DataTable", message); };
      
        

        var attachments = localStorage.getItem("Attachments");
        

        console.log(attachments);
        // Display Table
        $('#attachment').DataTable({
            data: attachments,
            columns: [
                { data: 'contentType' },
                { data: 'name' }
            ]
        });

    });
};

HTML:

            <table id="attachment" class="display">
                <thead>
                    <tr>                       
                        <th>Type</th>
                        <th>Name</th>
                    </tr>
                </thead>
            </table>

When i change page, the start parameter is correct, 0 at first page, 10 at second, etc (assuming pagelenght is 10).

The problem is when I order the table, then, the start parameter is allways 0 which implies that paging is completely lost.

My backend is c# (asp mvc 5) and this is how i'm reciving the parameter

var start = Request.Form.GetValues("start").FirstOrDefault();

And this is my datatable

var table = $('#demoGrid').DataTable
        ({
        processing: true,
        serverSide: true,
        filter: true,
        orderMulti: false,
        paging: true,
        pageLength: 10,
        colReorder:
            {
                fixedColumnsLeft: 1
            },
        ajax:
            {
            "url": '@Url.Action("Cargar")',
            "type": "POST",
            "datatype": "json",            
            },
        order: [[1, 'desc']],
            "columns": [
            { data: null, name: "Accion", "autoWidth": true, orderable: false, width: "8%", defaultContent: stringAcciones, className: "text-center" },
            { "data": "Codigo_delfos", "name": "Codigo_delfos", "autoWidth": true}]
            //much more columns
        });

what am i doing wrong?

Thanks so much!

As you can see in the screenshot the columns header size is change after i click on the tab
the code for the tabs is

  $( function() {
    $( "#tabs" ).tabs();
  } );

is there a way to change it?
to keep the size fully width as the size of the table?

Pardon, I accidentally hit 'Yes' on a reply that was not the answer to my question.

The question is here: https://datatables.net/forums/discussion/comment/143258#Comment_143258

How to use the dataTable as inline table? I don't want to use the full width because another inline element should be placed next to it. But there is a bug when used with the responsive extension.

To reproduce the problem:
Go to http://live.datatables.net/rinorupo/3/edit?html,css,js,output
Resize the output window to show all, then hide the last column and afterwards try to get the last column back.

Is there a class to set like https://datatables.net/manual/styling/classes or another solution?

Hey,

I'm trying to see if this is possible. I'm looking to provide the data table information, but don't show the user until they selected a filter option and then just show that data filtered.

http://live.datatables.net/tobabovo/1

As you can see I have a filter tab. In my current setup. I'll have a filter section where the user can select what they want to see. I'd be using something like https://datatables.net/examples/api/regex.html, but I'll have checkboxes

My problem is the search is not working on my first column if its a single digit number i.e,
serial number 1 to 9 but the rest of the columns the datatables search is working fine.

Here is the code

`
<script>
// global the manage memeber table

var manageMemberTable;
$(document).ready(function() {
    manageMemberTable = $("#manageMemberTable").DataTable({
        "aLengthMenu": [
                [5, 10, 15, -1],
                [5, 10, 15, "All"]
            ],
        "processing": true,
                "serverSide": true,
                "type": "POST",
                "datatype": "json",
                "dataSrc": "",
                "ajax": {
                    "url": "server_inprocess.php",

                },



                "columns": [

                    { "data": "0", "name": "0", "autoWidth": true },
                    { "data": "1", "name": "1", "autoWidth": true },
                    { "data": "2", "name": "2", "autoWidth": true },
                    { "data": "3", "name": "3", "autoWidth": true },
                     {

                "targets": -1,
                "orderable":      false,
                "data":  "null",
                "className": "center",
                "defaultContent": '<a type="button" class="edit btn btn-primary"> <span class="glyphicon glyphicon-edit"></span>&nbsp Edit</a> / <a type="button" class="delete btn btn-primary" > <span class="glyphicon glyphicon-trash"></span>&nbsp Delete</a>'
            }

                ]


    });
});
</script>
`

Here is my ssp class code,

`
<?php

/*
 * DataTables example server-side processing script.
 *
 * Please note that this script is intentionally extremely simply to show how
 * server-side processing can be implemented, and probably shouldn't be used as
 * the basis for a large complex system. It is suitable for simple use cases as
 * for learning.
 *
 * See http://datatables.net/usage/server-side for full details on the server-
 * side processing requirements of DataTables.
 *
 * @license MIT - http://datatables.net/license_mit
 */

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Easy set variables
 */

// DB table to use
$table = 'tblcomplaints';

// Table's primary key
$primaryKey = 'complaintnumber';

// Array of database columns which should be read and sent back to DataTables.
// The `db` parameter represents the column name in the database, while the `dt`
// parameter represents the DataTables column identifier. In this case simple
// indexes
$columns = array(
    array( 'db' => 'complaintnumber', 'dt' => 0 ),
    array( 'db' => 'regDate','dt' => 1,
        'formatter' => function( $d, $row ) {
            return date( 'd-m-Y', strtotime($d));
        }),
    array( 'db' => 'lastUpdationDate',  'dt' => 2 ),
    array( 'db' => 'status',   'dt' => 3 )



);

// SQL server connection information
$sql_details = array(
    'user' => 'root',
    'pass' => '',
    'db'   => 'testing',
    'host' => ''
);


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * If you just want to use the basic configuration for DataTables with PHP
 * server-side, there is no need to edit below this line.
 */

require( 'vendor\ssp.class.php' );
//$where = "status ='in process'";
echo json_encode(
   // SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns, $where )
    SSP::complex( $_GET, $sql_details, $table, $primaryKey, $columns, null, "status is null" )

);

`

Good afternoon
I'm trying to create a search engine to be able to select a record within a custom editor: template: '#customForm',
The field I want to filter is:
<editor-field name = "tb_palabra []. id"> </ editor-field>
I would appreciate any surgency.
A greeting.

Hello Everyone,

I am struggling for hours now, i got a function which is called editMember in javascript, what i am trying to do is pass my columns "Data"."0" when the edit button is clicked.

I am getting an error

Uncaught ReferenceError: data is not defined at HTMLAnchorElement.onclick (index.php:1)

Here is code:

"columns": [ 

                { "data": "0", "name": "0", "autoWidth": true },
                    { "data": "1", "name": "1", "autoWidth": true },
                    { "data": "2", "name": "2", "autoWidth": true },
                    { "data": "3", "name": "3", "autoWidth": true },
         {
                    
        "orderable":      false,
                "data":  "null",
                "className": "center",
                "defaultContent": '<a type="button" class="btn btn-primary"  data-toggle="modal" data-target="#editMemberModal"  onclick="editMember(data[0])"> <span class="glyphicon glyphicon-edit"></span>Edit</a> / <a href="" class=class="btn btn-danger">Delete</a>'
            }

Please can someone help?

onclick="editMember(data[0])"

I am using SmartAdmin Angular 5 framework 1.9.1, which provides DataTables capabilities. The examples that SmartAdmin provides are working fine, but they did not provide an example showing how to include a checkbox for each row, so that the ID can be used to delete, or modify, a selected row. I have studied the DataTables documentation on checkboxes ( https://datatables.net/extensions/select/examples/initialisation/checkbox), trying to guess how SmartAdmin might have handled checkboxes, but nothing I've tried has worked.

Here is what my code currently looks like:

              <sa-datatable
                [options]="{
                  data: sysMsgs,
                  columns: [
                  {data: 'rowid'},
                  {data: 'senderID'},
                  {data: 'message'},
                  {data: 'dateCreated'}
                  ],
                  buttons: [
                    'copy', 'csv', 'pdf', 'print'
                  ]
                }"
                tableClass="table table-striped table-bordered table-hover"
              >
                <thead>
                <tr>
                  <th data-hide="mobile-p">ID</th>
                  <th data-hide="mobile-p">Sender</th> 
                  <th data-hide="mobile-p">Message</th>
                  <th data-hide="mobile-p">Date Sent</th>
                </tr>
                </thead>
              </sa-datatable>

This renders the following table:

It seems like I should be able to add an option for Checkboxes. Any ideas on how to do it?

Thanks.
Bob

I have a problem, when the page loads the start parameter is 0. But when click to the second page (previous or other page), i see the first page again and the active button is 1 don't change to 2 pager or other page.

The code below, variable info i see page and start with value 0.

 "data": function (d) {
                    var info = $('#btable').DataTable().page.info();
                    d.DateI = $('#min').val();
                    d.DateF = $('#max').val();

                    return d;
                },

Backend paramenter,

int start = Convert.ToInt32(Request["start"]);

Json response is,

"{"data":[....],"draw":9,"recordsTotal":180,"recordsFiltered":180,"recordsYes":76,"recordsNo":32,"recordsNot":72,"dateMax":"11/05/2018","dateMin":"11/05/2018"}"

table = $('#btable').DataTable({
            "responsive": true,
            "dom": "<'row'<'col-6'l><'col-6'f>><'row'<'col-12'rt>><'row'<'col-6'i><'col-5'p>>",
            "paging": true,
            "displayStart": 0,
            "pageLength":10,
            "processing": true,
            "serverSide": true,
            "ajax": {
                "url": "/Admin/GetAll",
               "type": 'POST',
                "datatype": "json",
                "data": function (d) {
                    d.DateI = $('#min').val();
                    d.DateF = $('#max').val();

                    return d;
                },
                "dataFilter": function (res) {
                    var result = JSON.parse(res);
                    if (result.Max === result.Min) {
                        $('#RangeDate').text("");
                        $('#RangeDate').append('Date: ' + result.Max);
                    } else {
                        $('#RangeDate').text("");
                        $('#RangeDate').append('Date ' + result.Min + " and " + result.Max);
                    }
                    return res;
                }
            },
            "createdRow": function (row, data, dataIndex) {
                if (data.Status === 'No') {
                    $(row).addClass('rowNo);
                }
                else if (data.Status === 'Yes') {
                    $(row).addClass('rowYes');
                } else {
                    $(row).addClass('rowNot');
                }
            },
            columnDefs: [
                { "name": "Id", "targets": 0 },
                { "name": "Name", "targets": 1 },
                { "name": "Status", "targets": 2 },
                { "name": "ExecutionDate", "targets": 3 }
            ],
            columns: [
                {
                    data: "Id"
                },
                { data: "Name" },
                { data: "Status" },
                {
                    data: "ExecutionDate",
                    format: 'dd/mm/YYYY',
                    "render": function (data) {
                        if (data === null) {
                            return '';
                        } else {
                            //Replace date format
                        }
                    }
                }

            ], initComplete: function () {

                var columnDate = this.api().column(3);

                $('#min').change(function () {
                    var val = $(this).val();
                    columnDate.search(val, true, false).draw();
                });
                $('#max').change(function () {
                    var val = $(this).val();
                    columnDate.search(val, true, false).draw();
                });
            }
        });

what is wrong?

thanks,
feups

I'm facing exact same issue as discussed in this thread.

https://datatables.net/forums/discussion/19437/how-to-always-show-a-fixed-number-of-rows

I have both the horizontal and vertical scroll. The last row gets hidden behind the horizontal scroll but the count below shows that included so this kind of confusing for the user to view 1 row lesser than it says. Please advice me on how to approach this issue.

Also on scrolling say if the first row shows just half of the row still datatable counts it considers it as a full single row. Is there way to do a smooth scroll without showing half row?

I'm facing exact same issue as discussed in this thread.

https://datatables.net/forums/discussion/19437/how-to-always-show-a-fixed-number-of-rows

I have both the horizontal and vertical scroll. The last row gets hidden behind the horizontal scroll but the count below shows that included so this kind of confusing for the user to view 1 row lesser than it says. Please advice me on how to approach this issue.

Im using
''' ..."dom" : 'rtiSB',
"serverSide" : true,
"processing" : true,
"scrollY" : 324,
"scrollX" : true, ... '''
Also on scrolling say if the first row shows just half of the row still datatable counts it considers it as a full single row. Is there way to do a smooth scroll without showing half row?

Hi,

I'm using datatable for a internal portal. I have used the datatables CDN to include the JS file. As seen here

<script src="http://cdn.datatables.net/responsive/2.1.1/js/dataTables.responsive.min.js"></script>

In the last few months there have been instances where i see some strange sites getting opened when user clicks on datatable links. I initially thought it might be some click bait kind of addin from chrome for the specific user. But as days went on i found many users raising the complaint. When analyzed i found the malicious links are getting invoked through the CDN JS scripts that i have included. Please see screen shots of chrome inspection window

The malicious link http://mutualvehemence.com/rZj9J7NO6HBw4h0f3/7259?_=1542862081322 is invoked from Datatble included through cdn.

I have a valid license for Datatable editor for single site usage so i don't think this is because of license. Please let me know fi anybody else have faced similar issue and how this can be sorted out.

Thanks

I'm using datatables incorprated inside OctoberCMS - a Laravel based flatfile cms.
So as to make best use of the generator, I'd like to keep datatables related files in a separate folder off the webroot.

I need to pass a user ID to the datatables php backend - backend for security reasons then send a backend filtered dataset to the datatables front end.

Has anyone got any ideas on best practices?

Always greatly appreciate any help

I've recently converted my table to server side processing with a php script and it's working well, including column sorting.

However, I have a column with specially formatted data, so I've tried to implement rendering/orthogonal data but the column sorting has stopped working. I've been trying several things - I've gotten the sort to work when I point the datatable to an ajax txt file on the server, but as soon as I change to serverside/processing and point the datatable to a php script then the sort stops working.

I've looked at the $_GET server variables and it appears that the order data being sent is the same, but I'm guessing I need to update my php script sort function to use the sort data rather the display data. It'd be helpful if someone who has done this could confirm...and if there is some documentation somewhere I'd appreciate seeing it.

i want to add row which will show report duration from date to date on the top of excel how can i do it.

Hi All,

I am using editor-1.6.5, with custom form layout.
Form Layout is:
<div className="container addAccountCustomFormLayout"> <div className="row"> <div className="col"> <editor-field name="account_number"></editor-field> <editor-field name="account_owner_name"></editor-field> <editor-field name="doing_business_as"></editor-field> <editor-field name="current_year_status_id"></editor-field> <editor-field name="street_address"></editor-field> <editor-field name="city_town"></editor-field> <editor-field name="zip_code"></editor-field> </div> <div className="col"> <editor-field name="client_id"></editor-field> <editor-field name="client_property_id"></editor-field> <editor-field name="state_id"></editor-field> <editor-field name="county_id"></editor-field> <editor-field name="cost_center"></editor-field> <editor-field name="property_type_id"></editor-field> <editor-field name="legal_description"></editor-field> </div> </div> </div>
among these fields 'state_id', 'current_year_status_id', 'client_id', 'county_id', 'property_type_id', 'state_id' are select fields.

but If I like to edit a row in a table, these select fields not auto selecting the option of that value. why?? I am not getting. Those respective field column are in table but visibility set to false in table.

And on Change those field values are empty i.e. example-> state_id: [''] in POST/PATCH submit data. WHY??

I am building this code in a django and reactjs application.

Hi All,
I have recently upgraded my application from DT-1.10.7 to 1.10.18 and now select-all checkbox is not appearing on grids. On analysis i found this is bcoz of select.datatables.css as it has tbody added in selectors(PFA the image of comparison for better clarity). Due to this the checkbox is not appearing on "th" element. Now my question is, is this a bug in latest grid or it was a bug in older grid and how to resolve it? Any help would be appreciated

I require a username and password for inserting/editing/deleting any row in my data table.

I'm using the pure js datatables editor set up with mvc. It works fine for create/edit because I just include the username and password fields in my model. But for delete I don't seem to be able to map it to a template, or add/show any fields? It's stuck at just being one button "delete".

How do I have inputs on the delete modal?

Thanks

JackTrap