Same/similar error as reported here, but without using any joins: https://datatables.net/forums/discussion/39387/fatal-error-call-to-a-member-function-insertid-on-null. Full error:

PHP Fatal error:  Call to a member function insertId() on a non-object in /var/www/html/new/includes/editor/php/Editor/Editor.php on line 1601

Upgrading from Editor 1.5 to 1.6, haven't been able to pin down what's causing it yet. The referenced post had to do with Mjoin, which I'm not using. Trying to troubleshoot, but I don't think I can use the datatables debug area since it's server-side scripts.

Thoughts?

I am stacking several tables on a page, and they share the same header (but different math)

Odd issue with Editor 1.6.1 using the new Oracle integration. Normal usage works great - but if I set processing/server-side bits, searching fails and the footer always says, "Showing 0 to 0 of 0 entries (filtered from NaN)". This seems to work great from MySQL, but not from Oracle.

Trying to dig into things, but I didn't see this being reported (or if anyone else is using Oracle yet).

I have successfully done some data calculations via the drawCallback function in the API per the suggestion of another user here. However I cannot seem to figure out how to modify the cells I need with the new data. Here is my function which works and logs the calculations to the console...

"drawCallback": function (settings) {
                           var api = this.api();
                           var myData = api.rows({ page: 'current' }).data();
                           var z = $("#sct_size_wrapper > div > div > div > table > " +
                               "tfoot > tr > td:eq(3)").html();
                               z = z.split(',').join('');
                               for (var i = 0; i < myData.length; i++) {
                                   var y = myData[i][3];
                                   var result = parseFloat((y / z) * 100);
                                   result = result.toFixed(2);
                                   console.log(result);
                                   myData[i][4] = result;
                               }
                       }

Any help or tips would be appreciated!

A question I thought I would find a quick answer to but I can't seem to so far.

How do I make the Editor bubble wider?

Then, how do I customize the size of the fields displayed within it?

Regards,
Jim

I use the DataTables plugin for managing a table with the server-side data source https://datatables.net/examples/data_sources/server_side.html + the Editor plugin.

After some field is edited, submitted and a response from the editor's server handler is returned, the table always completely reloads itself, sending an extra AJAX request to the server, even though there's no need to do that since only one field in only one row was changed and all the data required to redraw the table row have already been received in the previous inline edit response.

So the question is whether it's possible to get rid of the extra AJAX call and redraw the edited row only, rather than completely refreshing the whole table.

I'm new to Data Table, so please point me in the right direction.

I'm using Coldfusion to generate a customized report in PDF. At the Datatable, I would like to print a one page report for each of the records. So instead of printing one report at a time, I would like to have a button next to the 'excel' button called 'custom print' that would call the coldfusion file and perform a batch print by passing all of the ID's to the test_page.cfm page. What is the best way of doing this. Thanks.

For each row, my code is shown below.

{ "data": "ID",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
$(nTd).html("<a href='test_page.cfm?p="+oData.ID+"'>"+"Schedule"+"</a><br><a href='dd1970.cfm?comid="+oData.ID+"' target='_blank' >"+"Print DD 1970"+"</a>"); }
},

I would like to default a datetime in a form to the current time, without allowing the user to edit it when creating a new record. The current time appears to come up as the default without my doing setting the def, but the input field is editable by the user. I would like to be able to capture the current time without allowing the user to change it, or requiring the user to confirm the current time

Is this possible?

The field definition for this field is:

        fields: [
            {
                label: "tickettime:",
                name: "tickettime",
                type: "datetime",
//              def: "return new Date();",
                format: "YYYY-MM-DD HH:mm:ss"
            },
               ]

Thanks,
Tom

Okay, I have successfully implemented select2, except one thing. I do not seem to be able to figure out how to have the values already in datatables to show up in the editor as existing values when I use the multiselect tags.

In the table initiation, I have:

{
    title:      "Recipient(s)",
    name:       "recipients",
    data:       'recipients',
    orderable:  false,
    className:  "alignCenter displayOrder",
    render:     function(data, type, full, meta){
        return getRecipients(full.recipients);
    }
},

And in the editor for the same field I have:

{
      label:        "Individual recipient(s)",
      name:     "recipients",
      type:     "select2",
      opts: {
                multiple: true,
                placeholder: 'Select one or more recipients',
        minimumInputLength: 3,
        ajax:{
                url: "index.cfm?fuseaction=admin.recipientSearch",
            dataType: 'json',
                delay: 250,
            data: function (params) {
                  return {q: params.term};
                },
            processResults: function (data, params) {
                  return {results: data.results};
               },
               cache: true
        }
        }
},

What am I missing?

Any documentation on how to implement Editor in codeigniter?
Thanks.

I'am using a table with scrollY, however the Headers is not align to data columns, lose alignment

Help us!!!

I am attempting to use the Responsive extension for DataTables, and I notice that until I added order: to the DataTables object, the responsive column wouldn't show properly (would ignore the orderable: object on columnDefs for the responsive control column).

See my example here: http://live.datatables.net/yajamuvo/1/edit?html,js,output

(Mind, for some reason the responsive controls is not working here either, despite having invoked it correctly from what I can tell, but you can remove the order: object, and the responsive column does not display correctly.)

This is a bit frustrating, since in some cases I want my query output (what populates my DataTable) to determine the default sort order. Not a deal-breaker, but if this is a bug and can be resolved, all the better.

On a side note, I notice the documentation for responsive makes mention of a no-wrap class to be added optionally to the table - this is not correct, as the correct class is actually nowrap (minus the hyphen).

Hello,
Usually, certain data is not distributed in one table, but in several tables. As an example here times an order:

Tables:
- Order
-> Order ID
-> Customer ID
-> Payment method
...
- Customer
-> Customer ID
-> First name
-> Surname
...

I would like to take the table order as a representation table. In the Order table, for example, is a field with the customer ID. In the display and in the search, however, the customer ID is not to be displayed or searched, but by the first name and last name, which is specified in the customer table.

I have only found examples that relate to one table only. I have indeed found a way to get the presentation:

    array(  'db'        => 'rgadrid',
            'dt'        => 3,
            'formatter' =>  function( $d, $row ) {
                            $sql2   =   'SELECT     `ID`,
                                                    `rg_firma`,
                                                    `rg_titel`,
                                                    `rg_vname`,
                                                    `rg_nname`
                                        FROM        `sd_adre_rg`
                                        WHERE `ID` = '.$d.';';
                            if (!$result = $mysqli->query($sql2)) {}
                            $row2       =   $result->fetch_assoc();
                            if ($row2['rg_firma'] <> '')
                                {   $str2   =   $row2['rg_firma'];   }
                            else
                                {   if($row2['rg_titel'] <> '')
                                        {   $str2   =  $row2['rg_titel'].' '.$row2['rg_vname'].' '.$row2['rg_nname'];   }
                                    else
                                        {   $str2   =  $row2['rg_vname'].' '.$row2['rg_nname'];   }
                                }
                            return $str2;
                            }

    )

But the search and sorting does not work so, because these access to the source data.
Can you give me an approach, how do I change the search and sorting?

Hi,

I'm pretty new with jquery datatables, I have created 2 buttons, Edit and Delete for each row of my employee data table. Is it possible so that when i click on the edit/delete button it will grab that rows employee's ID and pass that information through an ajax call to one of my webmethods delete function to delete or edit an employee off the database?

My code:

`<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Employee.aspx.cs" Inherits="Login.Employee" %>

   <!DOCTYPE html>

   <html xmlns="http://www.w3.org/1999/xhtml">
   <head runat="server">
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
       <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" />
       <script type="text/javascript" src="//cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
       <script type="text/javascript">
           $(document).ready(function () {
               $.support.cors = true;
               $.ajax({
                   url: '<%=ResolveUrl("GetEmployee.aspx") %>',
                   type: 'POST',
                   contentType: 'application/json; charset=utf-8',
                   dataType: 'json',
                   success: function (data) {
                       $('#datatable').dataTable({
                           data: data,
                           columns: [
                               { 'data': 'Id' },
                               { 'data': 'image' },
                               { 'data': 'lastName' },
                               { 'data': 'firstName' },
                               { 'data': 'jobTitle' },
                               { 'data': 'StartDate',
                                 'render': function(jsonDate) {
                                       var date = new Date(parseInt(jsonDate.substr(6)));
                                       var month = date.getMonth() + 1;
                                       return date.getDate() + "/" + month + "/" + date.getFullYear();
                                  }
                               },
                               {
                                   'data': 'EndDate',
                                   'render': function (jsonDate) {
                                       var date = new Date(parseInt(jsonDate.substr(6)));
                                       var month = date.getMonth() + 1;
                                       return date.getDate() + "/" + month + "/" + date.getFullYear();
                                   }
                               },
                               {
                                   'data': null,
                                   'defaultContent': '<button id="editBtn" onclick="editClick()">Edit</button>'
                               },
                               {
                                   'data': null,
                                   'defaultContent': '<button id="deleteBtn" onclick="deleteClick()">Delete</button>'
                               }
                           ]
                       });
                   }
               });
           });

           function deleteClick() {
                 // code to call webmethod delete function to delete a record off the database and datatable. Webmethod takes in an Id
                    parameter.
           }
       </script>
       <title></title>
   </head>
   <body>
       <form id="form1" runat="server">
           <div style="border:1px solid black; padding:3px; width:1200px; margin:auto">
               <table id="datatable">
                   <thead>
                       <tr>
                           <th>ID</th>
                           <th>Picture</th>
                           <th>Last Name</th>
                           <th>First Name</th>
                           <th>Job Position</th>
                           <th>Start Date</th>
                           <th>End Date</th>
                           <th></th>
                           <th></th>
                       </tr>
                   </thead>
               </table>
           </div>
       <div>

       </div>


       </form>
   </body>
  </html>`

Hi,

Am new to .Net web application, datatables and editor. I went through the basic examples in the website. I am facing an issue. Hope someone can throw some light on this.

Please find below the code that i use and error message i get.

HTML:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="xxx.cs" Inherits="xxx" %>

<!DOCTYPE html>

<html>
<head runat="server">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- end required meta tags -->

<title>test</title>



<link href="../DataTables/Bootstrap-3.3.7/css/bootstrap.css" rel="stylesheet" type="text/css" /><!-- Do not edit -->
<link href="../DataTables/Bootstrap-3.3.7/css/bootstrap-theme.css" rel="stylesheet" type="text/css" /><!-- Define theme changes here. -->
<link href="../DataTables/DataTables-1.10.13/css/dataTables.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Buttons-1.2.4/css/buttons.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Select-1.2.0/css/select.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../DataTables/Editor-1.6.1/css/editor.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../Styles/test.css" rel="stylesheet" type="text/css" />



<script src="../DataTables/datatables.min.js" type="text/javascript"></script>
<script src="../Scripts/test.js" type="text/javascript"></script>
<!-- End JavaScript Includes -->

</head>
<body>

</body>

</html>

Javascript:

(function () {

var editor;


$(document).ready(function () {


    editor = new $.fn.dataTable.Editor({
        ajax: {
        url: "URL to DB service",
        contentType: "application/json; charset=utf-8",
        dataType: "json" },
        table: "#Grid-01",
        fields: [

        {
        "label": "col 1",
        "name": "col1"
    },
        {
            "label": "col 2",
            "name": "col2"
        },
        {
            "label": "col 3",
            "name": "col3"
        },
        {
            "label": "col 4",
            "name": "col4"
        },
        {
            "label": "col 5",
            "name": "col5"
        }

    ],
    formOptions: {
        inline: {
            onBlur: 'submit'             }
    }
});

var table = $('#Grid-01').DataTable({
    lengthChange: false,
    order: [],
    ajax: {
        url: "URL to DB service",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        type: "GET",
        dataSrc: "d"
    },
    columns: [

                    { "data": "col1" },
                    { "data": " col2" },
                    { "data": " col3" },
                    { "data": " col4" },
                    { "data": " col5" }
        ]
        });

// Display the buttons
new $.fn.dataTable.Buttons(table, [
        { extend: "create", editor: editor },
        { extend: "edit", editor: editor },
        { extend: "remove", editor: editor }
    ]);

//Add the buttons to the appropriate Bootstrap class
table.buttons().container()
        .appendTo($('.col-sm-6:eq(0)', table.table().container()));



$('#Grid-01').on('click', 'tbody td:not(:first-child)', function (e) {
    editor.inline(this);
});

});

} ());

Output of DB service:

{"d":"[{\"col1\":\"12345\",\"col2\":\"123\",\"col3\":\"123\",\"col4\":\"100\",\"col5\":\"test_1]"}

Error message :

Datables warning: table id = Grid-01 – Requested unknown parameter ‘col1’ for row 0, column 0.

Thanks!

Hello,

I just want to know to invoke on click functionality of datatables button to my bootstrap buttons , without initializing datatables buttons.?

on click of bootstrap button Export or print of Datatables should work.

I am defining like this
datatableID.buttons('.buttons-print').trigger();

But for this to work there should be datatables buttons initialised which i dont want.

Can anyone help my out regarding this. ?

Thanks

I have been following this:

https://editor.datatables.net/manual/php/mjoin

And my join is working correctly:

->join(
                Mjoin::inst( 'data_sources' )//table to link to
                ->link('widgets.id','data_source_widget.widget_id' ) //left table id, name in link table
                ->link('data_sources.id','data_source_widget.data_source_id' ) //right table id, name in link table

                ->order('data_sources.description asc')// order of joined data - optional
                ->fields(
                    Field::inst( 'id' ) //first field read from joined table
                    ->options( 'data_sources', 'id', 'description' )
                        ->validator( 'Validate::notEmpty' ),
                    Field::inst( 'description' ) //second field read from joined table
                )
            )

I have a widgets table and a data_sources table which are linked by a data_source_widget table.

I am working on the Widgets editor page. I have the an array of data_sourecs being displayed in my Datatable.

Now I want the Editor to display a select which lists the description field from the data_sources table and allows the user to be able to select multiple data sources.

I guess I need to add something like this (this is for a simple select I am doing, using a foreign key):

Field::inst("widgets.widget_type_id") //foreign key in this table
                ->options('widget_types','id','description') //linked table, key (id) , value (text to display)
                ->validator( 'Validate::dbValues' ),
                //this is needed to display it joined table.field_name
                Field::inst('widget_types.description')->validator('Validate::unique'),

Is there an example of this anywhere?

Mick

i'm using buttons extension to export to excel (excelHtml5), and I want to know if its posible to show an alert (or something like this) after the excel file was created.

Thanks in advance.

I noticed that the first letter of strings I provide to DataTables are turned to upper case. As I'm new to DataTables I don't know how to influence this behavior (I would prefer it not to manipulate the data).

Thanks for any pointers!

Example link.
The CR and LF seem not working in textarea (i.e. not converted to <br> tag). I would appreciate any ideas. Thank you in advance.