SmartClient Version: v12.0p_2019-05-14/LGPL Development Only (built 2019-05-14)
Google Chrome 74.0.3729.157 (Official Build) (64-bit)
This only happens when cellPadding is > 0, or if there is css padding-left affecting the cell.
When clicking on the expand/collapse icon or checkbox, when selectionAppearance = checkbox, the mouse event does not line up with the element exactly. For example, if the checkboxFieldImageWidth = 13, and the cell style has padding-left:13px, then clicking anywhere on the checkbox icon will have no effect. Instead, clicking up to 13 pixels to the left of the checkbox image will toggle selection.
Even the default Enterprise skin specifies 2px of cellPadding. If you place your mouse near the right edge of the checkbox it won't register the clicks in this showcase.
I tracked the cause down to isOverExtraIcon() in ISC_Grids.js around line 73668. getOpenAreaWidth does not include cellPadding nor css padding.
Here's a complete example if that helps:
Google Chrome 74.0.3729.157 (Official Build) (64-bit)
This only happens when cellPadding is > 0, or if there is css padding-left affecting the cell.
When clicking on the expand/collapse icon or checkbox, when selectionAppearance = checkbox, the mouse event does not line up with the element exactly. For example, if the checkboxFieldImageWidth = 13, and the cell style has padding-left:13px, then clicking anywhere on the checkbox icon will have no effect. Instead, clicking up to 13 pixels to the left of the checkbox image will toggle selection.
Even the default Enterprise skin specifies 2px of cellPadding. If you place your mouse near the right edge of the checkbox it won't register the clicks in this showcase.
I tracked the cause down to isOverExtraIcon() in ISC_Grids.js around line 73668. getOpenAreaWidth does not include cellPadding nor css padding.
Here's a complete example if that helps:
Code:
public class TreeGridTestWindow extends Window { TreeGridTestWindow() { setAutoSize(true); final VLayout layout = new VLayout() {{ setWidth(500); setHeight(500); setMargin(30); setBackgroundColor("#99CCFF"); final TreeGrid testGrid = new TreeGrid() {{ setWidth100(); setHeight(300); setSelectionAppearance(SelectionAppearance.CHECKBOX); setCellPadding(13); final TreeGridField parentId = new TreeGridField("parentId"); final TreeGridField id = new TreeGridField("id"); final TreeGridField value = new TreeGridField("value"); setFields(parentId, id, value); setData(createTestData()); }}; setMembers(testGrid); }}; addItem(layout); } private static Tree createTestData() { final Tree rv = new Tree(); rv.setIdField("id"); rv.setParentIdField("parentId"); rv.setNameProperty("value"); rv.setModelType(TreeModelType.PARENT); rv.setData(new TreeNode[] { createRecord(null, "1", "Root"), createRecord("1", "2", "First child"), createRecord("1", "3", "Second child"), createRecord("2", "4", "grandchild"), createRecord("2", "5", "grandchild"), createRecord("4", "6", "grandchild") }); return rv; } private static TreeNode createRecord(String pid, String id, String value) { final TreeNode rv = new TreeNode(); rv.setAttribute("parentId", pid); rv.setAttribute("id", id); rv.setAttribute("value", value); return rv; } }
Comment