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

Custom editor

0
0

Good afternoon
I'm trying to create a search engine to be able to select a record within a custom editor: template: '#customForm',
The field I want to filter is:
<editor-field name = "tb_palabra []. id"> </ editor-field>
I would appreciate any surgency.
A greeting.


Hiding pagination when the table only has a single page when filtering

0
0

Is there a way to hide the pagination controls when there is only one page that display after you filter the table with and filtering, like text search, column filter and page length?

Export multi row header to pdf

0
0

How can I export multiple rows in header with col spans. Has this been implemented in datatables yet?

Column Visibility Button Issue In IE11 version 1.5.4

0
0

I noticed after updating to version 1.5.4 that the Column visibility dialog is being clipped. It's also not highlighting the buttons when clicked. This is working normally in Chrome, issue is in IE11.

Reverting to version 1.5.2 resolved the problem.

1.5.4:

1.5.2 :

Error Requested unknown parameter

0
0

Data Table

$(document).ready(function() {


      var advance = $('#advanced-table').DataTable( {
              
        
      dom: 'B<"clear">lfrtip',
  
    "processing": true,
    "serverSide": true,

      "ajax":{
                        url :"server_processing.php ", // json datasource
                        type: "post",  // method  , by default get
                        
                    },
         

      
          mark: true,
           columnDefs: [
            {
                targets: 1,
                className: 'noVis',
        
            },
            {
                "targets": [ 6 ],
                "visible": false
            },
            {
                "targets": [ 7 ],
                "visible": false
            }   
            
        ],
      
    buttons: {
        name: 'primary',

        buttons: [ 'copy', 'csv', 'excel', 'pdf', 'print', 'colvis'  ]
    },
          
          
  
    
          //"language": {
                //"url": "http://cdn.datatables.net/plug-ins/1.10.13/i18n/Portuguese-Brasil.json"
           // } 
          
   
    } );

    
    $('a.toggle-vis').on( 'click', function (e) {
        e.preventDefault();
 
        // Get the column API object
        var column = advance.column( $(this).attr('data-column') );

        // Toggle the visibility
        column.visible( ! column.visible() );
    } );  
    


// Setup - add a text input to each footer cell
    $('#advanced-table tfoot th').each( function () {
        var title = $(this).text();
        $(this).html( '<div class="md-input-wrapper"><input type="text" class="md-form-control" placeholder="Pesquisar '+title+'" /></div>' );
    } );
      // Apply the search
    advance.columns().every( function () {
        var that = this;
 
        $( 'input', this.footer() ).on( 'keyup change', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );
    } );

    

    } );

server_processing.php

<?php
/* Database connection start */
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "entt";

$conn = mysqli_connect($servername, $username, $password, $dbname) or die("Connection failed: " . mysqli_connect_error());

/* Database connection end */


// storing  request (ie, get/post) global array to a variable  
$requestData= $_REQUEST;


$columns = array( 
// datatable column index  => database column name
    0 =>'ID', 
    1 =>'Nome', 
    2 => 'E-mail',
    4 => 'Cidade',
    5 => 'Estado',
    6 => 'Cep',
    7 => 'Data',
    8 => 'Hora',
    9 => 'Status'
);

// getting total number records without any search
$sql = "SELECT id, email, nome, cidade, estado, cep, data, hora ";
$sql.=" FROM usuarios";
$query=mysqli_query($conn, $sql) or die("server_processing.php: get usuarios");
$totalData = mysqli_num_rows($query);
$totalFiltered = $totalData;  // when there is no search parameter then total number rows = total number filtered rows.


$sql = "SELECT id, email, nome, cidade, estado, cep, data, hora ";
$sql.=" FROM usuarios WHERE 1=1";
if( !empty($requestData['search']['value']) ) {   // if there is a search parameter, $requestData['search']['value'] contains search parameter
    $sql.=" AND ( id LIKE '".$requestData['search']['value']."%' "; 
    $sql.=" OR nome LIKE '".$requestData['search']['value']."%' ";
    $sql.=" OR email LIKE '".$requestData['search']['value']."%' ";
    $sql.=" OR cidade LIKE '".$requestData['search']['value']."%' )";
    $sql.=" OR estado LIKE '".$requestData['search']['value']."%' )";
    $sql.=" OR cep LIKE '".$requestData['search']['value']."%' )";
    $sql.=" OR data LIKE '".$requestData['search']['value']."%' )";
    $sql.=" OR hora LIKE '".$requestData['search']['value']."%' )";
}
$query=mysqli_query($conn, $sql) or die("server_processing.php: get usuarios");
$totalFiltered = mysqli_num_rows($query); // when there is a search parameter then we have to modify total number filtered rows as per search result. 
$sql.=" ORDER BY ". $columns[$requestData['order'][0]['column']]."   ".$requestData['order'][0]['dir']."  LIMIT ".$requestData['start']." ,".$requestData['length']."   ";
/* $requestData['order'][0]['column'] contains colmun index, $requestData['order'][0]['dir'] contains order such as asc/desc  */    
$query=mysqli_query($conn, $sql) or die("server_processing.php: get usuarios");

$data = array();
while( $row=mysqli_fetch_array($query) ) {  // preparing an array
    $nestedData=array(); 

    $nestedData[] = $row["id"];
    $nestedData[] = $row["nome"];
    $nestedData[] = $row["email"];
    $nestedData[] = $row["cidade"];
    $nestedData[] = $row["estado"];
    $nestedData[] = $row["cep"];
    $nestedData[] = $row["data"];
    $nestedData[] = $row["hora"];
    $data[] = $nestedData;
}



$json_data = array(
            "draw"            => intval( $requestData['draw'] ),   // for every request/draw by clientside , they send a number as a parameter, when they recieve a response/data they first check the draw number, so we are sending same number in draw. 
            "recordsTotal"    => intval( $totalData ),  // total number of records
            "recordsFiltered" => intval( $totalFiltered ), // total number of records after searching, if there is no searching then totalFiltered = totalData
            "data"            => $data   // total data array
            );

echo json_encode($json_data);  // send data as json format

?>

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

Update specific column of rows in existing datatables

0
0

I am stuck in here for a few days now and I want to finish this final module of mine.

My expected result is like this one:

ordered qty | stocked quantity|
_________ | _____________|
3 | 5 |
1 | 2 |
1 | 1 |

But currently working code is like this

ordered qty | stocked quantity|
_________ | _____________|
3 | 3 |
1 | 1 |
1 | 1 |
| 5 |
| 2 |
| 1 |

My working code is like this.
for(var i=0; i < count; i++) { table.row.add(["", "", "", stocked_qty_array[i], "", "", "", "", "", ""]); } table.draw();

I am completely aware that it works fine but it's not the result that I am expecting. Can someone please give me some idea about this? Thank you guys!!

This is my screenshot:

Add user inputs to the delete modal

0
0

I require a username and password for inserting/editing/deleting any row in my data table.

I'm using the pure js datatables editor set up with mvc. It works fine for create/edit because I just include the username and password fields in my model. But for delete I don't seem to be able to map it to a template, or add/show any fields? It's stuck at just being one button "delete".

How do I have inputs on the delete modal?

Thanks

JackTrap

DataTables-Editor-Server Method not found: System.String.Split

0
0

Hello

I require .NET Framework 4.5.1 for OWIN packages I am using.
Should DataTables-Editor-Server work with .NET Framework 4.5.1?

The Demo for .NET Framework 4.5 work perfectly.

I installed DataTables-Editor-Server in my projects via NuGet Package manager
When calling editor.Process(formData) I get the following error:

$exception {"Method not found: 'System.String[] System.String.Split(Char, System.StringSplitOptions)'."} System.MissingMethodException

Is there a way around this without changing the Framework to 4.5?


Datatable cache problem

0
0

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.

How to stop Datatable's state change while re-render the data of column?

0
0

I have created a datatable and saved the state at server-side(using callback method "stateSaveCallback") and load the state using callback method "stateLoadCallback". But when I render the row column(using trigger col[0].render = function (data, type, row) {
......
......
}), datatable's state changed.

How to Bind dynamic data from ajax to datatable

0
0

In my case columns of datasource will change based on some condition. so, i want to bind that dynamic data to a datatable. but how?

Custom date format with sorting

0
0

I'm trying to set up some date columns with a custom date format. I started with format 'ddd DD MMM YYYY' but realised this would be too long so I've now changed to 'ddd DD/MM/YYYY' to save a bit of horizontal space. All the dates and sorting were working fine when I was using 'ddd DD MMM YYYY'.

Since changing the format, I'm getting a weird 'Invalid Date' issue.

HTML

<table id="ops-br-table" class="table-full-width table table-striped table-minimal-padding">
    <thead>
        <tr>
            <th>Request Date</th>
            <th>Operator</th>
            <th>Tour ID</th>
            <th>Tour Name</th>
            <th>Duration</th>
            <th>Comments</th>
            <th>Name</th>
            <th>Email Address</th>
            <th>Brochure Sent</th>
            <th>Planned First Chase</th>
            <th>First Chase</th>
            <th>Planned Second Chase</th>
            <th>Second Chase</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

JavaScript

$.fn.dataTable.moment('ddd DD/MM/YY');
$('#ops-br-table').DataTable({
    ajax: {
        url: settings.apiBaseUrl + 'interactions/brochurerequests',
        dataSrc: ''
    },
    columns: [
        {
            data: 'requestDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        },
        { data: 'tourDetail.operator.name' },
        { data: 'tourId', width: "5%"  },
        { data: 'tourDetail.tourName', width: "10%" },
        { data: 'tourDetail.tourDuration' },
        { data: 'userComment', width: "15%" },
        { data: 'user.friendlyIdentifier' },
        { data: 'user.email' },
        {
            data: 'sentDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        },
        {
            data: 'plannedFirstChaseDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        },
        {
            data: 'firstChaseDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        },
        {
            data: 'plannedSecondChaseDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        },
        {
            data: 'secondChaseDate',
            type: 'date',
            render: function (data, type, row) { return data ? moment(data).format('ddd DD/MM/YY') : ''; }
        }
    ],
    order: [
        [ 0, "desc"]
    ],
    pageLength: 25
});

Here's a Fiddle without the AJAX dependency: https://jsfiddle.net/rk6e10ft/

Interestingly, in the fiddle, the only date that works is "Mon 11/06/18" but if I change this to "Mon 20/06/18" then it breaks too. It's like it's getting the day and month values confused or something. Is it something to do with the forward slashes? If so, I've already tried escaping them with square brackets as described here: https://stackoverflow.com/questions/28241002/moment-js-include-text-in-middle-of-date-format which did not work.

EDIT: Updated fiddle and removed escaping square brackets from formats.

Bind Datatable :Call a javascript function and pass value to function from partial view

0
0

I have defined a function 'formatPrice' in accountJS file, which I want to call while binding jquery datatable in a partial view.Along with that I want to pass the value to this function @item.price. Below is the code, where I am not getting how the "accountJS.formatPrice" function to be called

    @model List<Products>

        <table id="datatableResult" class="searchgrid">
        <thead>
        <tr>
            <th>Id</th>
        </tr>
        <tr>
            <th>Product Price</th>
        </tr>
        </thead>
        <tbody>
        @if (Model != null)
        {
             foreach (var item in Model)
            {
              <tr>
                 <td>@item.Id</td>
                 <td>>! accountJS.formatPrice(@item.price)</td>
              </tr>
            }
         }
        </tbody>
        </table>

How to list data in datatables out of an object of objects?

0
0

I am trying to list data in my table from this kind of object:

var data = {
    "jaxm":
    {
      "name": "Tiger Nixon",
      "position": "System Architect"
    },
    "jaxb" :
    {
     "name": "Garrett Winters",
     "position": "Accountant"
    }
}

And it's so weird for me that I couldn't find a way to do this.
Is this possible? Or should I sanitize my data and turn it to an array?

How to style dataTable checkboxes

0
0

Hi All,

I've been played with the checkbox styling inside of dataTable but with no much success.

Have anyone changed the style, like size and some other effect for the checkboxes inside of the dataTables?
Centralize vertically and horizontally?

For example: I would like to add this style for my checkboxes, but, I'm not sure of the limitations and possibilities when customizing that

Style sample: https://codepen.io/CreativeJuiz/pen/BiHzp

Thank you very much in advance!

Regards,
Alex


How to fix "Uncaught TypeError: Cannot read property 'length' of undefined"?

0
0

Hi. It's my first time to use server-side processing in Datatables and I encountered a frustating error that I've been trying to solve for almost a month. I am using ASP .NET MVC and JSON.net to create my json and it returns it successfully when I debug it. However, Datatables throw this error and my table never gets populated. Please help me, I'm dying here.

Javascript:

 $('#myModal').on('shown.bs.modal', function (e) {
                var table= $('#myTable').DataTable({
                    processing: true,
                    serverSide: true,
                    ordering: false,
                    orderMulti: false,
                    dom: "<'row'<'col-12't>>" +
                        "<'row'<'col-6'i><'col-6'l>>" +
                        "<'row'<'col-12'p>>",
                    order: [[3, 'asc']],
                    ajax: {
                        url: '@Url.Action("GetJson", "MyController")',
                        dataSrc: "data",
                        type: "POST",
                        dataType: "json"
                    },
                    columns: [
                        { data: "Code" },
                        { data: "Name" },
                        { data: "CommonName" },
                        { data: "Group" },
                        { data: "Gender" },
                        { data: "Catastrophic" },
                        { data: "Organ" },
                        { data: "CodeAndName" }
                    ]
                });
 });

My ActionResult:

[HttpPost]
public JsonResult GetJson() {
      JObject wholeJsonObj =
                        new JObject(
                            new JProperty("data",
                                new JArray(
                                    from l in myList
                                    select new JObject(
                                        new JProperty("Code", l.Code),
                                        new JProperty("CodeAndName", l.CodeAndName),
                                        new JProperty("Name", l.Name),
                                        new JProperty("CommonName", l.CommonName),
                                        new JProperty("Group", l.Group),
                                        new JProperty("Gender", l.Gender),
                                        new JProperty("Catastrophic", l.Catastrophic),
                                        new JProperty("Organ", l.Organ)))));

       string json = JsonConvert.SerializeObject(wholeJsonObj);

       JsonResult result = Json(json, JsonRequestBehavior.AllowGet);
}    

How don't save upload file on disk

0
0

Hello,

I use DataTable editor with c#.NET library.

One on my fields it's "upload" type.
I don't want save the file in disk, I want directly save content in my DB.
What's method for this ?

This code save content on my DB and on my disk :

  var response = new Editor(db, "users")
                    .Model<UploadModel>()
                            .TryCatch(false)
                    .Field(new Field("image")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                            .Db("files", "id", new Dictionary<string, object>
                            {
                                {"web_path", Upload.DbType.WebPath},
                                {"system_path", Upload.DbType.SystemPath},
                                {"filename", Upload.DbType.FileName},
                                {"filesize", Upload.DbType.FileSize},
                                {"content", Upload.DbType.ContentBinary},
                            })
                            .DbClean(data =>
                            {
                                foreach (var row in data)
                                {
                                    // Do something;
                                }
                                return true;
                            })
                            .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                            .Validator(Validation.FileExtensions( new [] {"jpg", "png", "gif"}, "Please upload an image."))
                        )
                    )
                    .Process(request)
                    .Data();

I try Upload(null) by don't work.

Thanks,

Slow row.add

0
0

Hey guys (and girls),

i have a issue with table.row.add because its very slow with ~90k rows. My code:

table.clear(); 
$.each(data, function (index, element) {
  var tablerow = table.row.add([element.ID, element.Nr, element.Datum, element.Zeit, element.Total, element.Punkte]).node();
  /*$(tablerow).attr('data-id', element.ID);*/
});
table.draw();

json string (value of the data variable):

[{"ID":"123456789","Nr":"123456789","Bla":"123","BlaBla":"321","Datum":"1111-11-11","Zeit":"11:11:11.0000000","Blub":"11","Total":"11,11","Punkte":"11"},
{"ID":"123456789","Nr":"123456789","Bla":"123","BlaBla":"321","Datum":"1111-11-11","Zeit":"11:11:11.0000000","Blub":"11","Total":"11,11","Punkte":"11"}]

Code works with a few (some hundred) lines. But when i have 90k rows to add the browser freeze and it takes very long ~10 minutes to come back.

Anyone ideas?

Best wishes,
Daniel

Is it possible to insert into two separate databases?

0
0

Hello,
So I am working with an application in which a user enters a cohort name, along with a group name. Each cohort can hold multiple groups, which is linked in the database by a foreign key in the group table. I wan't to insert both the cohort name and group name in their respective tables. At the moment I only can get the cohort to insert and not the group. Is it possible to do this without making a separate file for it?

Column search (Select inputs) in header not for every column?

0
0

Hi everyone,

I just wanted to ask if ist possible to put the select fields not for every column. In the example from DataTables, there is the table columns.each function but I just Need the select Input for 4 Columns..
Can you guys help me out?
Cheeres, Mert

Viewing all 79323 articles
Browse latest View live




Latest Images