Hi,
We have a requirement to load some columns of a listgrid dynamically and have the column names also dynamically.
For that, I will have a hidden listgrid which fetches the data that are to be displayed as the column headers of the 2nd listgrid.
So, I have a function, fnCallBack() which will be called on callback of fetchData() method of the 1st listgrid. In that function I create an array which will be formed using the data in the first listgrid. I use this array to form the column names of my 2nd listgrid. I also have some column as static, which should fit in between some of the dynamic columns. These static columns are also formed in the fnCallBack() funtion.
Please see the code below.
listgrid1.fetchData(criteria1, "fnCallBack()");
var arrColumns = new Array();
var dsFields = [];
fnCallBack(){
var totlRows = listgrid1.getTotalRows();
for(var intRow = 0; intRow < totlRows; intRow++)
{
var rec = listgrid1.getRecord(intRow);
var recVal = listgrid1.getCellValue(rec, intRow, 0); arrColumns [intRow] = recVal;
}
dsField = {title:"Description", type:"text", name:"strDesc", canEdit:false, canSort:false, wrap:true, align: "center", cellAlign: "left",primaryKey:true}
dsFields.add(dsField);
for(var iCount = 0; iCount < totlRows; iCount++)
{
dsField = {};
dsField.title = arrColumns[iCount];
dsFields.add(dsField);
}
dsField = {title:"Total", type:"double", name:"dblTotal", canEdit:false, canSort:false, wrap:true, align: "center", cellAlign: "right"}
dsFields.add(dsField);
isc.DataSource.create({
ID:"dataSource1",
serverType:"generic",
dropExtraFields:false,
fields:dsFields
})
isc.ListGrid.create({
ID: "listGrid2",
autoDraw: true,
autoFetchData: false,
height:300,
headerHeight: 70,
border:"0px solid #ffffff",
dataSource: dataSource1,
showAllRecords:true,
canEdit: true,
editEvent: "click",
editByCell: true,
selectionType: "none",
canReorderFields: false,
canResizeFields: false,
useCellEvents:true,
selectOnEdit:false,
modalEditing:true,
autoSaveEdits:false,
showSortArrow: false,
leaveScrollbarGap: false,
saveByCell:false,
confirmDiscardEdits:false,
selectionType: "single
});
listGrid2.fetchData(criteria2);
}
Now, the problem is with rendering the listGrid2.
By, the time I form the array(arrColumns) to display the dynamic fields the other static fields(Description & Total) are getting rendered with data in each column.
Because of this, the columns which are formed dynamically and the data corresponding to those dynamic columns are not getting displayed.
Please let me know how I can render the dynamic columns to appear along with the static columns.
Thanks,
Vini.
We have a requirement to load some columns of a listgrid dynamically and have the column names also dynamically.
For that, I will have a hidden listgrid which fetches the data that are to be displayed as the column headers of the 2nd listgrid.
So, I have a function, fnCallBack() which will be called on callback of fetchData() method of the 1st listgrid. In that function I create an array which will be formed using the data in the first listgrid. I use this array to form the column names of my 2nd listgrid. I also have some column as static, which should fit in between some of the dynamic columns. These static columns are also formed in the fnCallBack() funtion.
Please see the code below.
listgrid1.fetchData(criteria1, "fnCallBack()");
var arrColumns = new Array();
var dsFields = [];
fnCallBack(){
var totlRows = listgrid1.getTotalRows();
for(var intRow = 0; intRow < totlRows; intRow++)
{
var rec = listgrid1.getRecord(intRow);
var recVal = listgrid1.getCellValue(rec, intRow, 0); arrColumns [intRow] = recVal;
}
dsField = {title:"Description", type:"text", name:"strDesc", canEdit:false, canSort:false, wrap:true, align: "center", cellAlign: "left",primaryKey:true}
dsFields.add(dsField);
for(var iCount = 0; iCount < totlRows; iCount++)
{
dsField = {};
dsField.title = arrColumns[iCount];
dsFields.add(dsField);
}
dsField = {title:"Total", type:"double", name:"dblTotal", canEdit:false, canSort:false, wrap:true, align: "center", cellAlign: "right"}
dsFields.add(dsField);
isc.DataSource.create({
ID:"dataSource1",
serverType:"generic",
dropExtraFields:false,
fields:dsFields
})
isc.ListGrid.create({
ID: "listGrid2",
autoDraw: true,
autoFetchData: false,
height:300,
headerHeight: 70,
border:"0px solid #ffffff",
dataSource: dataSource1,
showAllRecords:true,
canEdit: true,
editEvent: "click",
editByCell: true,
selectionType: "none",
canReorderFields: false,
canResizeFields: false,
useCellEvents:true,
selectOnEdit:false,
modalEditing:true,
autoSaveEdits:false,
showSortArrow: false,
leaveScrollbarGap: false,
saveByCell:false,
confirmDiscardEdits:false,
selectionType: "single
});
listGrid2.fetchData(criteria2);
}
Now, the problem is with rendering the listGrid2.
By, the time I form the array(arrColumns) to display the dynamic fields the other static fields(Description & Total) are getting rendered with data in each column.
Because of this, the columns which are formed dynamically and the data corresponding to those dynamic columns are not getting displayed.
Please let me know how I can render the dynamic columns to appear along with the static columns.
Thanks,
Vini.
Comment