I want information from the server when we click on the first page only when the amount is 10 record and just show button page 1
Of course information is loaded 1000 record and i want to 10 the next record again just show button page 2 ، And so the
↧
get data control by click pagination ..
↧
b.sFileName.replace is not a function
b.sFileName.replace is not a function.
I running in machine is working but when I deploy I get this error. b.sFileName.replace is not a function
↧
↧
Unable to add additional columns due to ajax error
Hello!
At the moment I'm attempting to add another column to my page. However, I will get an ajax error whenever I do. It's fine with 10 columns, but as soon as I add the 11th, the ajax error will appear.
Here's my debugger
http://debug.datatables.net/ewolon
And the console error shows:
responded with a status of 403 (Forbidden)
↧
Passing multiple rows to UIB modal instance and update the value in multiple rows.
Hi ,I am wondering how to pass multiple rows using checkbox into uib modal instance update the value in selected rows.Can anyone help me on this. For your reference I attached two image files. In first image if I select two rows and then open popup which is update GYOR value and in this popup if I change value and submit it using modal Instance then the two rows value should be updated with latest GYOR value.
↧
I have radio button on each row in datatable, on click of radio , table should display checked row .
following is the code i have added:
$("#differentdetailsTable").on('click', "tbody tr input[name='currentRow']", function() {
$(this).closest('tr').siblings().removeClass('current-row');
$(this).closest('tr').addClass('current-row');
$("#differentdetailsTable").DataTable().row('.current-row').invalidate().draw();
newTable.columns(0).search("input[name='currentRow']:checked").draw();
$('#differentdetailsTable thead th').find(' .glyphicon-chevron-right').addClass('glyphicon-chevron-down').removeClass('glyphicon-chevron-right'); // to change the glyphyicon in the heading of the column of radio button
});
$('#differentdetailsTable').on('click',' thead tr .glyphicon-chevron-down', function(){
var parent=$('#differentdetailsTable').find('tr td:eq(0)').find("input[name='currentRow']:checked").closest('tr');
$('#differentdetailsTable').find('tr td:eq(0)').find("input[name='currentRow']:checked").prop('checked',false);
newTable.row(parent).invalidate().draw();
newTable.columns().search('').draw();
$('#differentdetailsTable thead th').find(' .glyphicon-chevron-down').addClass('glyphicon-chevron-right').removeClass('glyphicon-chevron-down');
});
The problem I am facing is : The first function it doesn't redraw the table neither does it search.
the second fucntion is written to clear the search
↧
↧
Setup Scroller
Im using current 1.10.13 of datatables.js and current 1.4.2 of scroller.js and trying to do Server side processing of data.
Unfortunatelly data.length is always ajax requested as value of "-1" which doesn't make much sense to me :-(
This is my Js:
$(document).ready(function() {
$('#dataTable').DataTable( {
serverSide: true,
ordering: false,
searching: false,
ajax: {
url: 'getResults.json',
type: 'post',
data: {
reportName: reportName
},
error: function(){
console.log('error');
}
},
scrollY: 600,
scroller: {
loadingIndicator: true
}
} );
} );
Thanks for any help oder hints!
hamipl from tohatec
↧
Stop Ajax call when you are updating the row
I've read something like that: "Ajax request made for every redraw" from this link - https://datatables.net/manual/data/#Data-source-types
I am using datatables with "server-side". I want use ajax request only for: paging, sorting or when I will change how many rows I want to show.
My silly question is: is it possible to "abort" or stop call ajax when I update the current row via this method: "fnUpdate(...)" ??
I should use this example: " https://datatables.net/examples/server_side/pipeline.html " or maybe existing other way to find the solution.
Any sugesstions ??
↧
How to Form a datatable with server processing?
Hi, How to form a datatable with server side processing?
This is my Datatable code :
$(document).ready(function() {
var table = $('#myTable').DataTable({
"serverSide": true,
"processing": true,
"paging": true,
"searching": {
"regex": true
},
"lengthMenu": [
[10, 25, 50, 100, -1],
[10, 25, 50, 100, "All"]
],
"pageLength": 10,
ajax: {
url: "/external/getdealers",
dataSrc: "data"
},
columns: [{
data: '_id',
}, {
data: 'DealerType'
}, {
data: 'Address'
}, {
data: 'CompanyName',
"defaultContent": "Not Yet Set",
}, {
data: 'Country'
}, {
data: 'DealerName',
"defaultContent": "Not Yet Set",
}, {
data: 'District'
}, {
data: 'Division',
}]
});
});
I am getting the details from server as :
data - [{_id: "58a2b51a1a9dfe3537a8c141", DealerType: "Seeds Producers & Mfg. Suppliers",…},…]
pagination - {total: 136358, limit: 100, page: "5", pages: 1364}
In data variable i am getting the data, and in pagination i am getting the total number of rows , limit per page , current page number, total pages.
Now i am able to show the data in userinterface, but for pagination i am getting like this > Showing 0 to 0 of 0 entries (filtered from NaN total entries)
and if i click on next page button through ajax call i am getting data like this >GET /external/getdealers?draw=3&columns%5B0%5D%5Bdata%5D=id&columns%5B0%5D%5Bname%5D=&columns%5B0%5D%5Bsearchable%5D=true&columns%5B0%5D%5Borderable%5D=true&columns%5B0%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B0%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B1%5D%5Bdata%5D=DealerType&columns%5B1%5D%5Bname%5D=&columns%5B1%5D%5Bsearchable%5D=true&columns%5B1%5D%5Borderable%5D=true&columns%5B1%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B1%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B2%5D%5Bdata%5D=Address&columns%5B2%5D%5Bname%5D=&columns%5B2%5D%5Bsearchable%5D=true&columns%5B2%5D%5Borderable%5D=true&columns%5B2%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B2%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B3%5D%5Bdata%5D=CompanyName&columns%5B3%5D%5Bname%5D=&columns%5B3%5D%5Bsearchable%5D=true&columns%5B3%5D%5Borderable%5D=true&columns%5B3%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B3%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B4%5D%5Bdata%5D=Country&columns%5B4%5D%5Bname%5D=&columns%5B4%5D%5Bsearchable%5D=true&columns%5B4%5D%5Borderable%5D=true&columns%5B4%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B4%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B5%5D%5Bdata%5D=DealerName&columns%5B5%5D%5Bname%5D=&columns%5B5%5D%5Bsearchable%5D=true&columns%5B5%5D%5Borderable%5D=true&columns%5B5%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B5%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B6%5D%5Bdata%5D=District&columns%5B6%5D%5Bname%5D=&columns%5B6%5D%5Bsearchable%5D=true&columns%5B6%5D%5Borderable%5D=true&columns%5B6%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B6%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B7%5D%5Bdata%5D=Division&columns%5B7%5D%5Bname%5D=&columns%5B7%5D%5Bsearchable%5D=true&columns%5B7%5D%5Borderable%5D=true&columns%5B7%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B7%5D%5Bsearch%5D%5Bregex%5D=false&order%5B0%5D%5Bcolumn%5D=0&order%5B0%5D%5Bdir%5D=asc&start=20&length=10&search%5Bvalue%5D=&search%5Bregex%5D=false&=1487151725059
Please help me, Thanks in advance !!
↧
How to handle `initComplete`?
What is the proper way to attach an event handler to Editor's initComplete?
This is what I tried:
var editor = new $.fn.dataTable.Editor(editorOptions);
editor.on('initComplete', function(e) { alert('init complete') });
My callback is never executed. I suspect that the event is triggered before I get a chance to attach a handler.
↧
↧
Date field localization issue
I have a CRUD management application, which I've obtained using the DTE generator. One of the fields is of date type, which I want to give a specific format, with these elements:
- Moment.js (included in the whole DTE package by generator)
- Plugin datetime.js (written by Allan Jardine)
- Plugin datetime-moment.js (written by Allan Jardine)
In file 'table.mapi.js' (DTE generator), I add these lines
moment.locale('es'); // Chage locale to spanish
$.fn.dataTable.moment( 'ddd, D MMM YYYY', 'en' ); // Call function to give format to datetime field -- note that if I put 'es' on locale parameter, order doesn't work (some plugin compatibility issue?)
after $(document).ready(function() {
then, I define ('fields' param of var editor) the following:
"label": "Fecha:",
"name": "fecha",
"type": "datetime",
"def": function () { return new Date();},
"format": "ddd, D MMM YYYY",
"opts": { "showWeekNumber": false, "momentLocale": 'es' }
and
"data": "fecha",
"render": function ( data, type, full, meta ) { if (type === 'display') { if (data) { var mDate = moment(data); data = (mDate && mDate.isValid()) ? mDate.format("LL") : ""; } } return data; }
('columns' param of datatables), to get date displayed on large format.
Till now, all this works fine. The problem arrives on "New" record button's hand, when I fill in the fields (selecting desired date on datepicker) and then I press "Save" button, validator shows the following error:
"Date is not in the expected format", and, obviously, doesn't perform the op (save data to mysql db).
In addition, when I select one row, in order to edit its data, the modal edit form shows the fields; but date field is still on default locale ('en').
I suposse this is due to issues with format specified in date validator, since I've left the defaults created by DTE generator (except empty field validation, that's been customized), so:
Field::inst( 'fecha' )
->validator( function ( $val, $data, $opts ) { return empty( $val ) ? 'Este es un campo requerido' : true; } )
->validator( 'Validate::dateFormat', array( 'format'=>'D, j M Y' ) )
->getFormatter( 'Format::date_sql_to_format', 'D, j M Y' )
->setFormatter( 'Format::date_format_to_sql', 'D, j M Y' ),
What's the correct validation in this case? Do I need configure some kind of i18n on PHP settings in validation module, such as Moment 'locale'?
Thanks in advance
↧
Cannot set property '_DT_CellIndex' of undefined - but can't find the problem
Hello, I've been trying to install DataTables on a table, but I can't get the sorting and searching, etc. working.
This is the table that I've been working on:
http://live.datatables.net/qeloyuke/1/edit?html,js,output
Through research the problem that most people have with this error is that the number of th's doesn't match the number of td's, but I have looked at my table and it seems to be correct.
Could anyone let me know if they find the problem with it?
Thank you
↧
Print all table on single print button?
I have a div which is contain multiple datatable and i place print button outside table.
i want to print all table data on click on print but i am getting result only last table data
so please help.
Thanks in advance
↧
Conditional Formatting on some of the cells in my table
Hello All,
I am very new to DataTables and Editor, and I am trying to find any details I can on how to perform a specific task.
I am wanting to change the background colour of certain cells within my table, based on the data that is in that cell. This is both before or after an edit, and on multiple pages of data.
I am using the .NET libraries within MVC,
I want to do something like the below (code is for example and is not intended to be correct!)
$('#tablename').on("change", function () {
if ($('#tablename').cellvalue.startsWith("P")) {
$('#tablename').addClass('pass');
}
});
Can anyone tell me the correct way to achieve this please? I only want this condition to be checked on certain cells, not all cells within the table.
Many thanks.
↧
↧
Editor: re-draw only one row after server response (SSP)
I have a server-side processing datatable with an editor.
What I'd like to do is edit a row, send the data to the server, and update only that row with the data received from the server.
In other words, I need to get rid of the second AJAX call refreshing the whole table. In my case, it's not a big deal if the table won't be re-sorted.
We already figured out that in order to avoid the second call I can use the drawType: "none" option, but now the question is how I can update the edited row with the just received data.
Initially, I tried to update the row with the row.data() API call in the postSubmit event handler but it turned out that if a row is updated this way, next time I try to edit it, it throws an error because the editor can't get its data.
editor.on('postSubmit', function(e, json, data, action) {
$.each(json.data, function(rowId, rowData) {
var row = datatable.row('#' + rowId);
row.data(rowData);
});
});
↧
Need to get next 50 record from DB when i click on pagination page 2 using JAVA
I have 20976 record in db when I load them it will stuck my page please help me to get out of this issue
↧
Inline editor and submitting all cell data at once, instead of submitting individual cell changes
When using inline editor to edit the cells of a DataTable, the default behavior is to submit the changes to the server when the cell is blurred. This results in a separate AJAX call for each cell edit. What I would like is to use a button to submit ALL changes at once after the user is done editing the table, instead of individual cell submissions. Anyone know how to do this?
↧
Side by Side fileds in a template
Is the a way to position fields side by side in a bubble editor template without resorting to pure HTML, that is using the tags provided by Editor package?
Regards,
Jim
↧
↧
Puirchased Medio support
On 17 Jan 2017 I purchased the Medio support, what did that buy me?
Regards,
Jim
↧
columnDefs "name" not changing header text
Hi,
I'm trying to change some column's names according to the reference, but obviously I'm missing something, because it's not working:
jsfiddle example
Thanks for any help.
Edit: Obviously I'm an idiot. I thought that option changes column header text (use keyword "title"!!), but it's just for further api reference. Sorry. You can delete this.
↧
Moment.js issue
Hi Allan,
similar to the issue I had with format 'L' there is another problem when I trie to use format 'LT'.
LT should be this for German dates: LT: 'HH:mm' and this for English UK dates: LT : 'HH:mm'. Thank god it happens to be the same in this case! For that reason I hard coded it now like this:
{
label: "Bid Period End Time:",
name: "bidEndTime",
attr: {
class: timeMask
},
type: "datetime",
def: function () { return endOfDay },
format: 'HH:mm',
}
I would prefer to use format: 'LT' because I will be in trouble once I'll add an additional language if I do it like above.
If I use format 'LT' a date picker opens instead of the time picker. Probably becaus of the initial 'L'?! Do you have a fix for this please.
↧