I have a enhancedgrid and used on two pages. When check box (component of data enhanced grid) is checked on page1, the equivalent row(s) on pg 2 are then ticked. My enhancedgrid code is
grid = new dojox.grid.EnhancedGrid({
loadingMessage:"Please wait",
store:newStore,
structure:layoutQL,
autoWidth:false,
autoHeight:true,
columnReordering:false,
rowsPerPage:3,
indirectSelection: true,
//noDataMessage:"No transactions have been processed for posting.",
//selectionMode:'single',
plugins: {
pagination: {
description: true,
sizeSwitch: false,
pageStepper: true,
gotoButton: true,
/*page step to be displayed*/
maxPageStep: 6,
/*position of the pagination bar*/
position: "bottom",
indirectSelection: true
},
filter : {
// Show the closeFilterbarButton at the filter bar
closeFilterbarButton: true,
// Set the maximum rule count to 5
ruleCount: 5,
// Set the name of the items
itemsName: "records"
}
}
I am using EnhancedDataGrid as in dojo framework. Any help will be appreciated.
Try "grid.selection.deselectAll()" when you move from one page to the next.
Related
This is a weird one.
I'm using datatables v1.10.19 with jQuery 3.3.1 and Bootstrap 3.3.7
My datatables grid is configured to display 1000 records (but you can change it to 2500, 5000 and "all").
I've only got about 60 records in my database.
It is using Server-Side processing to retrieve data.
When the grid loads, the pager displays 5 buttons plus an ellipses (as if there is even more).
And even weirder, if I change the drop-down to display "all" records, it acts as I would expect i.e. the pager has 1 page button.
The payloads are pretty much identical:
{
"data": {
"draw": 8,
"recordsTotal": 86,
"recordsFiltered": 66,
"data": [rows of data here]
},
"outcome": {
"opResult": "Success",
"message": ""
}
}
When you click on page 2, it does successfully retrieve a payload with 0 rows.
But there shouldn't be a page 2 available on the pager.
The config object for the datatable looks like this:
eventsSvr.buildConfig = function (url) {
return {
"processing": true,
"serverSide": true,
//"paging": true,
"ajax": {
url: url,
type: ajax.requestPOST,
dataSrc: 'data.data' // the path in the JSON structure to the array which will be the rows.
},
"order": [[1, "asc"]],
"lengthMenu": [[1000, 2500, 5000, -1], [1000, 2500, 5000, "All"]],
"initComplete": function (settings, json) {
eventsSvr.searchTextSpan.text('Search').removeClass('search-is-on');
},
"columns": eventsSvr.grid.columns,
"columnDefs": eventsSvr.grid.columnDefs,
dom: 'ltp'
};
I do have a bunch of custom searches on the page, so I've had to write a lot of code like this:
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
var picker3 = $(eventsSvr.datePickerInputs[0]).data(icapp.kendoKey);
var picker4 = $(eventsSvr.datePickerInputs[1]).data(icapp.kendoKey);
var rowStartDate = moment(data[3], icapp.date.momentParseFormat).toDate();
var rowEndDate = moment(data[4], icapp.date.momentParseFormat).toDate();
... etc.
}
);
But the odd thing is the different behavior as between "All" records vs 1000 records.
As described above, select "All" records works (resulting in just 1 page button), but none of the other paging sizes work (i.e. 1000, 2500, 5000). The data for the 1 page does return, but I get 5 page buttons and an ellipses.
Any ideas why this would be happening?
When using server-side processing mode DataTables expects draw, recordsTotal and recordsFiltered to be root-level elements. Consider changing your repsonse to the following and you can remove dataSrc option.
{
"draw": 8,
"recordsTotal": 86,
"recordsFiltered": 66,
"data": [rows of data here],
"outcome": {
"opResult": "Success",
"message": ""
}
}
Alternatively you can manipulate the response before passing it to DataTables using function supplied as value for dataSrc option, but I would recommend keep things according to expected format for more readable code.
I have tried every option I can think of in configuring both DataTables (capital D) and yadcf but cannot seem to get the select drop down list to list in case-insensitive order.
Setup:
var dTable=$('#bTable').DataTable({
"traditional": false,
"pageLength": 1000,
"jQueryUI": true,
"stateSave": true,
"stateDuration": 60 * 60 * 24,
"processing": true,
"stateLoadParams": function (settings, data) {
lastSearch=data.search.search;
},
"ordering": true,
"processing": true,
"paging": false,
"info": false,
"autoWidth": false,
})
yadcf.init(dTable,[
{column_number : 3, column_data_type: "text", filter_match_mode: "exact", sort_as: "alphaNum", filter_container_id: "hs_clu", filter_reset_button_text: false, style_class: "select-style", filter_default_label: "All"},
],
{ cumulative_filtering: true }
);
When I click on the column header the column data is sorted properly as:
nbmps01
nbmps02
nbmps800
Network-1
Network-2
Network-3
NTPROV
NTSYM
NTWKTRANS
NVAM-CXMT
My dropdown select list is in this order and doesn't seem to be proper:
NTPROV
NTSYM
NTWKTRANS
NVAM-CXMT
Network-1
Network-2
Network-3
nbmps01
nbmps02
nbmps800
I have am at my wits end on this after 2 days of fiddling with it. Does anyone out there have any ideas and are willing to share.
Any help is very much appreciated.
I have improved the alpha numeric sorting in yadcf 0.9.1.beta.5 , now it works as expected.
use sort_as: "alphaNum"
Here is a working jsfiddle link
While setting data into List grid. Some extra space is coming after last record.
isc.CustomListGrid.create({
dataSource: "DeviceDiscoveryDataSource",
ID:"deviceDiscoveryListGrid",
autoDraw: false,
//showAllRecords: true,
paddingAsLayoutMargin:false,
autoFitMaxRecords:2000,
showFilterEditor:true,
filterOnKeypress:true,
filterLocalData: true,
alternateRecordStyles:true,
autoFetchData:true,
showRecordComponents: true,
showRecordComponentsByCell: true,
cellHeight:35,
emptyCellValue:"-",
canSort:false,
canGroupBy:false,
canPickFields:true,
bodyProperties: { canSelectText:true },
fields: [{
name: "deviceName",
type: "text",
title: "Device Name",
align: "center",
width:200
}]
});
Where I am wrong I am not getting. Please Help me.
Try to set virtualScrolling property to false in the ListGrid. When rendering components in each row, SmartClient does not exactly know how much space it will need, hence the blank space after the last record.
More about this: http://www.smartclient.com/docs/10.0/a/b/c/go.html#attr..ListGrid.virtualScrolling
I create a line chart using dojo. Recently, I have been applying multiple axis on the chart. But there was a problem here. It is applied to multiple axes in one place I have raised the issue of overlapping tick value. and do not change the properties of leftBottom, is there a way to adjust the shaft position? For example, x: 10, y: 20?
my code
var axisXRef = {labels : labelsample, titleOrientation : "away", stroke : {}, natural : true};
var axisYRef = {vertical : true, stroke : {}};
var chart = new Chart("chartNode");
chart.addPlot("lines", { type: Lines, tension: 3 ,min:0});
chart.addPlot("stacklines", { type: StackedLines, tension: 3 ,hAxis:"x",vAxis:"y1"});
chart.addPlot("areas", { type: Areas, tension: 3,hAxis:"x",vAxis:"y2" });
chart.custom.axisX = lang.clone(axisXRef);
chart.custom.axisY = lang.clone(axisYRef);
chart.addAxis("x", chart.custom.axisX);
chart.addAxis("y", chart.custom.axisY);
chart.addAxis("y1", {
vertical: true,
min : 50,
max:70,
leftBottom:true,
majorLabels: true, majorTicks: true, majorTick: {color:"red",length:50},
minorLabels: true, minorTicks:true, minorTick:{color:"red",length:50},
microTicks: true, microTick:{color:"red",length:50},
fixUpper: "major",
fixLower:"minor"
});
chart.addAxis("y2", {
vertical: true,
min : 0,
max:49,
leftBottom:true,
majorLabels: true, majorTicks: true, majorTick: {color:"blue",length:25},
minorLabels: true, minorTicks:true, minorTick:{color:"blue",length:25},
microTicks: true, microTick:{color:"blue",length:25},
fixUpper: "major",
fixLower:"minor"
});
Unfortunately Dojo charting only supports two axis per direction both axis being on different side of the chart. In other words you can't have two axis both on the left side of the chart. You have to have one right side using leftBottom: false property.
I have the following in my store. Note the limit is set to 10. I can see on firebug that 10 records are returned. My issue is that my grid pagination doesn't seems to have the correct "page" value.
ie i have 11 records in total ( which should be 2 pages )
proxy:{
type:'ajax',
api:{
read: '/CutterHistory/Read/',
update:'/CutterHistory/Update',
create:'/CutterHistory/Update',
destroy:'/CutterHistory/Remove'
},
reader:{
type:'json',
root:'CutterHistories',
successProperty:'success',
totalProperty:'Total'
},
writer:{
type:'json',
allowSingle:true
},
simpleSortMode: true,
extraParams : {
'sort' : sortBy,
'search' : search,
'limit' : 10,
'destroyed' : destroyed
}
},
and my grid
I'm pretty sure you don't need to include sort and limit as extra params. If you have a paging toolbar, you should simply set the pageSize in your store and the store will take care of all this