ListGrid column misaligned when scrolling to right then sorting

[shresthg_des]

Hi,



We have noticed an issue with the Filter ListGrid column on our web application and have reproduced it on SmartClient Explorer. It seems that the columns are not aligned when there is a horizontal scrollbar. After scrolling all the way to the right of the ListGrid and using any of the Sort options, the columns get offset. The steps to reproduce are below.



SmartClient Version: v9.1p_2014-07-20/Pro Deployment (built 2014-07-20)



Note: We noticed the issue on multiple versions of the three browsers below.

Google Chrome Version 31

Firefox Version 36

Internet Explorer 11



Replicated on SmartClient Explorer website: http://www.smartclient.com/docs/9.1/...adaptiveFilter



How to reproduce:

1. Go to SmartClient Explorer and go to the Adaptive Filter demo under Data Binding > Dragging (also link is above in this post)

2. Right-click on a column header and select "Auto Fit All Columns" so that a horizontal scroll bar will appear (after you will notice a horizontal scroll bar below the ListGrid)

3. Slide the horizontal scroll bar all the way to the right (as far as it can go)

4. Right-click on one of the columns (that are currently visible) and select "Sort Ascending" or "Sort Descending"



You will notice that the columns will be offset by approximate two character length to the right. To align the columns, you can slide the horizontal scroll bar.

Thanks

[shresthg_des]

Just wondering if an viable solution is available for this issue?

[Isomorphic]

We've now made a change which should address this. Please try the next nightly build dated Aug 7 or above

Regards
Isomorphic Software

[henkiemaritz]

issue still there

I am using version 10.0 and this issue is still there. I have a listgrid that scrolls that the data gets misaligned. I have looked through the API and have not found the attribute/property that can fix this. please help

[Isomorphic]

We have fixed all the scroll-synch (header/body misalignment) issues we're aware of.
If you're still encountering a problem like this in the latest 10.0 branch nightly build, we'll need a way to reproduce before we can comment.
Can you show us a standalone test case which we can run, along with steps to reproduce the problem?

Thanks
Isomorphic Software

[henkiemaritz]

scrolling issue

Sorry for taking so long to post, I was not aware Isomorphic had responded. Below is the listgrid that cannot scroll to the left without rearranging the fields. I am using version 10.00. the only way to get the scrolling to work is by adding autoFitData: "horizontal" to the listgrid,


isc.ListGrid.create({
ID: "ManageMembersLgd",
showHeaderContextMenu: false,
dataSource: "company_account_responsible_members_view",
validateByCell: true,
saveOnEnter: true,
selectionType: "multiple",
alternateRecordStyles: true,
showFilterEditor: true,
filterOnKeypress: true,
// autoFitData: "horizontal",
height: "100%",
width: "100%",
fields: [
{
name: gvarObjClientConstants.FLD_ID_COMPANY_PERSON_ID,
title: gvarObjClientConstants.FLD_CAP_COMPANY_PERSON_ID,
visible: false
},
{
name: gvarObjClientConstants.FLD_ID_COMPANY_ACCOUNT_NUMBER,
title: gvarObjClientConstants.FLD_CAP_COMPANY_ACCOUNT_NUMBER,
width: 60,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_SURNAME,
title: gvarObjClientConstants.FLD_CAP_SURNAME_ACCOUNT,
width: 130,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_ATTENDEE_LIST,
title: gvarObjClientConstants.FLD_CAP_ATTENDEE_LIST,
width: 200,
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_LAST_DEBIT_DT,
title: gvarObjClientConstants.FLD_CAP_LAST_DEBIT_DT_LIST,
width: 120,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_STATUS_CD,
title: gvarObjClientConstants.FLD_CAP_STATUS_CD,
width: 80,
showHover: true,
valueField: gvarObjClientConstants.FLD_ID_STATUS_CD,
optionDataSource: "lt_gen_status",
_constructor: "SelectItem"
},
{
name: gvarObjClientConstants.FLD_ID_ACCOUNT_BALANCE,
title: gvarObjClientConstants.FLD_CAP_ACCOUNT_BALANCE,
width: 100,
type: "float",
defaultValue: 0.00,
roundToPrecision: 2,
decimalPad: 2,
formatCellValue: function (value) {
if (value != null) {
return value.toCurrencyString('R ', '.');
}
value = 0.00
return value.toCurrencyString('R ', '.');
},
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_DISCOUNT_PERC,
title: gvarObjClientConstants.FLD_CAP_DISCOUNT_PERC,
width: 60,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_PAYMENT_TERMS_CD,
title: gvarObjClientConstants.FLD_CAP_PAYMENT_TERMS_CD,
width: 130,
align: "left",
showHover: true,
visible: lvarBlnPaymentTerms
},
{
name: gvarObjClientConstants.FLD_ID_COMMUNICATOR_NAME,
title: gvarObjClientConstants.FLD_CAP_COMMUNICATOR_NAME,
width: 165,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_COMMUNICATOR_EMAIL,
title: gvarObjClientConstants.FLD_CAP_COMMUNICATOR_EMAIL,
width: 165,
align: "left",
type: "link",
linkURLPrefix: "mailto:",
showHover: true,
visible: true
},
{
name: gvarObjClientConstants.FLD_ID_COMMUNICATOR_CELL,
title: gvarObjClientConstants.FLD_CAP_COMMUNICATOR_CELL,
width: 120,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_RESPONSIBLE,
title: gvarObjClientConstants.FLD_CAP_RESPONSIBLE,
width: 165,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_EMAIL,
title: gvarObjClientConstants.FLD_CAP_RESPONSIBLE_EMAIL,
width: 165,
type: "link",
linkURLPrefix: "mailto:",
align: "left",
showHover: true,
visible: true
},
{
name: gvarObjClientConstants.FLD_ID_CELL_NUMBER,
title: gvarObjClientConstants.FLD_CAP_RESPONSIBLE_CELL,
width: 120,
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_START_DATE,
title: gvarObjClientConstants.FLD_CAP_START_D,
width: 100,
align: "left",
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_MISC1,
title: gvarObjUserSession.getCvarStrMiscellaneousFieldTitle(),
width: 100,
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_COMMENT,
title: gvarObjUserSession.getCvarStrTextBoxFieldTitle(),
width: 100,
showHover: true
},
{
name: gvarObjClientConstants.FLD_ID_MEDICAL_AID_NAME,
title: gvarObjClientConstants.FLD_CAP_MEDICAL_AID_NAME,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnMedicalAid
},
{
name: gvarObjClientConstants.FLD_ID_MEDICAL_AID_NUMBER,
title: gvarObjClientConstants.FLD_CAP_MEDICAL_AID_NUMBER,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnMedicalAid
},
{
name: gvarObjClientConstants.FLD_ID_MEDICAL_AID_PLAN,
title: gvarObjClientConstants.FLD_CAP_MEDICAL_AID_PLAN,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnMedicalAid
},
{
name: gvarObjClientConstants.FLD_ID_MEDICAL_AID_PRINCIPLE_NAME,
title: gvarObjClientConstants.FLD_CAP_MEDICAL_AID_PRINCIPLE_NAME,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnMedicalAid
},
{
name: gvarObjClientConstants.FLD_ID_DOCTOR_NAME,
title: gvarObjClientConstants.FLD_CAP_DOCTOR_NAME,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnDoctor
},
{
name: gvarObjClientConstants.FLD_ID_DOCTOR_CONTACT_NUMBER,
title: gvarObjClientConstants.FLD_CAP_DOCTOR_CONTACT_NUMBER,
width: 165,
align: "left",
showHover: true,
visible: lvarBlnDoctor
}
],
wrapCells: true,
enforceVClipping: true
});

[Isomorphic]

This isn't runnable code, both because of missing variable values and the lack of data. It also isn't minimal. If you think you've found a framework bug, you should put together a minimal, ready-to-run test case demonstrating the problem.