Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all 81389 articles
Browse latest View live
↧

Processing - Showing loading gif instead of Text

January 1, 2017, 11:32 pm
$
0
0

I want to display a loading gif instead of the default text "Processing" for processing.

This is what I did to achieve the same :

 "language": {

            "processing": "<img src='~/Content/images/loadingNew.gif' />"
        },

But it didn't work. is it because of the way I'm referring to the image source?

Here's my JS for Datatable :

$(document).ready(function () {

    $('#searchResult').DataTable(
    {
        "dom": '<"top"lB>rt<"bottom"ip>',   // DataTable element position

        "buttons": [
        {
            text: '<span class="glyphicon glyphicon-refresh" data-toggle="tooltip" title="Refresh Search Table"/>',
            action: function (e, dt, node, config) {
                ReloadData();
            }
        },
        {
            text: '<span class="fa fa-file-excel-o" data-toggle="tooltip" title="Export To Excel"/>',
            action: function (e, dt, node, config) {
                ExportRequests();
            }
        },
        'colvis'],

        initComplete: function () {
            $('.buttons-colvis').html('<span class="glyphicon glyphicon-cog" data-toggle="tooltip" title="Column Visibility"/>')       // Adds icon to the Column Visibility Button
        },

        "lengthMenu": [[10, 25, 50, 100, 500], [10, 25, 50, 100, 500]],     // page length options
        "pageLength": 25,   // default page length
        "pagingType": "full_numbers",      // pagination related buttons

        "ordering": true,
        "order": [[0, "desc"]],

        "scrollX": true,  // enables horizontal scrolling
        "filter": true,
        "responsive": true,
        "serverSide": true,
        "info": true,   // control table information display field

        "stateSave": true,  //restore table state on page reload,

        "language": {
            "infoFiltered":"",
            "processing": "<img src='~/Content/images/loadingNew.gif' />"
        },
        processing: true,
        "fnPreDrawCallback": function () {
            debugger;
        },
        "fnDrawCallback": function () {
            debugger;

        },

        "ajax":
         {
             "url": Helper.baseUrl() + "Search/LoadData",
             "type": "POST",
             "datatype": "json",
             "data": function (d) {
                 d.searchParams = searchFilters();
             },
         },


        "columns":
        [
           {
               "data": "RequestNo",

           } //and so on

        ],
    });

Am I missing anything?

↧
Search

PreEdit or PostEdit not working to setValue

January 15, 2017, 4:28 pm
$
0
0

PreCreate is working !

->on('preCreate', function($editor, $values) {
            if (($values['field1'] + $values['field2'] + $values['field3'] + $values['field4']) > 29) {
                $_SESSION['user_who']['sumarization'] = "yes";
            } else $_SESSION['user_who']['sumarization'] = "no";

            $editor
                ->field('question')
                ->setValue($_SESSION['user_who']['sumarization']);
        })

PreEdit is not working :(

->on('preEdit', function($editor, $values) {
            if (($values['field1'] + $values['field2'] + $values['field3'] + $values['field4']) > 29) {
                $_SESSION['user_who']['sumarization'] = "yes";
            } else $_SESSION['user_who']['sumarization'] = "no";

            $editor
                ->field('question')
                ->setValue($_SESSION['user_who']['sumarization']);
        })

PostEdit is not working :(

->on('postEdit', function($editor, $values) {
            if (($values['field1'] + $values['field2'] + $values['field3'] + $values['field4']) > 29) {
                $_SESSION['user_who']['sumarization'] = "yes";
            } else $_SESSION['user_who']['sumarization'] = "no";

            $editor
                ->field('question')
                ->setValue($_SESSION['user_who']['sumarization']);
        })

Please you help and thank you very much :-)

↧
↧

Deciding which DataTables files to include in my html.

January 12, 2017, 12:35 pm
$
0
0

I have a project using Bootstrap 3+ and jquery 2+ that I provide.

When I download from .zip file I get a folder with all the .js and .css files for all the frameworks.

My question is. Which script and link files do I need from DataTables?

I assume I need the min versions of datatables.bootstrap.js and css.

Do I also need jquery.datables.js and css? Also, do I need the jquery.dataTables_themeroller.css

See attached. Thanks!

↧

Can't get datatables to work with json string

January 15, 2017, 4:26 pm
$
0
0

For some reason, despite following the tutorials to the letter (at least I think I am), I can't get the following to work. It gives me the dreaded:

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

Here is my code, someone please tell me what I am doing wrong..

<script>
jQuery(document).ready(function(){

var myjsons =[{"one":"195","two":"thing","three":"something","four":"1481200571","five":"test string","six":"www.google.com"}];

jQuery('#actiontables').DataTable( {
        data: myjsons,
        columns: [
            { myjsons: 'one' },
            { myjsons: 'two' },
            { myjsons: 'three' },
            { myjsons: 'four' },
            { myjsons: 'five' },
            { myjsons: 'six' }
        ]
    } );

}); </script>
<table id="actiontables" class="display" width="100%"></table>
↧

Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined

January 17, 2016, 10:37 am
$
0
0

Hello
I have a problem in one of my pages, where I get this error in the console_log.
"Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined"

I have other pages that display all the datatable options without problem. But this one.
All pages have the same include files (but for the specific js file).
This is a very simple page, with 2 tabs and small tables. I have been comparing the code line by line with a page where it works, and cannot find any difference.
Could somebody hint me where the problem might be so I can find it ? what gives this error in most cases ?
Thanks for the help
pat

↧
↧

Editor

January 15, 2017, 10:19 pm
$
0
0

I have the following configuration for the editor.

    editor = new $.fn.dataTable.Editor( {
        table: "#myTable",
        idSrc:  "deviceId",
        fields: [
            {label: "depotName", name: "depotName" } ,
            {label: "clientName", name: "clientName"},
            {label: "rtuName", name: "rtuName"},
            {label: "deviceName", name: "deviceName"},
            {label: "serialNumber", name: "serialNumber"},
            {label: "assetNumber", name: "assetNumber" },
            {label: "serviceTag", name: "serviceTag"},
            {label: "location", name: "location" },
            {label: "ipAddress", name: "ipAddress"},
            {label: "deviceType", name: "deviceType"},
            {label: "deviceStatusMessage", name: "deviceStatusMessage" },
            {label: "quiesce", name: "quiesce" },
            {label: "utilization", name: "utilization" },
            {label: "coverage", name: "coverage"},
            {label: "monoLifeCount", name: "monoLifeCount" },
            {label: "colorLifeCount", name: "colorLifeCount"},
            {label: "pageCountThisMonth", name: "pageCountThisMonth"},
            {label: "createdDate", name: "createdDate"},
            {label: "lastActiveDate", name: "lastActiveDate" },
            {label: "Device ID", name: "deviceId" }
        ]
        ajax: function ( method, url, d, successCallback, errorCallback ) {
            if ( d.action === 'edit' ) {
                  // Update each edited item with the data submitted
                $.each( d.data, function (id, value) {
                   //console.log(findIndexInData(theTable.data, 'deviceId', id));
                   value.DT_RowId = id;
                   $.extend( todo, value );
                   output.data.push( todo );
                } );
            }
             // Store the latest `todo` object for next reload
                localStorage.setItem( 'todo', JSON.stringify(todo) );
            // Show Editor what has changed
              successCallback( output );
        }

When I edit a row the first time in the editor performs as expected and the data is stored in local storage and in the table for display. When I edit a second row the editor replaces the first entry that I edited and continues to perform this way for any other edits.
If I remove the ajax definition the editor performs as expected replacing the correct row with the edited values. I have tried everything I can think of to make it work to no avail and my editor trial is coming to an end.

Can access working site at

tmtest.dlinkddns.com:10010
Sign In with
user - datatables
password - 1234

Select Printers button
A search criteria screen will appear where you can then select the Get The Device List button.
Table should appear and this is where the problem exists.

Any direction is appreciated
Thanks

↧

Datatables Export with JSF

January 15, 2017, 10:36 pm
$
0
0

Good morning, i have a simple problem :

I have managed to export when I do not implement elements of "jsf", but I need it to work with <h: body> and <h: form>, as soon as I remove these elements and I put them as html export works. How can I solve this problem ?

This is my code that work:

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.prime.com.tr/ui"
    xmlns:b="http://bootsfaces.net/ui">
<h:head>

<link   href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" />
<link   href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css"  rel="stylesheet" type="text/css" />

<script
  src="https://code.jquery.com/jquery-1.11.0.min.js"
  integrity="sha256-spTpc4lvj4dOkKjrGokIrHkJgNA0xMS98Pw9N7ir9oI="
  crossorigin="anonymous"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<script src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>
<script src="//cdn.datatables.net/buttons/1.2.4/js/buttons.flash.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script src="//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script src="//cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>
<script src="//cdn.datatables.net/buttons/1.2.4/js/buttons.print.min.js"></script>


<script type="text/javascript">

    window.onload = function() {
        $('.prueba').DataTable( {
            dom: 'Bfrtip',
            destroy:true,
            buttons: [
                'excel', 'pdf'
            ]
        } );
        };
</script>

</h:head>
<!-- Para que falle cambia este body por  h:body y puedes añadirle tambien un h:form -->
<body>
<form>
<b:dataTable id="example2" class="display prueba" cellspacing="0" width="100%">
    <b:dataTableColumn value="prueba1" />
    <b:dataTableColumn value="prueba2" />
    <b:dataTableColumn value="prueba3" />
</b:dataTable>
    </form>
</body>
</html>

and finally if i change <body> for <h:body> and

<

form> for <h:form> dont work.

↧

jTable – jQuery Plugin to Create AJAX Based CRUD ,Search,filterTables using dao,bean,servlet in java

January 11, 2017, 2:08 am
$
0
0

hi this is Ravi.plz i will send image.i want image upload field,curd operations and filter all in one table using jtable,dao,servlet in java with example full length code

↧
Search

how to create filter,search and curd opration all in form using java dao,bean,servlet?

January 15, 2017, 10:50 pm
$
0
0

hi ,
this is Ravinaidu.please send that code with full examle urgently

↧
↧

How can I disable 'edit' button by using table event

January 15, 2017, 11:45 pm
$
0
0

Hi, I have to disable 'edit' button based on selected record, here is what I did

I used default button option for editer

    table = $("#POTable").DataTable
     buttons: [
    { extend: 'create', editor: editor, text: 'Create' },
    { extend: 'edit', editor: editor, text: 'Edit' },
...

    table.on('select', function (e,dt, type, indexes) {
        if (type = 'row') {
            var exdata = table.rows('.selected', { select: true }).data()[0];
            if (exdata.ReceptionStatus === 'C') {
                table.button(0).disable();
                table.button(1).enable();
            } else if (exdata.ReceptionStatus === 'D') {
                table.button(0).enable();
                table.button(1).disable();
            } else {
                table.buttons().disable();
            }

        }
    })

The issue is I cannot disable 'edit' button, the event works however the button was enabled by somewhere inside, please help.

Thanks,
Wenbin

↧

how to remove sTitle in colums?

January 15, 2017, 11:55 pm
$
0
0

when create datatables, the columns are auto generated {sTitle: something} object.

how to remove this object?

it makes my table two same title in one table.

thank you!

↧

How to add checkboxes to items in The Buttons: Colvis drop down menu?

November 13, 2015, 7:44 pm
$
0
0

Previously, I used Colvis plugin to manage column visibility.
Now I tried to use The Buttons extension: Colvis, but there is no checkboxes in this version of plugin.

How to add checkboxes to items in The Buttons: Colvis drop down menu?

↧

Multi-column ordering with "asc" and "desc"

January 16, 2017, 12:21 am
$
0
0

hey guys,

i have a dataTable with multi-column ordering and it works but I need:

first column "asc" and second column desc -> how is this possible?

here is my fiddle: https://jsfiddle.net/zukii/Lucq6vc5/28/

in this fiddle the column "Rating" is automatic default sorting "asc" and then the column "Price" should be automatic "desc"

thanks and greetings ;)

↧
↧

Bootstrap DatePicker editor field plugin fix

January 16, 2017, 12:22 am
$
0
0

Plugin fails, when i try to edit row where column with date is null.
Function fails on val.getMonth (null passes typeof val === 'object' check).

It can be fixed by improving set function.
From:

if ( typeof val === 'object' && val.getMonth ) {
    conf._input.val( val ).datepicker('setDate', val);
}

To:

if ( typeof val === 'object' && val && val.getMonth ) {
    conf._input.val( val ).datepicker('setDate', val);
}
↧

Edit single item and bubble editing not working for multiEditable set to false

January 11, 2017, 3:03 am
$
0
0

In my datatable I have enabled both bubble editing and editing a single or multiple items after selection with main editing form.

If I disable multiEditable in a field, the field works only when clicking new button.
When I select a single item and click edit the field for which multiEditable has been disabled says that the input can only be edited individually. Is taht normal? Can i specify tomehow to the editing form that only a sinlge element is selected and why do i need to do that since the datatable knows how many elements have been selected anyway?
Even if I try to use bubble editing it says the same, even though bubble editing is by default for changing a single cell. Why?

For now I have left multiEditable enabled to avoid these issus but I would appreciate it if you could point me to the right direction.

↧
Search

Datetime picker not showing on main edit form

January 11, 2017, 2:49 am
$
0
0

First of all, thank you for your great work.

I have a bootstrap datatable and editor with a datetime type field (though I use it to only show date), which uses both bubble editing when clicking on an element and main editing when selecting one or more rows and clicking edit.

When using the bubble editing the datetime picker appears normally, but when using the edit button or the new button no datetime picker shows up (and no js error is thrown as well).
It is behaving as it has not been initialized. Is it normall? How do I manually initialize the datetimepicker when the main editing form is shown?
Thank you.

↧

Select opts not deleting on row deletion

January 16, 2017, 1:11 am
$
0
0

Hi! How can I update the select options after having deleted a row? Currently I'm deleting the oldest row every x-second in DT as I'm adding a new row.
However the select options doesnt seem to update when I have deleted a row. How can I access the built in connection between the selects and rows in DT so I can refresh the options?

↧
↧

editor.autoComplete

December 17, 2016, 4:18 pm
↧

How to calculate a field with the API?

January 14, 2017, 3:36 am
$
0
0

Hello everyone,

how is it possible to calculate a non-existing field with the API. E.g. I try to calculate the profit (sellPrice minus purchasePrice).

I tried different ways, but nothing really works.

My current try is this:

Editor::inst( $db, '_stocks' )
->fields(
Field::inst( 'status' ),
Field::inst( 'name' ),
Field::inst( 'profit' ) ->setValue( $row['sellPrice']*$row['purchasePrice'] )
)
->process( $_POST )
->json();

Does anybody has an idea how to solve that issue?

Kind Regards

↧

Catch Table Load Error

January 14, 2017, 4:41 am
$
0
0

Hi Allan,
When I get the table loading error pop up box, (Requested unknown parameter '14' for row 5, column 14. For more information about this error, please see http://datatables.net/tn/4) with the id parameter set to an integer, I know there is a mismatch in the row*col total. I want to catch that error and display a better message to the user. I am pretty sure to use the starter code:

table.on( 'xhr', function ( e, settings, json ) { console.log( 'Ajax event occurred. Returned data: ', json ); } );

I have not been able to find a good example on how to show the user the error before the standard dialog box appears. I just want to state to the user that for example Row 5 is missing an entry and give the details in a more user-friendly format without the default error box showing.
Thanks as always,
bo

↧
Viewing all 81389 articles
Browse latest View live
Search
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>