Hi,
We find an issue that ListGrid.showFields() causes misalignment between listgrid header and data. The parameter we passed in is an array of field names. If we show each field one by one by calling ListGrid.showField(), this issue doesn't happen.
This issue can be reproduced on all browsers with SmartClient_v83p_2015-03-27_PowerEdition.
Please try the following standalone to reproduce:
Steps:
1. Click "Hide" button and then "Show" button, columns starting from "PK17" have misalignment with the data. (It looks like header pk17 is insert after PK9 but the data is shown according to the correct order)
2. Reload the page. Click "Hide" button and then click "Show one by one", the misalignment issue cannot be reproduced.
We find an issue that ListGrid.showFields() causes misalignment between listgrid header and data. The parameter we passed in is an array of field names. If we show each field one by one by calling ListGrid.showField(), this issue doesn't happen.
This issue can be reproduced on all browsers with SmartClient_v83p_2015-03-27_PowerEdition.
Please try the following standalone to reproduce:
Steps:
1. Click "Hide" button and then "Show" button, columns starting from "PK17" have misalignment with the data. (It looks like header pk17 is insert after PK9 but the data is shown according to the correct order)
2. Reload the page. Click "Hide" button and then click "Show one by one", the misalignment issue cannot be reproduced.
Code:
var num = 25,
ds = new Array(),
name = "name";
var showIndex = 17;
var hideArray = new Array();
var showArray = new Array();
var rawData = new Array();
var fieldData = new Array();
for (var i=0; i<num;i++) {
showArray.push('pk'+i);
if (i != showIndex) {
hideArray.push('pk'+i);
}
var dsObj = {};
dsObj[name] = 'pk'+i;
dsObj['type'] = 'text';
dsObj['title'] = 'PK'+i;
ds[i] = dsObj;
var dataObj ={};
for (var j=0; j<num; j++) {
var key = 'pk'+ j;
dataObj[key] = 'Raw Data '+j;
}
rawData[i] = dataObj;
var fieldObj = {};
fieldObj['name'] = 'pk'+i;
fieldObj['width'] = 100;
fieldData[i] = fieldObj;
}
isc.DataSource.create({
ID:"orderItemLocal2",
clientOnly:true,
testData:rawData,
fields:ds
});
isc.ListGrid.create({
ID: "companyList",
top: 50,
left:100,
width:"90%", height: 500,
autoFetchData:true,
dataSource:orderItemLocal2,
fields:fieldData,
fixedRecordHeights:false,
headerHeight:45
});
isc.Button.create({
top: 560, left: 100,
title: "Hide",
click: function() {companyList.hideFields(hideArray);}
});
isc.Button.create({
top: 560, left: 220,
title: "Show",
click: function() {companyList.showFields(showArray);}
});
isc.Button.create({
top: 560, left: 340, width: 150,
title: "Show one by one",
click: function() {
for (var i=0; i<num;i++) {
companyList.showField('pk'+i);
}
}
});