How can I select all records in the select field? What should I write in php?

How would I insert PHP session variables such as User ID when user enters and submits data in inline editor.

I hope everyone is safe & healthy at home.

I am very new to the world of C#, ASP.net Core/Entity Framework/ORMs and APIs.

I would very much like to provide an example to my boss, to prove that a Web API with .NET Core is a viable solution. I wish to understand it fully.

I have a mountain to climb.

Are you aware of any tutorials that explain -- in detail -- how to nail up an example ASP.net Core Web API in conjunction with the DataTables Editor ASP.net Libraries? Perhaps just a simple "read only" example.

I need to know how to get Core installed on IIS. Then, I need to figure out how to get it connected to the DB. Also, I need to know how to get DT and DTE to work with all of that.

(I've been using "manual" JavaScript applications send/receive data from our SQL box. it's VERY manual, and there's a lot of parsing data structures.)

How do I inject this knowledge into my brain? Where do I start? I want to know how to do this.

Hello,

I'm using the datatable here, http://dnses.net/project88751/test.php?c=1
JS File : http://dnses.net/project88751/js/customer_appointment.js
Datatable Code Start From Line 223 in JS file

1. I want to, when page load, Scrolled to bottom of page, and when edit the record, then after reload of page, scroll to that position it was before.
   For this I'm using Global ScrollPosition = 0, (Line No 26) so when page load, if its zero, then use this to scroll down to bottom of page,

From Line 259
if(ScrollPosition == 0)
{
ScrollPosition = $('.dataTables_scrollBody').get(0).scrollHeight;
}
$('.dataTables_scrollBody').scrollTop(ScrollPosition);

And when I edit the row, I save the scroller position to ScrollPosition variable (Line No 451) , and then scroll the page to that position after reload,
So my question is that this kind of approach is good or anything else can be done which is good in speed and performance.

1. What if I'm only able to replaced only a row that I updated without refreshing whole table. So what the way to access and replaced only that row data.
2. Also when the page load, and in datatable showing processing data, a zero showing. with element class dts_label why it s appearing, let me know how to avoid this to show. For workaround, in other pages I used css to hide this label.

Thanks in advance.

Arjun,

Hi I am having issues with view the save images.

I have table Doctor_Configs that has 4 images fileds (logo1, logo2, logo3, logo4) related to image table, I can save images with the editor, but when I try to get info I get this error: "Uncaught Unknown file id 18 in table image", id 18 exists I can see it on db.

On table Doctor_Configs in field logo1 I have saved 17, on table user_config in field logo2 I have saved 18, I only have error on id 18 but both exists. id 17 is returned well.

I'm using c#, this my code:

DtResponse response = new Editor(db, "Doctor_Configs", "id")
                    .Model<DoctorConfigModel>("Doctor_Configs")
                    .Model<UserModel>("Users")
                    .Field(new Field("Doctor_Configs.logo1")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(
                           new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                                .Db("image", "id", new Dictionary<string, object>
                                {
                                    {"fileName", Upload.DbType.FileName},
                                    {"webPath", Upload.DbType.WebPath},
                                    {"systemPath", Upload.DbType.SystemPath},
                                })
                                .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                                .Validator(Validation.FileExtensions(new[] { "jpg", "png", "gif" }, "Please upload an image."))
                                )
                    )
                    .Field(new Field("Doctor_Configs.logo2")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(
                           new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                                .Db("image", "id", new Dictionary<string, object>
                                {
                                    {"fileName", Upload.DbType.FileName},
                                    {"webPath", Upload.DbType.WebPath},
                                    {"systemPath", Upload.DbType.SystemPath},
                                })
                                .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                                .Validator(Validation.FileExtensions(new[] { "jpg", "png", "gif" }, "Please upload an image."))
                                )
                    )
                    .Field(new Field("Doctor_Configs.logo3")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(
                           new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                                .Db("image", "id", new Dictionary<string, object>
                                {
                                    {"fileName", Upload.DbType.FileName},
                                    {"webPath", Upload.DbType.WebPath},
                                    {"systemPath", Upload.DbType.SystemPath},
                                })
                                .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                                .Validator(Validation.FileExtensions(new[] { "jpg", "png", "gif" }, "Please upload an image."))
                                )
                    )
                    .Field(new Field("Doctor_Configs.logo4")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(
                           new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                                .Db("image", "id", new Dictionary<string, object>
                                {
                                    {"fileName", Upload.DbType.FileName},
                                    {"webPath", Upload.DbType.WebPath},
                                    {"systemPath", Upload.DbType.SystemPath},
                                })
                                .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                                .Validator(Validation.FileExtensions(new[] { "jpg", "png", "gif" }, "Please upload an image."))
                                )
                    )
                    .LeftJoin("Users", "Users.doctor_id", "=", "Doctor_Configs.id")
                    .Where("Users.uId", user.uId, "=")
                    .Debug(true)
                    .Process(request)
                    .Data();

Hi, i have a server side enabled datatable. I can search by other columns except one of the columns status_name

The implementation code is as follows.

// DB table to use | Use a subquery as table
        $subQuery = "select table1.id,.......
                    , ifnull(table2.id, 2) as processing_status
                    , ifnull(table2.description, 'Pending') as processing_status_name
                    from table1
                    left join table2 .................
                    ......................................
                    where ..... order by table1.created desc";
        $table = "($subQuery) AS table1";

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

        $columns = array(
            ..................................................................,
            array('db' => 'processing_status_name', 'dt' => 9),
            array('db' => 'processing_status', 'dt' => 10),
            array('db' => 'id', 'dt' => 11),
            array('db' => 'application_id', 'dt' => 12)
        );

        return SSP::complex($_GET, $this->em->getConnection(), $table, $primaryKey, $columns, null, null);

Here is the datatable initialization

<table id="records-datatable"
                           class="table cell-border hover stripe app-table app-table-clickable">
                        <thead>
                        <tr>
                            <th>Serial#</th>
                            <th>Number</th>
                            <th>Surname</th>
                            <th>Firstname</th>
                            <th>Mobile Number</th>
                            <th>Date of Birth</th>
                            <th>State</th>
                            <th>CNT</th>
                            <th>Expiry Date</th>
                            <th>Processing Status</th>
                            <th>Actions</th>
                        </tr>
                        </thead>
                        <tfoot>
                        <tr>
                            <th>Serial#</th>
                            <th>Number</th>
                            <th>Surname</th>
                            <th>Firstname</th>
                            <th>Mobile Number</th>
                            <th>Date of Birth</th>
                            <th>State</th>
                            <th>CNT</th>
                            <th>Expiry Date</th>
                            <th>Processing Status</th>
                            <th>Actions</th>
                        </tr>
                        </tfoot>
                    </table>

recordsDataTable = $('#records-datatable').DataTable({
                "processing": true,
                "serverSide": true,
                "ajax": ".....................",
                "deferRender": true,
                "order": [],
                "pageLength": 25,
                "language": {
                    "emptyTable": "No matching records found",
                    "processing": '<div class="spinner-border text-dark mt-2 mb-2" role="status">\n' +
                        '  <span class="sr-only">Loading...</span>\n' +
                        '</div>'
                },
                "columnDefs": [
                    {
                        "targets": -1,
                        "data": null,
                        "orderable": false,
                        "render": function (data, type, row, meta) {
                            return '<div class="dropdown app-dropdown-md dropright">\n' +
                                '  <button class="btn btn-primary app-btn-xs dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
                                '    Action' +
                                '  </button>' +
                                '  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">' +
                                '    <a class="dropdown-item app-fancybox-iframe" href="' + recordDetailUrl + '?q=' + data[12] + '">Record Details</a>' +
                                '  </div>' +
                                '</div>';
                        }
                    }
                    , {
                        "targets": -2,
                        "data": null,
                        "render": function (data, type, row, meta) {
                            let badgeType = (data[9] === "Pending") ? 'danger' : 'success';
                            return '<span class="badge badge-' + badgeType + ' tx-white">' + data[9] + '</span>';
                        }
                    }
                ]
            });

I cannot search by the processing status column. It returns 0 records when i do

Hi
I am trying to make jquery datatable responsive in angular 6
by using responsive:true in below configuration, but the table does not become responsive.

  this.dtOptions = {
            pagingType: 'full_numbers',
            pageLength: 2,
            serverSide: true,
            processing: true,
            
            ajax: (dataTablesParameters: any, callback) => {
              that.http
                .post<DataTablesResponse>(
                  'https://angular-datatables-demo-server.herokuapp.com/',
                  dataTablesParameters, {}
                ).subscribe(resp => {
                  that.persons = resp.data;
      
                  callback({
                    recordsTotal: resp.recordsTotal,
                    recordsFiltered: resp.recordsFiltered,
                    data: []
                  });
                });
            },
            responsive:true,
            columns: [{ data: 'id' }, { data: 'firstName' }, { data: 'lastName' }]
          };

Can anyone help

Hello,

I am using datatable editor. I get this error when I leave a column empty. There is no problem when I fill it.

An example column:

                      .Field(new Field("Price")
                      .Validator(Validation.Numeric())
                     .SetFormatter(Format.IfEmpty(null)))

Hi,

I love DataTables, but I am experiencing some difficulties setting up.

I am using a Jinja2 template to display some simple data on a page.

Here's the HTML code:

{% block content  -%}

<div class="table_container">
  <table id="serverside_table" class="display" cellspacing="0">
    <thead>
      <tr>
        <th>Id</th>
        <th>Sequential #</th>
        <th>Created On</th>
      </tr>
    </thead>
  </table>
</div>

<script>

$(document).ready(function() {
    var myTable = $('#serverside_table').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "/invoices/serverside_table",
        columns: [
            {data: "id"},
            {data: "sequential_number"},
            {data: "created_on"}
        ]
    } );

} );

</script>

{%- endblock %}

All works fine, as you can see here:

,but when I try to sort any of the columns, it doesn't work

Here's the data that's returned back to the browser from the backend:

{"recordsTotal": 12, "recordsFiltered": 12, "draw": 1, "data": [{"created_on": "2020-04-26 10:18:13+00:00", "id": 1, "sequential_number": 1234}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 2, "sequential_number": 1235}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 3, "sequential_number": 1236}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 4, "sequential_number": 1237}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 5, "sequential_number": 1238}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 6, "sequential_number": 1239}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 7, "sequential_number": 1240}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 8, "sequential_number": 1241}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 9, "sequential_number": 1242}, {"created_on": "2020-04-26 10:18:13+00:00", "id": 10, "sequential_number": 1243}]}

I noticed the following inside the axaj request, and these [object Object] values seem wrong:

I am using datatables v1.10.20:

If I switch "ajax": "/invoices/serverside_table", to "sAjaxSource ": "/invoices/serverside_table" (forced legacy mode), all works just fine.

Any ideas?

Thanks

Hello, I am having problem with join no id column,

Error
DataTables warning: table id=IM_ItemVendor - Requested unknown parameter 'IM_ItemVendor.VendorNo' for row 0, column 0.
Join to tables no ID column, same column name oh both tables

Editor::inst( $db, 'IM_ItemVendor', 'VendorNo' )
->fields(
Field::inst( 'VendorNo' ),
Field::inst( 'ItemCode' ),
Field::inst( 'LastReceiptDate' )
->validator( Validate::dateFormat( 'D, j M Y' ) )
->getFormatter( Format::dateSqlToFormat( 'D, j M Y' ) )
->setFormatter( Format::dateFormatToSql( 'D, j M Y' ) ),
Field::inst( 'LastLeadTime' ),
Field::inst( 'LastReceiptPurchaseOrderNo' )
)
leftJoin( 'AP_Vendor', 'AP_Vendor.VendorNo', '=', 'IM_ItemVendor.VendorNo' )

I'm struggling to understand how to pass a variable from PHP from the client to the server editor. The following works if I hard code the value in. I'd like to pass in the value of a variable (ie. $territory) instead of the 'L-140'.

Can some one show me how this is done?

My code:

var table = $('#names').DataTable( {
    dom: 'Bfrtip',
    ajax: {
            url: '../assets/dt/php/table.names.php',
            data:   { 'territory': 'L-140' }                      <<--- would like a variable in stead of 'L-140'
        },
    type:   'POST',

    columnDefs: [
        { targets: [0, 2, 4, 5, 6], visible: false }
    ],  
    columns: [
        { "data": "names.con_id" },
        { "data": "names.territory" },
        { "data": "contacts.category" },
        { "data": "contacts.status" },
        { "data": "names.postal" },
        { "data": "names.street" },
        { "data": "names.house" },
        { "data": "names.first_name", className: 'editable' },
        { "data": "names.last_name", className: 'editable' },
        { "data": "contacts.fullstreet" },
        { "data": "postals.city" },
        { "data": "names.phone", className: 'editable' },
        { "data": "names.mobile", className: 'editable' },
        { "data": "names.email", className: 'editable' }
    ],
    select: true,
    ordering: false,
    lengthChange: false,
    buttons: [
        { extend: 'create', editor: editor },
        { extend: 'edit',   editor: editor },
        { extend: 'remove', editor: editor }
    ]
} );

} );

[Server side]

Editor::inst( $db, 'names', 'id' )
->fields(
Field::inst( 'names.con_id' ),
Field::inst( 'names.territory' ),
Field::inst( 'contacts.category' ),
Field::inst( 'contacts.status' ),
Field::inst( 'names.postal' ),
Field::inst( 'names.street' ),
Field::inst( 'names.house' ),
Field::inst( 'names.first_name' ),
Field::inst( 'names.last_name' ),
Field::inst( 'contacts.fullstreet' ),
Field::inst( 'postals.city' ),
Field::inst( 'names.phone' ),
Field::inst( 'names.mobile' ),
Field::inst( 'names.email' )
)
->leftJoin('contacts','contacts.id','=','names.con_id')
->leftJoin('postals','postals.postal','=','names.postal')
->where( 'names.territory', $_GET['territory'])
->process( $_POST )
->json();

Hello Everyone, I am working on python and try to build a web app. I am confused to choose right framework between django and flask in terms of high traffic based website. I have checked on google the main difference according to build complex applications from this post. So Can anyone suggest me which one is better flask or django?

I have downloaded datatable 1.10.20 and used datatable.min.js with jquery 3.5.0 . but it is giving .dataTable() is not a function at jquery-3.5.0.js . I tried to make a testcase with http://live.datatables.net/puputule/3/edit but there it is giving no error but in my application it is showing above error in console and datatable is not loading.

Need to load page in last row(page).

Now, i see the vertical lines on body after loading. And, scroll to last page, stop in the middle.

Would like to load in last page, rather than scrolling.

Full demo with all my code

live.datatables.net/kamixivu/1

use:
boostrap
font awesome
datatables
scroller

Server-side processing without PHP

Hello,

I have tables like this :

Here is my js code :

/*
 * Editor client script for DB table user_site
 * Created by http://editor.datatables.net/generator
 */

(function($){

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
        ajax: 'user_site.php',
        table: '#user_site',
        fields: [
            {
                "label": "Nom :",
                "name": "users.first_name"
            },
            {
                "label": "Classe :",
                "name": "users.classe",
                "type": "select",
            },
            {
                "label": "Compte :",
                "name": "sites[].id",
                "type": "checkbox"
            }
        ],
        i18n: {
            create: {
                button: "Nouveau",
                title:  "Créer nouvelle entrée",
                submit: "Créer"
            },
            edit: {
                button: "Modifier",
                title:  "Modifier entrée",
                submit: "Actualiser"
            },
            remove: {
                button: "Supprimer",
                title:  "Supprimer",
                submit: "Supprimer",
                confirm: {
                    _: "Etes-vous sûr de vouloir supprimer %d lignes?",
                    1: "Etes-vous sûr de vouloir supprimer 1 ligne?"
                }
            },
            error: {
                system: "Une erreur s’est produite, contacter l’administrateur système"
            },
            datetime: {
                previous: 'Précédent',
                next:     'Premier',
                months:   [ 'Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre' ],
                weekdays: [ 'Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam' ]
            }
        }
    } );

    // Upload Editor - triggered from the import button. Used only for uploading a file to the browser
    var uploadEditor = new $.fn.dataTable.Editor( {
        fields: [ {
            label: 'CSV file:',
            name: 'csv',
            type: 'upload',
            ajax: function ( files ) {
                // Ajax override of the upload so we can handle the file locally. Here we use Papa
                // to parse the CSV.
                Papa.parse(files[0], {
                    header: true,
                    skipEmptyLines: true,
                    complete: function (results) {
                        if ( results.errors.length ) {
                            console.log( results );
                            uploadEditor.field('csv').error( 'CSV parsing error: '+ results.errors[0].message );
                        }
                        else {
                            uploadEditor.close();
                            selectColumns( editor, results.data, results.meta.fields );
                        }
                    }
                });
            }
        } ]
    } );

    var table = $('#user_site').DataTable( {
        dom: 'Bfrtip',
        ajax: 'user_site.php',
        columns: [
            {
                "data": "users.first_name"
            },
            {
                "data": "classe.name_classe"
            },
            {
                "data": "sites", render: "[, ].name"
            }
        ],
        select: true,
        lengthChange: false,
        buttons: [
            { extend: 'create', editor: editor },
            { extend: 'edit' ,  editor: editor},
            { extend: 'remove', editor: editor },
            {
                extend: 'csv',
                text: 'Export CSV',
                className: 'btn-space',
                exportOptions: {
                    orthogonal: null
                }
            },
            {
                text: 'Import CSV',
                action: function () {
                    uploadEditor.create( {
                        title: 'CSV file import'
                    } );
                }
            },
            {
                extend: 'selectAll',
                className: 'btn-space'
            },
            'selectNone',
        ],
        language: {
            processing:     "Traitement en cours...",
            search:         "Rechercher :",
            lengthMenu:     "Afficher _MENU_ éléments",
            info:           "Affichage de l'élement _START_ à _END_ sur _TOTAL_ éléments",
            infoEmpty:      "Affichage de l'élement 0 à 0 sur 0 éléments",
            infoFiltered:   "(filtré de _MAX_ éléments au total)",
            infoPostFix:    "",
            loadingRecords: "Chargement en cours...",
            zeroRecords:    "Aucun élément à afficher",
            emptyTable:     "Aucune donnée disponible dans le tableau",
            paginate: {
                first:      "Premier",
                previous:   "Précédent",
                next:       "Suivant",
                last:       "Dernier"
            },
            aria: {
                sortAscending:  ": activer pour trier la colonne par ordre croissant",
                sortDescending: ": activer pour trier la colonne par ordre décroissant"
            }
        }
    } );
} );

}(jQuery));

Here is my php code :

<?php

// DataTables PHP library
include( "php/lib/DataTables.php" );

// Alias Editor classes so they are easy to use
use
    DataTables\Editor,
    DataTables\Editor\Field,
    DataTables\Editor\Format,
    DataTables\Editor\Mjoin,
    DataTables\Editor\Options,
    DataTables\Editor\Upload,
    DataTables\Editor\Validate,
    DataTables\Editor\ValidateOptions;

// Build our Editor instance and process the data coming from _POST

Editor::inst( $db, 'users', 'id' )
    ->fields(
        Field::inst( 'users.first_name' ),
        Field::inst( 'users.classe' )
            ->options( Options::inst()
                ->table( 'classe' )
                ->value( 'id' )
                ->label( 'name_classe')
            ),

        Field::inst( 'classe.name_classe' ),

    )
    ->leftJoin( 'classe', 'classe.id', '=', 'users.classe' )
    ->join(
        Mjoin::inst( 'sites' )
            ->link( 'users.id', 'user_site.user_id' )
            ->link( 'sites.id', 'user_site.site_id' )
            ->order( 'name asc' )
            ->fields(
                Field::inst( 'id' )
                    ->options( Options::inst()
                        ->table( 'sites' )
                        ->value( 'id' )
                        ->label( 'name')
                    ),
                Field::inst( 'name' ),

            )
    )
    ->process( $_POST )
    ->json();

I would like to have only checkboxes where sites.classe <= users.classe

Where have I to put my condition "where" ?

Thank you for your response !!

Dear Datables community,

I need help. I cannot find a solution to my problem after having read the documentation several times. I have a dynamic array manipulated by a field. An Ajax request is used to retrieve a json.

You will find below the shape of the object:

data = [{"name1":"ref2","name2":"55xXXXX","dates":{"date1":"2019/11/19 00:00:00"}},{"name1":"ref2","name2":"XXXX555","dates":{"date1":"2020/03/20 00:00:00"}}]

My table is already declared in my html. With my js file I would like to add or delete lines.

I always get the same error. I tried via initialize function of datatables and also via rows.add.

$("#table1").DataTable({data: data,colums: [{data: 'name1'},{data: 'name2'},{data: 'dates.date1'}]})

table.rows.add(data).draw()

Thanks, have a great day

I have created a dashboard page within that, there are 5 various tabs within them I am trying to use data table within all tabs with same class and id. I initiated the table using class, as of now the data table height is working for table within the first tab, when I switched from first tab to the next tab, there is a change in height of the table it is shrinking it's height with that the pagination and show entries are overlapping with the table i.e., they are displaying after the filter and search options, but after a click on the thead because of sorting table working fine. I even tried with changing the id's also but I'm receiving an alert stating that data table can't be initialised multiple times. Kindly please suggest how to resolve this.

Hi,
The column search in the datatable does not seem to work if i add scrollY. Is there any way to add both the search columns and the scroll?
Thanks.

This question is just to highlight Question https://datatables.net/forums/discussion/comment/166954.

There is a solution provided by @allan

var allowBackgroundClick = false;
$(document).on('mousedown', 'div.modal', function (e) {
    allowBackgroundClick = $(e.target).hasClass('modal') && conf.shown
        ? true
        : false;
} );

$(document).on('click', 'div.modal', function (e) {
    if ( $(e.target).hasClass('modal') && allowBackgroundClick ) {
        dte.background();
    }
} );

It works, but this not part of Editor 1.9.2 release, any plans on including this as a patch release?

Thanks,
K