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

Fixed Columns and Individual column filtering (Selected inputs)

$
0
0

Hello all,

I am working an application that uses data tables to present a table with fixed columns and individual column filtering using selected inputs. I have not been able to find a solution to allow me to filter the first column. I am aware that this issue has not been covered in the examples for DataTables and wanted to know if anyone had any insight on how to maneuver further. Here is a working example:

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

Everything else works except for the filtering in the first column.

Thank you for your time.


Is there a way to sort similar to MySQL order by field?

$
0
0

I have a situation where I need to sort a table by a column whose content (which is limited to a small set of values) does not fall alphabetically into the desired order for display. The MySQL feature ORDER BY FIELD(...) would accomplish what I need when the page is loaded. I would need to be able to do this as the page might be re-sorted while it is being viewed. Does DataTables have a way to do this, client-side, that I've just not found?

continuation to select2 edit default value:

$
0
0

continuation to https://datatables.net/forums/discussion/52203/editor-select2-ajax-set-default-value

'set' have to be in "opts"?
can i see any example ,below code didnt helped..

{
               "label": "propertyArea",
               "name": "propertyArea.propertyAreaId",
               "type": "select2",
               "data": "propertyArea.propertyAreaName",
               "initialValue":true,
               "set": function (conf, val) {
                   alert("pa out");
               },
               "opts": {
                   "minimumInputLength": 3,
                   "placeholder": 'Property Area',
                   "allowClear": true,
                   "initialValue":true,
                   "set": function (conf, val) {
                       alert("pa in");
                   },
                   ajax: {
                     url: 'propertyArea/json',
                     delay: 250 ,
                     dataType: 'json',
                   //  initialValue:true,

                   data: function (params) {
                       var query = {
                             value: params.term
                         //type: 'public'
                       }

                       // Query parameters will be ?search=[term]&type=public
                       return query;
                     },
                   processResults: function (data) {
                     return {
                         results: $.map(data, function(obj) {
                             return { id: obj.propertyAreaId, text: obj.propertyAreaName };
                         })
                     };
                 }
                   }
              }

Date field modify data

$
0
0

I have a date field that I want to accept different input styles for. Where would I intercept the value before it gets sent to the server for inserting into the database? I am looking at the Editor event "preSubmit", but I was hoping for something when the date field loses focus, is that possible?

AutoFill and KeyTable with Dynamically Generated tables

$
0
0

Hey guys I am currently working on a project using datatables. I am currently using CreateElement('table') , using .innerHTML to add the </tds> and </trs> then using appendchild to add my table to the dom. My static tables all work fine, these tables do not use the editor and to include the autofill and keytable feature i just need to add {'keys': true, 'autoFill': true} in the properties when initializing the table. However in my Dynamically created tables the two extensions doesn't seem to be working at all, its as if the extensions are not even included. the Dynamically generated tables are using the editor.

Form my understanding when I am using the editor with datatables I need to add

   autoFill: {
        columns: ':not(:first-child)',
        editor:  editor
    },
    keys: {
        columns: ':not(:first-child)',
        editor:  editor
    },
    select: {
        style:    'os',
        selector: 'td:first-child',
        blurable: true
    },

to my properties to include the features but its as if these lines are not even included at all.
Here is my source code for the initialization for the editor and table of doing this.

    var editor = new $.fn.dataTable.Editor({
    table: '#seoScopeTable',
    /* THIS AJAX JUST CALCULATES THE TOTAL AND PUTS IT TO THE LAST COL*/
    ajax: function (a, b, data, successCallback, errorCallback) {
      var rowID = Object.keys(data.data)[0];
      var updatedData = data.data[rowID];
      updatedData['rowId'] = rowID;
      var excludeProps = ['', 'TOTAL'];
      var totalColData = 0;
      for (var eachDataCell in updatedData) {
        if (excludeProps.includes(eachDataCell)) {
          continue;
        }
        var parsedNumber = parseInt(updatedData[eachDataCell]);
        totalColData += parsedNumber ? parsedNumber : 0;
      }
      updatedData['TOTAL'] = totalColData;
      successCallback({
        'action': data.action,
        "data": [updatedData]
      });
    },
    'idSrc': 'rowId',
    fields: headers.map(function (val, index) {
      return {
        'name': val.split(' ').join().split(',').join('')
      }
    })
  })
  seoScopeTable = $(seoScopeTable).DataTable({
    'dom': "Bfrtip",
    'idSrc': 'rowId',
    'keys': {
      columns: ':not(:first-child)',
      editor: editor
    },
    'columns': headers.map(function (val, index) {
      return {
        'data': val.split(' ').join('').split(',').join('')
      }
    }),
    /*autoFill:{
      'columns': ':not(:first-child)',
      'editor': Teditor
    },*/
   'select': {
      'style':    'os',
      'selector': 'td:first-child',
      'blurable': true
    },
    'data': tableData,
    'ordering': false,
    'paging': false,
    'retrieve': true
  });

Do you guys see any problems with the initialization of the table and editor. Would you suggest anything where I should look to debug this problem?

Thanks

How to Export Grouped rows

$
0
0

I cannot export the grouped rows using button exports. I used my own functionality using basic row grouping code for grouping rows in data tables and when i exported the table using "buttons" the grouped rows are not exported. Also I am using static serial number which is also not exported, instead it is found empty. Is there a way to export the contents which are added later. Any idea would be helpful.
Thanks in advance.

My datable doesn't load the json object

$
0
0

I'm new with Datatable and I don't know how to solve this issue. I've been trying to load an array of objects but it doesn't work. I really appreciate if anybody could help me. Post my code below.

This is my source:
[
{
"contador": 1,
"serie":"3BKHKM9X59F373849",
"placas":"307EW9",
"tipounidad":"TORTON",
"socio":"TRANSPORTES CASTORES S.A. DE C.V. (ESCUELA)",
"noeconomico":"00064",
"marca":"KENWORTH",
"modelo":2009,
"estatus":1,
"km":0
},

{
    "contador": 2,
    "serie":"3BKHKM9XXJF313957",
    "placas":"93AD9M",
    "tipounidad":"TORTON",
    "socio":"TRANSPORTES CASTORES S.A. DE C.V. (ESCUELA)",
    "noeconomico":"00307",
    "marca":"KENWORTH",
    "modelo":2018,
    "estatus":1,
    "km":0
},

{
    "contador": 3,
    "serie":"3BKHKM9X1HF311718",
    "placas":"05ABB7L",
    "tipounidad":"TORTON",
    "socio":"TRANSPORTES CASTORES S.A. DE C.V. (ESCUELA)",
    "noeconomico":"00159",
    "marca":"KENWORTH",
    "modelo":2017,
    "estatus":1,"km":0
},

{
    "contador": 4,
    "serie":"3BKHKM9X0JF314275",
    "placas":"55AE4L",
    "tipounidad":"TORTON",
    "socio":"TRANSPORTES CASTORES S.A. DE C.V. (ESCUELA)",
    "noeconomico":"00309",
    "marca":"KENWORTH",
    "modelo":2018,"estatus":1,"km":0
}

]

Datatable code:

                $('#detalle-table').DataTable({
                    "ajax": {
                        url: "ajax/cargar_reportedetalle",
                        type: "POST",
                        dataType: 'json',
                        dataSrc: "",
                        columns: [
                            { data: "contador" }
                            { data: "noeconomico" },
                            { data: "marca" },
                            { data: "modelo" },
                            { data: "placas" },
                            { data: "tipounidad" },
                            { data: "socio" },
                            { data: "km" },
                            { data: "estatus" },
                            { data: "serie" }
                        ]
                    }
                });

keeping the first row of my table fixed

$
0
0

On the server side I generate a row of sum data for my table. When I want to display it at the bottom the the table, I simply put it in the footer. I first thought, in order to display it at the top of the table, to put it in the header. It works, however, it creates a new problem: My table header has two rows: labels and sums. The sort links are appearing on the sums row (second row of the header) and I want them to appear on the labels row (first row of the header).
Is there a way to adjust on which row the sorting links will be placed? Or, is there a way to put the sums row into the tbody. If so, I need to keep it in the first row always, even after sorting the other rows.


Inline editor - multiple fields with select

$
0
0

Inline editor - multiple fields with select, when an option is selected, the other select field value displays a blank. It's not changed in the data, but the list displays blanks.

Select2 and autocomplete

$
0
0

I did download select2 and jquery-uf in order to use select2 and autocomplete features, but they don't work.
I get 'autocomplete' error "0x800a139e - JavaScript runtime error: Error adding field - unknown field type autocomplete"

Can anyone direct me to how to example for select2 and auto

.NET Core System.Exception: Unknown database type specified at DataTables.Database.Adapter()

$
0
0

Hello,

I'm trying out .NET Core with DataTables Editor and am having an issue connecting to the database. Indications are there's an issue at DataTables.Database.Adapter() in /home/vagrant/DataTablesSrc/extensions/Editor-NET/DataTables-Editor-Server/Database.cs:line 170.

I don't know how to actually get to that file to see what it says.

I downloaded the demo and that works fine: this error is generating for a project where the .NET Core Editor stuff was acquired into the project via NuGet (Version 1.8.1).

I've modified the launchSetttings.json, program.cs files as per installation instructions at editor.datatables.net/manual/net/core. Again, I have the editor .NET Core demo running fine.

I'm not sure what other information to provide at this point.

Thanks in advance for any insight,
-j

How can I use multiple checkbox filter?

$
0
0

Right now, this filter is working when my single checkbox is checked:

$('#sportsNBA').on('change', function() {
    if( $(this).is(':checked') ) {
        table.columns(1).search('nba');
    }
    table.draw();
});

However, if I create another one, like so:

$('#sportsNFL').on('change', function() {
    if( $(this).is(':checked') ) {
        table.columns(1).search('nfl');
    }
    table.draw();
});

It only takes the second one in consideration.

What I'm basically looking for, is have many checkboxes with filters and allow the user to check as many as he wants and have it filter from the initial data in the table.

UPDATE: I've seen how to make it work with previous versions, but not the current one: http://plnkr.co/edit/b8cLVaVlbNKOQhDwI2mw

Populate a text field by choosing an item from a select list?

$
0
0

So I have a user_id (Select field) and Full name (text field) in editor. I'm trying to populate the Full name based on the selected user_id.

{
                label: 'Assigned Employee ID:',
                name: 'user_id',
                type: 'select',
              }, {
                label: 'Assigned Employee Name:',
                name: 'assigned',
                type: 'text',
                readonly: true,
                fieldInfo: \"This field is read only and is created when the assigned employee id is selected.\",
                onChange: function ( data, type, set ) {
// get column indexes
// set data to assigned employee's full_name
                   return data.full_name;
                },
              }

I'm stuck trying to get the column index. Can anyone help? I read and re-read the columns().index() page but I'm just not getting it.

keys, key-focus select row instead cell

$
0
0

I wanted to know if it is possible to navigate the list only up and down and not allow horizontal navigation between cells and allow only the navigation with the keys with only between the rows.

unable to make search using key up

$
0
0

i have a datatable in which when i try to search using keyboard it shows no search is found but when i do it using right click it shows result please help


a issue about aoColumnDefs

$
0
0

like the title,my code like this,
"aoColumnDefs":[
{
"targets":5,
createdCell: function(td, cellData, rowData) {
var data = cellData;
if(data == 5){
$(td).parents('tr').children('td').eq(2).attr("class","warning");
$(td).parents('tr').children('td').eq(2).css("text-decoration","line-through");
}else if(data == 4){
$(td).parents('tr').children('td').eq(2).attr("class","success");
}else{
$(td).parents('tr').children('td').eq(2).attr("class","danger");
}
}
}
],
when i click the title to order my data,this code seem not working,i need to set a condition to paint my datacell,anyone can help?

Date format when export datatable to excel

$
0
0

In my datatable I have a column with date format but when export to excel the format date change to General then I can´t sort from the most recent date to the oldest date

Bug between dom declaration and multi select rows

$
0
0

Hi everyone, I got some issue with my DataTable and I didn't find a way to fix it.
My situation: I have a table and i need to change de dom declaration. I'm using the bootstrap 4 way. The thing is when i put this dom on top of my table, it removes the possibily to select rows in my table, but if i put it at the bottom of this one, everything work perfectly... im kinda lost here...
The Code:

 select: {
                    style: 'multi',
                    // selector: 'td:first-child'
                },

                 dom: "<'row mt-3 mx-0'<'col-lg-2 d-flex align-items-center'p><'col-lg-2 d-flex align-items-center'l><'col-lg-3 d-flex align-items-center'i><'col-lg-5 text-right'B>>",

Thanks for the answer :)

Problem using ColReorder and ColVis Button

$
0
0

I have a problem on my Datatable., it seems a conflict between ColReorder and ColVisButton

I use the colReorder extension to re-arrange columns, and ColVis button to hide/show columns, and I soon as I change the order of the columns, the visibility buttons stop working as expected, meaning they do not hide the expexted column.

The problem is the following:
If I use the button to show/hide "Column3" it works perfectly, but, if I rearrage columns order and put let's say "Column10" in the 3rd place, that is, where "Column3" used to be, now the button assigned to Column3 visibility does not hide Column3 but the one that took its place, that is, Column10. The button title does not correspond with the column title it hides anymore....

It happens either way if I set saveState: true or false.

This is the versions I am using:

+---------------+-------------------+-----------+---------+
| Library | Info | Installed | Latest |
+---------------+-------------------+-----------+---------+
| DataTables | Nightly available | 1.10.19 | 1.10.19 |
+----------------+-------------------+-----------+---------+
| ColReorder | Up to date | 1.5.1 | 1.5.1 |
+----------------+-------------------+-----------+---------+
| Buttons | Up to date | 1.5.4 | 1.5.4 |
+---------------+-------------------+-----------+---------+

Anyone can help me with hat

Show number of grouped rows per group

$
0
0

Just change line 281 of dataTables.rowGroup.js to
display = this.c.startRender.call( this, dt.rows(rows), groupName + " (" + group.rows.length + ")" , level );

Viewing all 81387 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>