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

Calculating cells values

December 11, 2017, 2:33 am
$
0
0

Hi Guys I have 2 datatables
dtInvoices & dtInvoiceDetails

dtInvoice has the following columns
date - orderNo - net - vat -Total
I have 2 methods of editing dtInvoiceDetails inline & the editor window.
In this table I have columns
quant - sell - nett - lineTotal - vatRate

What is the event so I can calculate the lineTotal when the quant/ sell amounts change ( either by inline or the editor window)

I also have need the sum of lineTotal to add to the dtInvoice table.

I have this so far.

On the dtInvoice click

  $('#dtInvoices').on( 'click', 'tbody td', function () {
        //alert( tableInvoices.cell( this ).data() )
        currentSelectedInvoiceIndex = tableInvoices.row( this ).index() ;
        alert(currentSelectedInvoiceIndex);
} );

The invoice total is column 2 so I can set the sum to cell(currentSelectedInvoiceIndex,2)

I can't find an example showing this.

So I need

  1. Get the onChange event of a row/cell and calculate the line total
  2. Then calculate the sum of the column lineTotal
  3. Set the total in dtInvoices.

Cheers

Steve Warby

↧
Search

how i save columns reordering state in data base? please explain allan.

December 13, 2017, 9:41 pm
$
0
0

how i save columns reordering state in database?
how i sent column order in database???

↧
↧

Problem with rendering a column

December 14, 2017, 7:06 am
$
0
0

Hi

I have a problem with rendering a column. I need to convert my string into integer:

"columnDefs": [ {
"targets": 5,
"render": function ( data, type, row ) {
    return parseInt(data);
}

}],

The code works fine but I use dataTables to generate tables on multiple pages and for those pages where there are two columns, the whole table will not work. Is there a way I can make render work only for a table with a specific id? I have tried something like:

"columnDefs": [ {
"targets": 5,
"render": function ( data, type, row ) {
    if ( var table==='inventory_table' ) {
        return parseInt(data)};
     };

But it didn't work.

↧

Input's width resizes - How to modify?

December 14, 2017, 10:07 am
$
0
0

Hello,

I've a table for which I'm using DataTable.

This table has input fields inside each row. This is the current view of the table without DataTable:

However, when DataTable is added:

@section scripts{

    <script>
            $(document).ready(function () {
                $("#contadores").DataTable({
                    stateSave: true
                });
            });
    </script>
}

The table resizes becoming wider:

I would like to know how to resize this columns. I've tried with this: https://datatables.net/reference/option/columns.width

@section scripts{

    <script>
            $(document).ready(function () {
                $("#contadores").DataTable({
                    stateSave: true,
                    "columnDefs": [
                        { "width": "20%", "targets": 4 }
                    ]
                });
            });
    </script>
}

But there are no changes.

Thanks!

↧

How to search for values in a table that have a many to one relation with the table that is shown

December 12, 2017, 12:44 pm
$
0
0

I need to search for values in a table that have a many to one relationship with the main table that is show with datatables. How can I send this search information to the php server side script? I will collect the search information in a form but how can i send the form information with the ajax call that is use to update the datatables?

↧
↧

How to re-render the table after updating a cell so the table understands that there is a new value

December 12, 2017, 12:40 pm
$
0
0

Hi! I am a newbie to DataTables and I encountered with a huge (for me) problem that I just don't get how to solve. Here is my live demo https://codepen.io/Balzzac/pen/mpdGgL with questions in certain places .

Let me try to explain: i have a table (id='js_table') that gets data from AJAX call (in codepen - from variable dataSet). It has 2 columns: "Assigned" and "Name". When data comes I render the first column, replacing "yes"/"no" with circles for type==="display" and with"assigned"/"not assigned" for "else", so it looks nice and provide a user the opportunity via clicking on the circle to assign or unassign a person.

When clicking on the circle (js_assign_element), JS runs a function where it replaces classes (from green to red and vice versa) as well as changing data-attributes into "assigned" when the person wasn't assigned and "not assigned" when person was. But the table itself doesn't "understand/recognize" the change, so it sorts and filters the first column like no changes were made.

$(document).off('click', '.js_assign_element').on('click', '.js_assign_element', function (event) {
     event.preventDefault();
    event.stopPropagation();
    if ($(this).hasClass("__assigned")) {
        $(this).removeClass("__assigned").attr("data-search", "not assigned").attr("data-filter", "not assigned").attr("data-sort", "not assigned").attr("data-order", "not assigned")
    }
    else
    {
        $(this).addClass("__assigned").attr("data-search", "assigned").attr("data-filter", "assigned").attr("data-sort", "assigned").attr("data-order", "assigned")
    }

    // Tried Following:
    // $("#js_table").DataTable().draw() - doesn't work
    // $("#js_table").DataTable().rows().invalidate("dom").draw() - doesn't work
    // $("#js_table").DataTable().rows().invalidate().draw() - doesn't work either
})

Can you please look and help me with my question(s)? Thanks

↧

Added a second table to a page, child rows stopped working.

December 12, 2017, 1:59 pm
$
0
0

I have a page, Demo1 - Copy.html, that contains one table and makes use of child rows. It's working fine, AFAIK.

In Demo.html, I added a second table, which uses a second data source. When I made that change, child rows quit working. I can see at least part of the problem -- for example, I'm sure that #example at line 141 needs to be change-- but I don't know how to fix it. Anyone know right off how to fix this?

↧

Fetch currently Logged-in user row from Data-table and show

December 12, 2017, 2:47 am
$
0
0

Question: When the particular user logged-in using the Register Number. I want only the particular row to be fetched from all the table and shown in a block/page to the current user.

I think using search or filter code can do this.

How can i do this ?

Note: Expecting PHP/Javascript Code. Easy for me to understand.

Please find the Image attachment(Data table added using Feed).

↧
Search

Recalculate sum when printing to PDF or Excel

December 11, 2017, 12:15 pm
$
0
0

Hi everyone, I have used Datatables to create a paginated Table and show sum of the current page as the footer, it is working as expected, on every page it will recalculate the sum, but the problem is when I print using PDF or Excel, the sum is same as per page, but the rows are the complete match of the search criteria. Can any of you please help me? if needed here's the jquery code of the table:

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

        var table = $('#table').DataTable({
            'initComplete': function (settings, json){
                this.api().columns('6,8,7', {page:'current'}).every(function(){
                    var column = this;
                    var sum = column
                    .data()
                    .reduce(function (a, b) {
                        a = parseFloat(a, 10);
                        if(isNaN(a)){ a = 0; }

                        b = parseFloat(b, 10);
                        if(isNaN(b)){ b = 0; }

                        return (a + b).toFixed(2);
                    });
                    if(!sum.includes('€'))
                        sum +=' &euro;';
                    $(column.footer()).html(sum);
                });
            },
            footerCallback: function () {

                this.api().columns('6,8,7', {page:'current'}).every(function(){
                    var column = this;
                    var sum = column
                    .data()
                    .reduce(function (a, b) {
                        a = parseFloat(a, 10);
                        if(isNaN(a)){ a = 0; }

                        b = parseFloat(b, 10);
                        if(isNaN(b)){ b = 0; }

                        return (a + b).toFixed(2);
                    });
                    if(!sum.includes('€'))
                        sum +=' &euro;';
                    $(column.footer()).html(sum);
                });
            },
            dom: 'Bfrtip',
            buttons: [
                {
                        extend: 'copyHtml5',
                        exportOptions: {
                            columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8 ]
                        },
                        footer: true
                },
                {
                    extend: 'excel',
                    exportOptions: {
                        columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8 ]
                    },
                    footer: true
                },
                {
                    extend: 'pdfHtml5',
                    exportOptions: {
                        columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8 ]
                    },
                    footer: true
                }
            ]
        });
    });
</script>
↧
↧

column.search() is not filtering my table

December 11, 2017, 10:42 pm
$
0
0

Can you please check what did I missed in my datatable. I've created a simple search but it's not filtering.

<input type="text" id="txtserial" name="txtSerial" class="form-control" />

Here's my javascript:

       var dtmyJob = $('#myJob').DataTable({
            "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
            iDisplayLength: -1,
            sScrollY: "40vh",
            bScrollInfinite: true, //this property disables pagination
            "scrollCollapse": true,
            "paging": false,
            "bInfo": false,
            "bFilter": false,
            "bSort": false
        });

        $("#txtserial").on('keyup', function () {
            dtmyJob.columns(2).search(this.value).draw();
            alert(dtmyJob);
        });
↧

Individual column searching (select inputs) sort order

December 11, 2017, 6:07 am
$
0
0

Hi,
When selecting the drop-down menu select menu, the items listed within the menu are sorted case sensitive like this:

A
B
C
a
b
c

How can the items in the drop-down menu be sorted:

A
a
B
b
C
c

(see the capture taken from http://live.datatables.net/gejojiqu/99/edit)

In the attachment, how can the drop-down menu items be sorted as follows:

Edinburgh
edinburgh
London
New York
San Francisco

Thanks,
John

↧

How to merge duplicated rows

December 11, 2017, 4:22 am
$
0
0

I want to add a row with multiple line content
eg) title_2 (second row in table)
Subject_1, Category_2 and Subcategory_2 should come in same row since they are related.
similarly, Subject_2, Category_3, Subcategory_3 should come in same row.
Is that possible?
Now I jst did it with mRender but it will not be aligned if lengthy data comes. Also UI breaks for mobile view.
Any help @allan

↧

DataTables as ES6 module

December 19, 2017, 4:25 pm
↧
↧

preGet not working

November 3, 2017, 12:39 am
$
0
0

I want to change the field value of pregroupdata.status before datatable read from database. I use preGet event to implement. But it is not work.

There is my code.

<?php
header("Conten-Type:text/html;charset=utf-8");
/*
 * Example PHP implementation used for the index.html example
 */

// DataTables PHP library
include( "../../php/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;

// Build our Editor instance and process the data coming from _POST
Editor::inst( $db, 'pregroupdata' )
    ->fields(
        Field::inst( 'pregroupdata.appdate' ),
        Field::inst( 'pregroupdata.status' )->set(Field::SET_BOTH),
        Field::inst( 'pregroupdata.setupdate' ),
        Field::inst( 'pregroupdata.pastoralid' )->validator ( 'Validate::notEmpty' )
                                   ->options ( Options::inst()
                                                ->table( 'pastoral' )
                                                ->value( 'id' )
                                                ->label( 'name' )
                                             ),
        Field::inst( 'pname.name' ),
        Field::inst( 'pregroupdata.zoneid' )->validator ( 'Validate::notEmpty' )
                               ->options ( Options::inst()
                                                ->table( 'zonedata' )
                                                ->value( 'id' )
                                                ->label( 'name' )
                                             ),
        Field::inst( 'zname.name' ),
        Field::inst( 'pregroupdata.leaderid' )->validator ( 'Validate::notEmpty' )
                                 ->options ( Options::inst()
                                                ->table( 'leader' )
                                                ->value( 'id' )
                                                ->label( 'name' )
                                             ),
        Field::inst( 'lname.name' ),
        Field::inst( 'lname.phone' ),
        Field::inst( 'lname.cellphone' ),
        Field::inst( 'lname.identity' ),
        Field::inst( 'pregroupdata.groupname' ),
        Field::inst( 'pregroupdata.gdate' ),
        Field::inst( 'pregroupdata.gtime' ),
        Field::inst( 'pregroupdata.gplace' ),
        Field::inst( 'pregroupdata.property' ),
        Field::inst( 'zlname.name'),
        Field::inst( 'zlname.phone'),
        Field::inst( 'zlname.cellphone'),
        Field::inst( 'zlname.identity' )
    )
    ->leftJoin('leader as lname', 'pregroupdata.leaderid','=','lname.id')
    ->leftJoin('zonedata as zname', 'pregroupdata.zoneid','=','zname.id')
    ->leftJoin('pastoral as pname', 'pregroupdata.pastoralid','=','pname.id')
    ->leftJoin('leader as zlname', 'zlname.id','=','zname.leaderid')
    ->on('preGet', function($editor, $id){
        $editor
            ->field('pregroupdata.status')
            ->setValue('test');
    })
    ->process( $_POST )
    ->json();

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

↧

Nested editors - scrolling question on secondary editor

December 19, 2017, 5:15 pm
$
0
0

Hi everyone,

I'm using the 'Bootstrap' display controller for all my table.

For a specific table, I needed to have a nested editor (a pop up with details) and since using Bootstrap display for my secondary editor looks compromised (according to the posts I read
due to bootstrap limitation with multiple modals) I used the [jQueryUI display controller (https://editor.datatables.net/reference/display/jqueryui "jQueryUI display controller").

After some tuning (z-index etc...) my secondary window shows up with a limitation however on scolling. Infact my secondary editor is higher than the modal original editor and therefore the bottom part of it is 'under my screen' with no way to reach it with scrolling (blcked, probably due to my 'parent bootstrap modal' editor.

Do you have in mind any tricks which would enable scrolling in my secondary editor which is nested in a bootstrap modal?

Many thanks!

Sébastien

PS: any elegant / inelegant suggestion is welcomed ! If anyone has a solution to use full bootstrap solution in this case he could count on all my admiration !

↧
Search

Prevent row deselection

December 13, 2017, 6:55 pm
$
0
0

Hello.
I'm using DataTables with Select extension.
select: {style: "single"}
So user selects a row by clicking on it.
I don't want the row to be deselected when user clicks on it again. Just do nothing.
Any informaton on how to stop deselect event?

"datatables.net": "^1.10.16",
"datatables.net-bs": "^2.1.1",
"datatables.net-select-bs": "^1.2.3",
↧

I purchased Editor yet the samples no longer work telling me I need to purchase Editor.

December 19, 2017, 7:06 pm
$
0
0

How can I get the ASP.NET MVC Editor examples to work again now that I purchased Editor?

↧
↧

auto fill and state save working together or not???

December 19, 2017, 3:13 am
$
0
0

i am useing auto fill and state save together but when i drag auto fill data fill is it ohk but when i refresh the page old data will be placed as it is. that's not statesave function work acttually.

auto fill data change server side also????

↧

Ajax Post Method

December 19, 2017, 9:28 pm
$
0
0

I have a requirement to use POST method using Ajax to invoke my .NET WCF JSON Service but when i tried, encountered an error,

Below is my code,

        $('#CaseInformationGrid').dataTable({
            "processing": true, // control the processing indicator.
            "serverSide": true, // recommended to use serverSide when data is more than 10000 rows for performance reasons
            "info": true,   // control table information display field
            "stateSave": true,  //restore table state on page reload,
            ajax: {
                "url": "http://localhost:61358/RetrieveCase.svc/CaseInformation",
                "type": "POST",
                "data": {
                    "User_Id": "Kannan"
                }
            },

Please help me out.

Kannan

↧

Show the colvis button, but do not include the 1st,3rd in colvis menu

December 19, 2017, 10:02 pm
$
0
0

implemented colvis button and tried to customize the options visibility:

followed from https://datatables.net/reference/button/colvis#Examples

Would like to hide the first and third with following code.But it is hiding all 1,2,3 coumns in the colvis menu.Is there any way to hide only 1 and 3 but not the 2nd column and show 4th to all remaining columns?

dom: 'Blfrtip',
            buttons: [{
                extend: 'colvis',
                columns: ':gt(0):gt(1)',
                text: 'Column Visibility',
                titleAttr: 'By clicking on a field you could hide or show some extra columns in the table.'
            }],
↧
Viewing all 81799 articles
Browse latest View live
Search
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>