I need some columns to invisible if the rights are not given. I tried to do this, but that did not work.
{ targets: 8, visible: function(data, type, row){
return (data.recordRights == '1')? true : false;
}
},
I have no ideas at this time where is my fault. Have someone a idea?
Andreas
I have a table with a large number of columns that are rendered with checkbox.
The editor dialog becomes so long and does not fix on the screen. So, I have decided to use template and put several of the checkbox on a line.
Now, is there anyway to display the checkbox before the label? for several checkbox on the same line with the label before the box, it is difficult to see which label is for which box.
Also, it here a way to get rid of the Visual Studio's invalid HTML5 warnings from using the custom tag <editor-field name=""/>? I wished it is a simple tag like <span data-editorfield="name"></span>.
I have a table with two columns, "name" and "class". The table is rendered by server-side processing and has multiple pages. I have an Ajax function that allows the user to select multiple rows and change their "class" values to a particular string. When the server responds to the user's action, it sends back the ids of the rows that should be changed on the front end. Currently, I am updating the table with the following code:
$.each(row_ids, function(i) {
id = "#"+row_ids[i];
$(id).find('td:eq(2)').text(value);
});
This works for the page I am on, but the table is not updated for any rows I have selected on subsequent pages, even though their ids are in the server response. As a result, if I go to the next page, the rows that I have selected still have the old class value. Refreshing the page in the browser shows the correct (changed) value, so it's definitely changed on the server. I do call draw() a few lines after the code above, but that does not seem to affect the results. It looks to me like the new page is being drawn from cached values, but I can't seem to figure out a way of clearing the cache that fits my use case.
Does anyone have any suggestions about how to update the table beyond the current page?
Hi Allan,
I'm simply trying to invoke a function (that updates filter dropdowns) after the table is drawn but NOT after it's sorted..
I'm using the drawCallback, but it's also called after sorting a column (which cleans out my filters unfortunately),
I googled for a solution to this, the first thing that pops up is your reply on the forum to a similar issue back in 2010 > https://datatables.net/forums/discussion/2976/sort-callback.
You mention the 'bSorted' Boolean that could be checked, I tried it and it's always false, I'm assuming it's an old
legacy property and maybe no longer in use..
I also tried listening for the 'order' event and using my own flag, but that event also runs every time there's a draw so no good.. please help me figure this one out, thanks! ;]
I have a large table with the first 3 columns fixed. I wish to activate the inline editor only for the last two columns with the following codes
$('#TableID').on('click', 'tbody td:nth-last-child(-n+2)', function (e) {
editor.inline(this, {
onBlur: 'submit',
submit: 'allIfChanged'
});
});
This seems to work, but the last fixed column also becomes editable. I do not wish to edit any of the fixed columns, what is the best way to handle this?
Hi all, I'm a new user on this platform and this is my first discussion.
I would ask if is possible create a render foreach time into a for loop.
For example:
Here I'm out of the datatable.
for(i=0; i<(diffDays); i++){
var data_formattata = moment(new_data_from).add(i, 'days');
var header = data_formattata.format("YYYY-MM-DD");
clmns.push({
"sTitle": data_formattata.format("DD-MM-YYYY"),
"mData": {header:header},
render:function(data,type,row){
var tmp = '<a role="button" onclick="aggiungiDisponibilita('+header+','+data['id']+')" class="btn btn-sm btn-success" title="Aggiungi" data-tooltip="tooltip"><i class="fa fa-plus"></i></a>';
return tmp;
}
});
}
Now I'm into the datatable
$('#datatable').DataTable({
processing:true,
serverSide:true,
ajax: {
url:"{!! url('/ajax-lista-disponibilita-staff/') !!}",
data:function(d){
d.data_from = moment(new_data_from).format("YYYYMMDD"),
d.data_to = moment(new_data_to).format("YYYYMMDD")
}
},
type:'GET',
columns: clmns,
so where is my problem? my problem is that my variable "header" located into the render function is assumed the last value of the loop for instead the value of each cycle.
How can I solve that?
We are using serverside processing to obtain data for table A, and we join data from table B to this.
Normally, one can repeat the where conditions from the main Editor instance on the Join instance, so that the join query only selects data for the rows that are present in the result set. When using server side processing, the where condition are only applied to the top level query, not to the join query. In our case, this results in a memory limit error, because the Join class obtains all data from the server, while it only uses/needs a couple of rows.
There are a couple of solutions I think of:
1. Only query the required rows, using WHERE main_primary_key IN ( .. )
2. Only query the required rows, using prepared statements. Iterate over the data, bind the id, and store the result of the query.
3. In the _ssp_query method, add the where conditions to the editor instance instead of directly to the query. Then, in Join->data(), apply all where conditions on the editor instance to the join query as well.
I don't know which of the first two options would be faster.
Personally, I prefer the first two options, because the third one has to search the database again, which (in our case) can be a costly operation. Also, the first two options could select from the joined table directly, instead of joining from the main table.
This optimization probably isn't very useful when serverside processing is not used, because then all rows are sent anyway (or where conditions could be manually applied to the join instance).
Hi!
I need to use server-side pagination so I end up with the examples page, but I realize that the asp classic example only work with datables old version so I began to look over the internet how make it work...
after several hours I realize that I need to parse JSON object that datable send in tubthe Request; I found this library to parse json https://github.com/rcdmk/aspJSON
but I can´t parse the request object... Is there any example with asp classic in version 1.10+ ? is there any way to function any way?? the only solution I have left is to use backward compatibility its ok?
Thnks in advance!
LDM
Hi all,
I have used DataTables for the pagination purpose in my project. I have language change in the same page. When I select "Spanish", the content of the page should be changed to Spanish. I couldn't use the PHP function in the jquery.dataTables.min.js page to convert the sentence "Showing 1 to 10 of 82 entries". I need to change here in the js file:
sInfo:"Showing START to END of TOTAL entries",
I need to call the PHP function like below:
sInfo:"<?php label('Showing');?> START <?php label('to');?> END of TOTAL <?php label('entries');?>",
Is there any way to do it?
Thanks in advance.
Hi there,
Looking for an explanation as to why the pdf generator might display a partial ending div tag at the end of a row.
Hosted here
Same thing occurs whether stripHtml option is true/false.
Relevant JS:
$( function(){
var logTable = $("#logTable").DataTable({
'dom': 'Brftip',
'paging':false,
'scrollY': '64vh',
'scrollCollapse':true,
'fnRowCallback': function( nRow, aData, iDisplayIndex ) {
nRow.className = "selectable";
return nRow;
},
buttons: [
{
extend: 'pdfHtml5',
download: 'open',
pageSize: 'LETTER',
filename: 'Log for' + formatDate(new Date, "yyyy-MM-dd HH-mm-ss"),
stripHtml: true,
/* customize: function(doc){
doc.content[1].table.widths = Array(doc.content[1].table.body[0].length +10).join('*').split('');
}*/
},
{
text: 'Clear',
action: function(){
var conf = $('<div id="confirmClear title="Confirm Clear?"><span id="dialogMsg"></span</div>');
conf.dialog({
modal: true,
resizable: false,
height: "auto",
width: "400px",
exportOptions: {
format: {
body: function(data, column, row) {
data = data.replace(/<.*?>/g, "");
return $.trim(data);
}
}
},
buttons: {
"Clear Log": function(){
$("#logTable").DataTable().clear().draw();
conf.dialog("close");
}
}
});
}
}
]
});
$("#logTable tbody").on("click", "tr", function(){
$(this).toggleClass('danger');
});
$("#inputField").keypress(function(key){
now = formatDate(new Date, "yyyy-MM-dd HH:mm:ss");
var freezeTime = now;
currentValue = $("#inputField").val();
if (showTime) {
$("#inputTime").val(now);
showTime = false;
}
if (key.keyCode == 13) {
var msg = "<div class='messageContainer'>"+escapeHtml(currentValue)+"</div";
submitLine($("#inputTime").val(), msg, logTable);
return false;
}
});
});
Matthew
Hello, in the following a sample of my code
fields: [
...
{
"label": "DATE:",
"name": "date",
"type": "datetime",
"format": "ddd, D MMM YY",
opts: {
disableDays: [ 0, 6 ],
minDate: new Date('2017-01-18'),
maxDate: new Date('2017-01-23')
}
},
I would like to have "today" as minDate and ("today" +4 working days) as maxDate, taking also into account that Saturday and Sunday have been disabled (this means that if "today" is Thursday, ("today" +4 working days) should be Wednesday.
Any suggestion?
Many thanks in advance
Hi,
is it possible to use extract button when I use DataTables for bootstrap4?
Thanks
The date picker on IE and Firefox does not take into consideration the "scrollTop" value. This causes the datepicker to go to above the field when it does not need to be.
This can be fixed by doing the following:
Change _position function in DateTime:
var scrollTop = $('body').scrollTop();
To:
var scrollTop = $('body').scrollTop();
scrollTop = scrollTop > 0 ? scrollTop : $('html').scrollTop();
Can we please fix this on the next version?
Hello,
I get following error since Update:
[02-Jan-2017 18:53:19 Europe/Berlin] PHP Notice: Undefined index: decimal in app/libs/Editor/php/Editor/Validate.php on line 438
[02-Jan-2017 18:53:19 Europe/Berlin] PHP Notice: Undefined index: decimal in app/libs/Editor/php/Editor/Validate.php on line 473
[02-Jan-2017 18:53:19 Europe/Berlin] PHP Notice: Undefined index: decimal in app/libs/Editor/php/Editor/Validate.php on line 474
Thanks!
Cheers
Hannes
I have a datatable on a page and, after I switch a checkbox on/off, I would like to make all rows not editable EXCEPT for the first row. I will then replicate the values on the first row to all the others (this part works).
What I've been attempting to do is switching the class responsible for making the columns editable on some of the rows, but it doesn't work for some reason.
On my fields declaration I have:
{ data: 'id' },
{ data: 'blocked' },
{ data: 'store' },
{ data: 'quantity',
className: 'edit' },
{ data: 'price' ,
className: 'edit'},
{ data: 'description' ,
className: 'edit'},
{ data: 'reference' }
I am using KeyTable, therefore, I have the following declaration also:
keys: {
columns: '.edit',
editor: editor
}
This makes only the cells with the class .edit as editable. This works fine. This is what I'm attempting to do to make some cells uneditable:
$("#changeAll").on("click", function(e) {
// This bit does its work correctly. It assigns the class to the correct elements.
if($("#changeAll").is(":checked")) {
$('#theTable tbody tr:not(:first-child) td.edit').addClass('notEdit').removeClass('edit');
} else {
$('#theTable tbody tr:not(:first-child) td.notEdit').addClass('edit').removeClass('notEdit');
}
});
So the classes switch correctly, but the datatable seems to break. When trying to alter any given cell, it is no longer editable (even the ones that SHOULD be and do have the correct class assigned to them). Also, keys navivigation seems unaltered. The following exception is thrown to the browser following any edit attempt:
Uncaught TypeError: Cannot read property 'index' of undefined
at l._editor (dataTables.keyTable.min.js:9)
at HTMLTableElement.<anonymous> (dataTables.keyTable.min.js:8)
at HTMLTableElement.dispatch (jquery-1.11.3.js:4670)
at HTMLTableElement.elemData.handle (jquery-1.11.3.js:4338)
at Object.trigger (jquery-1.11.3.js:4579)
at jQuery.fn.init.triggerHandler (jquery-1.11.3.js:5295)
at _Api.<anonymous> (dataTables.keyTable.min.js:10)
at _Api.iterator (jquery.dataTables.js:6926)
at l._emitEvent (dataTables.keyTable.min.js:10)
at l._key (dataTables.keyTable.min.js:13)
I am at my wit's end. Any help would be appreciated, even if it means rewriting the whole thing.
It works fine in version 1.5.5 with https://github.com/yajra/laravel-pdo-via-oci8.
Now I have installed editor 1.6.1 and now Oracle doesn't work, especially INSERT and UPDATE.
When INSERTING I'm getting
Fatal error: Uncaught Error: Call to a member function insertId() on boolean in /var/www/html/php/lib/Editor/Editor.php:1601 Stack trace: #0 /var/www/html/php/lib/Editor/Editor.php(1045): DataTables\Editor->_insert_or_update(NULL, Array) #1 /var/www/html/php/lib/Editor/Editor.php(900): DataTables\Editor->_insert(Array) #2 /var/www/html/php/lib/Editor/Editor.php(661): DataTables\Editor->_process(Array) #3 /var/www/html/php/table.cert_vzo.php(40): DataTables\Editor->process(Array) #4 {main} thrown in /var/www/html/php/lib/Editor/Editor.php on line 1601
When UPDATING all the values are replaced by primary key, for example
ID | COLUMN1 | COLUMN2
1 | 56546 | 414
after the UPDATE all the values are replaced by ID
ID | COLUMN1 | COLUMN2
1 | 1 | 1
SELECT is working fine.
like i click on add row it should add row with textbox and Id to it as i define. which I may be able to read at the time of insertion it in database.
Thank In advance.
Hi,
I'm using the editor with .net. Somehow I can add, edit but cannot remove. Editor removes the row from the table but not from the database. There is no error on both sides. Spend hours trying to figure out. Any help would be nice.
This is the client side.
<script type="text/javascript" src="https://cdn.datatables.net/v/bs-3.3.7/dt-1.10.13/b-1.2.4/r-2.1.0/se-1.2.0/datatables.min.js"></script>
<script src="~/Scripts/editor/dataTables.editor.js" type="text/javascript"></script>
<script src="~/Scripts/editor/editor.bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript">
var editor; // use a global for the submit and return data rendering in the examples
var table;
// Activate an inline edit on click of a table cell
$('#products').on('click',
'tbody td.editable',
function (e) {
editor.inline(this,
{
onBlur: 'submit'
});
});
// Delete a record
$('#products').on('click',
'a.editor_remove',
function (e) {
e.preventDefault();
editor.remove($(this).closest('tr'),
{
title: 'Delete record',
message: function (evt, dt) {
var rows = dt.rows(evt.modifier()).data().pluck('Name');
return 'Are you sure you want to delete the entries for the ' +
'following record(s)? <ul><li>' +
rows.join('</li><li>') +
'</li></ul>';
},
buttons: [{ label: 'No', fn: function () { this.close(); } }, 'Yes']
});
});
$(document).ready(function() {
editor = new $.fn.dataTable.Editor({
ajax: {
create: {
type: 'POST',
url: '@Url.Content("~/api/article/create/")'
},
edit: {
type: 'PUT',
url: '@Url.Content("~/api/article/edit/")'
},
remove: {
type: 'DELETE',
url: '@Url.Content("~/api/article/remove/")'
}
},
table: "#products",
fields: [
{
label: "ID",
name: "Id",
type: "hidden"
},
{
label: "Name",
name: "Name"
},
{
label: "Created",
name: "CreationTimeStamp",
type: "hidden"
}
]
});
editor.disable('CreationTimeStamp');
table = $('#products').DataTable({
dom: "Bfrtip",
paging: true,
lengthChange: false,
select: false,
searching: true,
info: true,
autoWidth: false,
responsive: true,
language: {
"emptyTable": "Currently, there are no products in the database."
},
orderFixed: [2, 'desc'],
ajax: '@Url.Content("~/api/article/get")',
columns: [
{
data: "Id",
searchable: false,
orderable: false
},
{ data: "Name", orderable: false, className: 'editable' },
{
data: "CreationTimeStamp",
visible: false,
searchable: false,
orderable: true
},
{
data: null,
defaultContent:
'<a href="" class="btn icon-btn btn-danger editor_remove"><span class="glyphicon btn-glyphicon glyphicon-trash img-circle text-danger"></span> Delete</a>',
searchable: false,
orderable: false
}
],
buttons: []
});
$('#article-box').on({
keypress: function(e) {
if (e.which == 13) {
addRow(e.target);
event.preventDefault();
}
},
keyup: function(e) {
if (e.keyCode == 27) {
$('#newArticleField').val('');
$('#newArticleField').focus();
event.preventDefault();
}
}
});
$('#newArticleField').on({
blur: function(e) {
addRow(e.target);
}
});
});
function addRow(element) {
var textValue = $.trim($(element).val());
if (textValue !== '') {
editor
.create(false)
.set('Name', textValue).submit();
//success
$('#newArticleField').val('');
$('#newArticleField').focus();
}
}
</script>
And this is the server side
public class ArticleController : ApiController
{
public IHttpActionResult ArticleRest(HttpRequest request)
{
IHttpActionResult response;
using (var context = new ApplicationDbContext())
{
using (var db = new Database("sqlserver", context.Database.Connection))
{
var editor = new Editor(db, "Articles", "Id")
.Model<Article>()
.Field(new Field("Id").Set(false))
.Field(new Field("Name").Validator(Validation.NotEmpty()))
.Field(new Field("CreationTimeStamp")
.Set(Field.SetType.Create)
.SetValue(DateTime.Now))
.Process(request)
.Data();
var settings = new JsonSerializerSettings {DateFormatString = "MM/dd/yyyy HH:mm:ss"};
response = Json(editor, settings);
}
}
return response;
}
[System.Web.Http.HttpGet]
public IHttpActionResult GetArticles()
{
IHttpActionResult response = NotFound();
using (var context = new ApplicationDbContext())
{
var result = new List<Select2Model>();
context.Articles.ToList().ForEach(x =>
{
result.Add(new Select2Model()
{
id = x.Id,
text = x.Name
});
});
response = Json(result);
}
return response;
}
[System.Web.Http.HttpGet]
public IHttpActionResult Get()
{
var request = HttpContext.Current.Request;
return ArticleRest(request);
}
[System.Web.Http.HttpPost]
public IHttpActionResult Create()
{
var request = HttpContext.Current.Request;
return ArticleRest(request);
}
[System.Web.Http.HttpPut]
public IHttpActionResult Edit()
{
var request = HttpContext.Current.Request;
return ArticleRest(request);
}
[System.Web.Http.HttpDelete]
public IHttpActionResult Remove([FromBody] FormDataCollection formData)
{
var request = HttpContext.Current.Request;
return ArticleRest(request);
}
Here is the debugger code as well if needed: iboyoc.
Thank you for your help.
Hi
I have a question about data pipe lining feature.
I have say 9 pages and i set 3 pages to cache so 3 pages are cached now when i go to page 4 again a request i sent to server that is fine as well.
But now if i click page 1 again a server call is sent my question is why this call is sent as this page was cached already ?
I have a confusion about pipe lining feature.
I have say 9 pages and i set 3 pages to cache so 3 pages are cached now when i go to page 4 again a request i sent to server that is fine as well.
But now if i click page 1 again a server call is sent my question is why this call is sent as this page was cached already ?