Are you the publisher? Claim or contact us about this channel


Embed this content in your HTML

Search

Report adult content:

click to rate:

Account: (login)

More Channels


Showcase


Channel Catalog


Channel Description:

Recent Discussions — DataTables forums

older | 1 | .... | 2253 | 2254 | (Page 2255) | 2256 | 2257 | .... | 2326 | newer

    0 0
  • 11/16/18--00:49: Datatable cache problem
  • i am facing one issue with jquery datatable
    that is ,

    i am displaying the data which is submitted by one form,
    form is in popup
    when i submitting pop is getting close
    so immediately that data is not getting displayed in data table.
    i am using LIST to get data from database
    and iterating list to display in datatable.

    can any one help me to sort out this problem.

    Thanks in advance.


    0 0

    I am trying to reload the table but I can't seem to find the way to call the reload function.
    In the .done function of the 'revoke' event is where I'm trying to call it $(document).on("click", '.revoke', function (event).
    Here is how I'm calling it but fails: $('#example').data.reload(); or table.reload(); or table.ajax.reload();
    Any ideas?

    <script>
        $(document).ready(function () {
           var thedata = GetPermissions();
    
            var table = $('#example').DataTable({
                data: jQuery.parseJSON(thedata),
                columns: [
                    { data: 'Professional' },
                    { data: 'Patient' },
                    {
                        data: "View",
                        render: function (data, type, row) {
                            if (data === true) {
                                return '<input type="checkbox" checked disabled>';
                            }
                            return '<input type="checkbox" disabled>';
                        }
                    },
                    {
                        data: "Edit",
                        render: function (data, type, row) {
                            if (data === true) {
                                return '<input type="checkbox" checked disabled>';
                            }
                            return '<input type="checkbox" disabled>';
                        }
                    },
                    {
                        data: "Insert",
                        render: function (data, type, row) {
                            if (data === true) {
                                return '<input type="checkbox" checked disabled>';
                            }
                            return '<input type="checkbox" disabled>';
                        }
                    },
                    {
                        data: "Delete",
                        render: function (data, type, row) {
                            if (data === true) {
                                return '<input type="checkbox" checked disabled>';
                            }
                            return '<input type="checkbox" disabled>';
                        }
                    },
                    {
                        data: "Revoke",
                        render: function (data, type, row) {                     
                                return '<input type="button" class="btn btn-danger btn-xs revoke" data-pro="' + row.ProfessionalID + '" data-pat="' + row.PatientID + '" name="revoke" value="Revoke">';
                         }
                    }
                ]
            });
    
            $(document).on("click", '.revoke', function (event) {
                var sf = $.ServicesFramework(<%=ModuleId %>);
                    var serviceUrl = sf.getServiceRoot('omnibody');
                    var revoke = { 'ProfessionalID': $(this).data('pro'), 'PatientID': $(this).data('pat') };
    
                    $.ajax({
                        type: "POST",
                        cache: false,
                        url: serviceUrl + "/ModuleTask/RevokeAccessRights",
                        beforeSend: sf.setModuleHeaders,
                        contentType: "application/json; charset=utf-8",
                        data: JSON.stringify(revoke)
                    }).done(function (result) {
    //PROBLEM IS HERE
                        // $('#example').data.reload();
                        table.reload();
                    }).fail(function (xhr, result, status) {
                        alert('GetPermissions ' + xhr.statusText + ' ' + xhr.responseText + ' ' + xhr.status);
                    });
                });
        });
        
        function GetPermissions() {
            var sf = $.ServicesFramework(<%=ModuleId %>);
            var serviceUrl = sf.getServiceRoot('omnibody');
            var jdata;
            $.ajax({
                type: "GET",
                cache: false,
                async: false,
                url: serviceUrl + "/ModuleTask/GetAccessRightsPivoted",
                beforeSend: sf.setModuleHeaders,
                contentType: "application/json; charset=utf-8"
            }).done(function (result) {
                jdata = result;
                return jdata;
            }).fail(function (xhr, result, status) {
                alert('GetPermissions ' + xhr.statusText + ' ' + xhr.responseText + ' ' + xhr.status);
            });
            return jdata;
        }
    </script>
    

    0 0

    It works fine on live.datatables but it does not workout in the development environment (too many fields are used), though i used numeral.js script
    reference:

    here is my code:

           "footerCallback": function ( row, data, start, end, display ) {
                var api = this.api();
     
                // Remove the formatting to get integer data for summation
                var intVal = function ( i ) {
                    return typeof i === 'string' ?
                        i.replace(/[\MB,KB,GB,TB,]/g, '')*1 :
                        typeof i === 'number' ?
                        numeral(i).value() : i;
                };
     
                // Total over all pages
                total = api
                    .column( 3 )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
     
                // Total over this page
                pageTotal = api
                    .column( 3, { page: 'current'} )
                    .data()
                    .reduce( function (a, b) {
                        return intVal(a) + intVal(b);
                    }, 0 );
     
                total = numeral(total).format('0.0a');
                pageTotal = numeral(pageTotal).format('0.0a');
              $( api.column( 3 ).footer() ).html(
                 '--'+pageTotal +' ( --'+ total +' total)'
                );
            }
    

    Please let me know where did i go wrong?

    Thanks
    Koka


    0 0

    If a field has an error, and the user changes that field to fix the error, then the errormessage is still shown. This is fixable for example with a dependency on each field, which does an editor.field(xxx).error(''). It's a lot of extra code if you have to define this for each field. Is there an easier way to do this? If not, then maybe an option for this can be addad in a future version?


    0 0

    Hi -
    I am trying to get the examples running for a Firebird database. I have managed to get it to connect to the database, I edited the staff.php file to include fields relevant to my situaiton, but it just throws an sql exception complaining reporting..

    ** "error code = -206 Column unknown id At line 1, column 1.."**

    I cant see a reference to a field called "id" in staff.php or my html markup that calls the php file. Quite honestly, I find the whole system of related PhP files objects very confusing. Although the "manual" mentions that there is an Editor->where function but only a snippet of code that shows how to use it (still not sure where to call or configure this method.)

    This is my version of the "staff.php" file

    <?php
    
    /*
     * Example PHP implementation used for the index.html example
     */
    
    // DataTables PHP library
    include( "../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, 'INVOICE' )
        ->fields(
            Field::inst( 'TRANSID' )
                ->validator( Validate::notEmpty( ValidateOptions::inst()
                    ->message( 'TRANSID REQUIRED' ) 
                ) ),
            Field::inst( 'CUSTNAME' )
                ->validator( Validate::notEmpty( ValidateOptions::inst()
                    ->message( 'A  name is required' )  
                ) ),
    
            Field::inst( 'TRANSDATE' )
                ->validator( Validate::dateFormat( 'Y-m-d' ) )
                ->getFormatter( Format::dateSqlToFormat( 'Y-m-d' ) )
                ->setFormatter( Format::dateFormatToSql('Y-m-d' ) )
        )
        ->process( $_POST )
        ->json();
    

    I have edited the calling html file with the same fields defined for the datatabe object.

    Any hints or idea as to why the "id" field error is being thrown would be much appreciated.
    Thanks
    Dave.


    0 0

    With JavaScript I would like to retrieve the data from a column where the data of another column meets a specified criteria. In the example below I am trying to retrieve the data of column A where column B us 'True'. Now I am still retrieving all the data of column A, like the search on column B is not being applied. Your help is much appreciated.

    http://live.datatables.net/welavira/1/edit


    0 0

    Hello,

    I have an editor that's displayed on the page using the onPageDisplay function. Some of the fields are select2 objects using ajax as data source.
    When the form is shown, I see 2 initialValue requests for each of the select2 fields ("http://localhost:53686/Registraties/getOptions/TYB?initialValue=true&value=%22%22"). Is this to be expected?
    (Sorry, but I can't make this accessible online to debug...)

    The form is shown as follows:

            editor
                .buttons({
                    label: "Save",
                    fn: function () { this.submit(); }
                })
                .create(1, true, {
                    focus: null
                });
    
    

    Example of a select2-field definition:

                    {
                        "label": "type behandeling",
                        "name": "TYB",
                        "type": "select2",
                        "opts": {
                            placeholder: '...',
                            ajax: {
                                dataType: "json",
                                url: '/Registraties/getOptions/TYB',
                                data: function (params) {
                                    return {
                                        productid: ProductID
                                    };
                                },
                                processResults: function (data) {
                                    return {
                                        results: data
                                    };
                                },
                            }
                        }
    
                    }
    

    0 0

    When placing a select dropdown in a cell for inline editing the row height changes when the user activates the cell for editing.
    This issue can be seen in the standard example at

    https://editor.datatables.net/examples/inline-editing/join.html

    when selecting the last column (location) the row height changes slightly -
    With the bootstrap theme this issue becomes much more pronounced

    Is there a way to change the padding of the cell to 0px when the select is opened and set it back to the original value once the selects is closed ?


    0 0

    Hi all,

    I'm going through the Editor examples and trying to figure out how the "one-to-many join" works. I have removed the options "permission[].id" in the server script and replaced them with options in the JavaScript. So my Server script and my AJAX Load look like this:

    Server script:

    $(document).ready(function () {
        $(document).ready(function () {
            editor = new $.fn.dataTable.Editor({
                ajax: "/api/users",
                table: "#example",
                fields: [{
                        label: "First name:",
                        name: "users.first_name"
                    },
                    {
                        label: "Last name:",
                        name: "users.last_name"
                    },
                    {
                        label: "Site:",
                        name: "users.site",
                        type: "select"
                    },
                    {
                        label: "Permissions:",
                        name: "?",
                        type: "checkbox",
    
                        options: [{
                                name: "Mainframe",
                                id: 7
                            },
                            {
                                name: "Laptop",
                                id: 8
                            }
                        ],
                        optionsPair: {
                            label: 'name',
                            value: 'id'
                        }
    
                    }
                ]
            });
    
            table = $("#example").DataTable({
                dom: "Bfrtip",
                ajax: {
                    url: "/api/users",
                    type: "POST"
                },
                columns: [{
                        data: "users.first_name"
                    },
                    {
                        data: "users.last_name"
                    },
                    {
                        data: "users.city"
                    },
                    {
                        data: "sites.name"
                    },
                    {
                        data: "permissions",
                        render: "[, ].name"
                    }
                ],
                select: true,
                buttons: [{
                        extend: "create",
                        editor: editor
                    },
                    {
                        extend: "edit",
                        editor: editor
                    },
                    {
                        extend: "remove",
                        editor: editor
                    }
                ]
            });
        });
    });
    

    AJAX Load (excerpt):

            {
                "DT_RowId": "row_27",
                "users": {
                    "first_name": "Ifeoma",
                    "last_name": "Mays",
                    "city": "Parkersburg",
                    "site": 3
                },
                "sites": {
                    "name": "Paris"
                },
                "permissions": []
            },
            {
                "DT_RowId": "row_28",
                "users": {
                    "first_name": "Basia",
                    "last_name": "Harrell",
                    "city": "Cody",
                    "site": 4
                },
                "sites": {
                    "name": "New York"
                },
                "permissions": [
                    {
                        "id": 6,
                        "name": "Accounts"
                    },
                    {
                        "id": 3,
                        "name": "Desktop"
                    },
                    {
                        "id": 1,
                        "name": "Printer"
                    },
                    {
                        "id": 2,
                        "name": "Servers"
                    },
                    {
                        "id": 4,
                        "name": "VMs"
                    },
                    {
                        "id": 5,
                        "name": "Web-site"
                    }
                ]
            },
    
    1. If I put name: "permissions[].id" like in the example there is no error but nothing happens. Why it doesn't work in my case?
    2. The fields in the server script and the option name in the JavaScript name: "users.first_name", name: "users.last_name" and name: "users.site" are the same. But looking at the server script where does name: "permissions[].id" come from?
    3. If I want to get the options from a AJAX call, then I suppose I should use this:

      editor.on( 'initEdit', function ( e, node, data, items, type ) {
        $.getJSON( '/myURL', data, function ( json ) {
          editor.field('myField').update( json );
        } );
      } );
      

    In this case the AJAX load should be just an array of objects, the option options should be removed and the option optionsPair should be left like it is now?


    0 0
  • 11/15/18--06:37: Scroller with responsive
  • Hi
    what about scroller extensions togheter with responsive. The scroller seems not to adjust its measure on responsive dsplay when the scrollCollapse option is set to true.
    Is it the standard behavior? Or should the scroller change on responsive opening and closing?

    Thanks
    Monica


    0 0

    Hi,

    I am facing issues of page Length is server side data table. it returns 36 recordsTotal and makes pagination page numbers perfect but it displays all records of 36 on the first page of pagination.

    I have two pages having data tables, one is working fine and other is having this issue of pagelength but code is same for both.

    i have tried to fix it but could not solve it.

    ,paging: true
    ,pageLength : 10

    Thanks in advance if you could help me.


    0 0

    I tried to use the DataTables-Editor-Server DLL that came from the generator which gives me the missing method exception. I also made a new project and tried the DLL from nuget but it has the same result. I am using framework 4.6 and tried it with 4.5 as well.


    0 0

    I'm using datatables on a node.js application. (https://editor.datatables.net/manual/nodejs/). All works fine.

    Now I want to test the editor api with postman. Here I don't get back a response back. What am I missing?

    If I send a POST to a route http://127.0.0.1:2001/v1/abc which normally runs the script ... and in 'Body' 'raw' & 'JSON(application/json)' of postman I'm sending this JSON ..

        {
            "draw": "1",
            "columns": [{
                "data": "name",
                "name": "",
                "searchable": "true",
                "orderable": "true",
                "search": {
                    "value": "",
                    "regex": "false"
                }
            }{
                "data": "country",
                "name": "",
                "searchable": "true",
                "orderable": "true",
                "search": {
                    "value": "",
                    "regex": "false"
                }
            }, {
                "data": "",
                "name": "",
                "searchable": "false",
                "orderable": "false",
                "search": {
                    "value": "",
                    "regex": "false"
                }
            }],
            "order": [{
                "column": "1",
                "dir": "desc"
            }],
            "start": "0",
            "length": "25",
            "search": {
                "value": "",
                "regex": "false"
            }
        }
    

    I would expect getting a response ... but getting a infinite ...loading ..


    0 0

    I have a datatable i loaded with records, i want to be able to click on a row button, the row button to display a modal dialog, populate the modal fields with corresponding row values using Ajax object.


    0 0

    Hi there,
    Has one of you already experience with the following situation?

    I would like to save a value with a checkbox in two different DB tables, e.g.
    1. DB table bookings -> value status = "new" or "canceled"
    2. DB table rooms -> value storno = 0 or 1

    I can save in table rooms the value storno = 0 or 1 with the following code but
    how can I additionally store the value status = "new" or "canceled" in the bookings table?

    JS

    var editor; // use a global for the submit and return data rendering in the examples
    (function($) {
        $(document).ready(function() {
            editor = new $.fn.dataTable.Editor({
                ajax: '/php/table.bookings_test.php',
                table: '#bookings_test',
                fields: [
                {
                    label:     "Storno:",
                    name:      "rooms.ca_storno",
                    type:      "checkbox",
                    separator: "|",
                    options:   [
                        { label: '', value: 1 }
                    ]
                }]
            });
            
            var table = $('#bookings_test').DataTable({
                ajax: '/php/table.bookings_test.php',
                Processing: true,
                ServerSide: true,
                "lengthMenu": [[10, 20, 50, -1], [10, 20, 50, "alle"]],
                "pageLength": 20,
                columns: [
                    {
                        data:   "rooms.ca_storno",
                        render: function ( data, type, row ) {
                            if ( type === 'display' ) {
                                return '<input type="checkbox" class="storno">';
                            }
                            return data;
                        },
                        className: "dt-body-center"
                    }
                ],
                rowCallback: function ( row, data ) {
                    // Set the checked state of the checkbox in the table
                    $('input.storno', row).prop( 'checked', data.rooms.ca_storno == 1 );
                },
                responsive: true,
                columnDefs: [
                    { type: 'date-eu', targets: 0 },
                    { type: 'date-eu', targets: 10 }
                ]
            });
            $('#bookings_test').on( 'change', 'input.storno', function () {
                editor
                    .edit( $(this).closest('tr'), false )
                    .set( 'rooms.ca_storno', $(this).prop( 'checked' ) ? 1 : 0 )
                    .submit();
            } );
        });
    }(jQuery));
    

    PHP

    // DataTables PHP library and database connection
    include( "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;
    
    Editor::inst( $db, 'rooms', 'uid' )
        ->field( 
            Field::inst( 'rooms.ca_storno' )
                ->setFormatter( function ( $val, $data, $opts ) {
                    return ! $val ? 0 : 1;
                } )
        )
        ->process($_POST)
        ->json();
    

    BR


    0 0

    Column sorting isn't working past column 2, I even tried deleting the column just in case the % sign was throwing it off.

    https://codpool.com

            <table id="sortthisbitch" width="100%">
            <thead>
            <tr>
                <th class="all"><strong> Pool</strong></th>
                <th class="all"><strong> Algo</strong></th>
                <th class="desktop"><strong> Pool Fee</strong></th>
                <th class="all"><strong> Active Miners</strong></th>
                <!--<th><strong> Symbol</strong></th>-->
                <th class="all"><strong> Workers</strong></th>
                <th class="all"><strong> Pool Hashrate</strong></th>
                <th class="desktop"><strong> Network Hashrate</strong></th>
                <th class="desktop"><strong> % of Network Hash</strong></th>
                <th class="desktop"><strong> Total Blocks Found</strong></th>
                <th class="desktop"><strong> Difficulty</strong></th>
                <th class="all"><strong> Block Height</strong></th>
                <th class="all"><strong> Effort</strong></th>
                <!--<th><strong> Price (USD)</strong></th>-->
                <th class="all"><strong> </strong></th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td width="100px"><img src="/images/smallcoin/arms.png" width="20px" height="20px"> 2ACoin</td>
                <td><strong>Aeon v7</strong></td>
                <td><strong><span id="arms_configcnFee">...</span></strong></td>
                <td><strong><span id="arms_poolMiners">...</span></strong></td>
                <!--<td><strong>IRD</strong></td>-->
                <td><strong><span id="arms_poolWorkers">...</span></strong></td>
                <td><strong><span id="arms_poolHashrate">...</span></strong></td>
                <td><strong><span id="arms_networkHashrate">...</span></strong></td>
                <td><strong><span id="arms_hashPower">...</span></strong></td>
                <td><strong><span id="arms_poolBlocks">...</span></strong></td>
                <td><strong><span id="arms_poolDifficulty">...</span></strong></td>
                <td><strong><span id="arms_poolBlockheight">...</span></strong></td>
                <td><strong><span id="arms_hasheffort">...</span></strong></td>
                <!--<td><strong><span id="iridiumPriceUSD">...</span></strong></td>-->
                <td><a href="https://arms.codpool.com"><div class="btn btn-success">Start Mining</div></a></td>
            </tr>
    </tbody>
    </table>
    


    $(document).ready(function() { $('#sortthisbitch').DataTable( { responsive: { breakpoints: [ {name: 'bigdesktop', width: Infinity}, {name: 'meddesktop', width: 1480}, {name: 'smalldesktop', width: 1280}, {name: 'medium', width: 1188}, {name: 'tabletl', width: 1024}, {name: 'btwtabllandp', width: 848}, {name: 'tabletp', width: 768}, {name: 'mobilel', width: 480}, {name: 'mobilep', width: 320} ], columnDefs: [ { responsivePriority: 1, targets: 0 }, { responsivePriority: 2, targets: -1 } ] }, //"responsive": false, "paging": false, "aoColumnDefs": [{'bSortable': false, 'aTargets': [ -1 ]}], "orderCellsTop": true } ); } );

    0 0

    I want to regex validate some input fields with editor node.js. Is this possible? For instance is this example working?

    new Field("name")
        .validator((val, data, host) => {
            if(val === null){
                return true;
            } else {
                return val.match("/^[a-zA-Z ]+$/") 
                    ? 'Not valid!' 
                    : true;
            }
        })
    

    0 0

    Enclosing certain statements that load or initialize the DataTable. I have for example a setTimeOut that refreshes it every 30 seconds with ajax.reload.

    But it is a component that has to launch this error and it would be good to publish how to avoid these errors and get the best performance. Because it uses many resources to achieve desired functionalities


    0 0

    Hi,

    I see lots of good examples on customizing excel export, such as here.

    But none of them seem to tell me the syntax if I want to change the cell color (using the built-in styles), for a specific cell - e.g. A4, M5, N10, etc.

    Is there a way to do this?


    0 0

    I usually use editor.dependent() to get a value from a list box:

    // JS file
    ...
    {
        label: "Provincia",
        name: "contatti.cont_prov",
        type: "select"
    },          
    {
        label: "Località",
        name: "contatti.cont_loc",
        type: "select"
    },
    {
        label: "CAP",
        name: "contatti.cont_cap",
        type: "select"
    
    },
    ...
    clientiEditor.dependent( 'contatti.cont_prov', 'php/filtro_localita.php' ); 
    clientiEditor.dependent( 'contatti.cont_loc', 'php/filtro_cap.php' );
    ...
    
    // PHP file: filtro_localita.php
    <?php
    include( "DataTables.php" );
    
    $comuni = $db
        ->select( 'comuni', ['com_nome as value','com_nome as label']
            ,['com_prov' => $_REQUEST['values']['contatti.cont_prov']] )
        ->fetchAll();
    
    echo json_encode( [
        'options' => [
            'contatti.cont_loc' => $comuni
        ]
    ] );
    
    // PHP file: filtro_cap.php
    <?php
    include( "DataTables.php" );
    
    $cap = $db
        ->select( 'comuni', ['com_cap as value','com_cap as label']
            ,['com_nome' => $_REQUEST['values']['contatti.cont_loc']] )
        ->fetchAll();
    
    echo json_encode( [
        'options' => [
            'contatti.cont_cap' => $cap
        ]
    ] );
    ?>
    

    But how can I get a single value for the contatti.cont_cap field instead of a list box?
    I tried to write:

    // JS file
    ...
    {
        label: "Provincia",
        name: "contatti.cont_prov",
        type: "select"
    },          
    {
        label: "Località",
        name: "contatti.cont_loc",
        type: "select"
    },
    {
        label: "CAP",
        name: "contatti.cont_cap"
    
    },
    

    and I modified the file filtro_cap.php in this way:

    <?php
    include( "DataTables.php" );
    
    $cap = $db
        ->select( 'comuni', ['com_cap']
            ,['com_nome' => $_REQUEST['values']['contatti.cont_loc']] )
        ->fetchAll();
    
    echo json_encode( $cap );
    ?>
    

    the php file returns (for example):

    [{"com_cap":"92100"}]
    

    but my field is: contatti.cont_cap...
    how should i do?

    Thanks for your help,
    Giuseppe


older | 1 | .... | 2253 | 2254 | (Page 2255) | 2256 | 2257 | .... | 2326 | newer