I'm trying to use yacdf (0.9.3) for the first time with DataTables (1.10.16). I'm using DataTables built in scrolling for both horizontal and vertical scrolling of my table.
Either way (old or new DataTables API) I try to initialize the filter when scrolling enabled I end up with Uncaught TypeError:
Cannot read property 'oScroll' of null!
var table = $(".jqDataTable").DataTable({
dom: 'frti',
scrollY: "460px",
scrollCollapse: true,
scrollX: true,
paging: false
});
yadcf.init(table, [{column_number : 3}]);
Uncaught TypeError: Cannot read property 'oScroll' of null
at scrollXYHandler (jquery.dataTables.yadcf.js.jsf?ln=js:3696)
at initAndBindTable (jquery.dataTables.yadcf.js.jsf?ln=js:3719)
at Object.init (jquery.dataTables.yadcf.js.jsf?ln=js:3938)
However when scrolling disabled the filter gets initialized.
I feel stuck with the problem.
Related
I have implemented jQuery Datatable Grid in Angular 13. But when I delete record and datatable is refreshed. then below error occurs.
DataTables warning: table id=DataTables_Table_1 - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3
Any Solution for this ??
After struggling for many hours, I found solution for this.
just add destroy:true in this.dtOptions = {} like below
this.dtOptions = {
pagingType: 'full_numbers',
pageLength: 10,
scrollX: true,
processing: true,
deferRender: true,
destroy:true
};
Error will be fixed. Thanks
I have a Rally grid that I'm creating using the Rally app builder. Standard grid using the defect model. One of the fields in the defect model is set to hidden in the field setup in the Rally Workspaces and Projects setup. I'd like to dynamically make the field visible in my grid so that it only appears on my grid and not on the defect page when entering a defect. Any ideas on how to do that? Thanks.
This was a pretty tricky one. The grid and board components are hard wired to not show data from hidden fields by default and unfortunately there are not any config properties exposed to turn this behavior off. Here's what I came up with:
this.add({
xtype: 'rallygrid',
columnCfgs: [
'FormattedID',
'Name',
'Owner',
{
text: 'Hidden Field', //set column header text
renderer: function(value, meta, record) {
//return the rendered field data
return record.get('c_HiddenField');
}
}
],
context: this.getContext(),
storeConfig: {
model: 'userstory',
fetch: ['c_HiddenField'] //need to explicitly fetch
}
});
Basically you include a column in your columnCfgs without a dataIndex specified. Set the text and renderer to work with your field.
You'll also need to manually fetch your field in the storeConfig since the grid won't understand how to do it otherwise.
I have more than 10000 records in my JSON, which I want to show in the Jquery DataTable. Destroying and recreating the table takes more than 10 sec for each function.
Can someone help me optimize the DataTable population, or have any suggestions?
VMSearchDevice.searchGridListIndividual([]); // Observable binded with the datatable
_dtSearchGrid.clear(); //Clears the Table content
_dtSearchGrid.destroy(); //Destroys the table object
VMSearchDevice.searchGridListIndividual(jsonResult); //Populating the observable array
_dtSearchGrid = $('#dtSearchResult').DataTable({ //Intializing the table again
responsive: true,
"sDom": 'Rlfrtip',
"iDisplayLength": 10,
"bScrollCollapse": true,
"bPaginate": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bSortClasses": true,
"sPaginationType": "full_numbers" // To Set Pagination
});
Try using "bDeferRender" feature of DataTables:
Deferred rendering can provide DataTables with a huge speed boost when you are using an Ajax or JS data source for the table. This option, when set to true, will cause DataTables to defer the creation of the table elements for each row until they are needed for a draw - saving a significant amount of time.
"bDeferRender": true
I am loving this yadcf plugin an all its options. But for some reason, I cannot get it to filter my data. I want to type in data and have it filter on the fly. I have looked through all the examples on the yadcf site and followed them to the best of my knowledge. I am using JQuery 2.1.4, DataTables 1.10.10, and yadcf 0.8.9.beta.26.
Here is my relevant javascript:
$(document).ready(function() {
'use strict';
var table = $(".stocks").DataTable({
paging: false,
searching: false,
info: false
});
yadcf.init(table, [
{
column_number : 4,
filter_container_id: 'industrySearch',
filter_default_label: "Type industry",
filter_type: "text",
text_data_delimiter: ","
}]);
Let me know if any other code is needed.
You must remove the searching: false, from your datatables init code.
Setting searching to false disables datatables searching abilities, and since yadcf uses datatables search api under the hood that it wont work.
Read here more about this option
How can i add a floating window to the viewport while its getting created.
When i'm trying to add whith
viewport.on('add',function(){
//my functionality here
});
How can i add???
Any help??
You can't really add components to a viewport while it's being created, unless you override its internal methods. And what you're doing is adding an event listener for the "add" event, which fires when items are added to a container.
I don't see why you're trying to add a window to a viewport, but you would add it just like any other item.
Ext.create("Ext.container.Viewport", {
items: [{
xtype: "window",
width: 400,
height: 400,
title: "My Window"
}]
});
Or just create the window by itself, since it is constrained to the document body anyway.
Remember, you have to call the show method on a window before it will render to the document (unless you set autoShow: true on the window config).