Announcement

Collapse
No announcement yet.
X
Collapse
  • Page of 1
  • Filter
  • Time
Clear All
new posts
Previous template Next
    #1

    TreeGrid inline editor unexpectedly hides itself when clicked

    Hello.

    I am using SmartGWT Power Edition 3.1p build 2014-01-01.

    I am experimenting with a very simple TreeGrid based on the #tree_editing show case example.

    With the editor started (inputs controls visible), whenever I click on a editor control (to select it) it hides itself as if I have clicked outside.

    <code>

    private void testTree(Layout layout) {
    final TreeNode[] employeeData = new TreeNode[] {
    new EmployeeTreeNode("4", "1", "Charles Madigen", "Chief Operating Officer", true),
    new EmployeeTreeNode("189", "4", "Gene Porter", "Mgr Tech Plng IntIS T", false),
    new EmployeeTreeNode("265", "189", "Olivier Doucet", "Asset Spec Lines Stns", false),
    new EmployeeTreeNode("264", "189", "Cheryl Pearson", "Dsl Sys Rep", false),
    new EmployeeTreeNode("188", "4", "Rogine Leger", "Mgr Syst P P", true) };

    Tree employeeTree = new Tree();
    // employeeTree.setModelType(TreeModelType.PARENT);
    // employeeTree.setRootValue(1);
    // employeeTree.setNameProperty("Name");
    // employeeTree.setIdField("EmployeeId");
    // employeeTree.setParentIdField("ReportsTo");
    // employeeTree.setOpenProperty("isOpen");
    employeeTree.setData(employeeData);

    final TreeGrid test = new TreeGrid();
    final TreeGridField type = new TreeGridField("ReportsTo");
    // type.setCanEdit(true);
    // type.setValueMap("V1", "V2", "V3");
    test.setFields(new TreeGridField("Name"), type);
    test.setData(employeeTree);
    test.setCanEdit(true);
    test.addClickHandler(new com.smartgwt.client.widgets.events.ClickHandler() {

    @Override
    public void onClick(ClickEvent event) {
    event.cancel();
    }
    });
    test.setHeight(300);
    layout.addMember(test);
    }
    </code>

    I have tracked the mousedown JS event down to a clickMask that ends up calling back isc_ListGrid__handleClickOutsideEditor.

    Here are some captured logs:

    mouseDown on masked [ScreenSpan ID:isc_EH_screenSpan] firing clickAction, will hide mask
    hideClickMask called with ID: isc_DynamicForm_0
    hiding clickMask ID: isc_DynamicForm_0[autoHide:true], all masks hidden
    focusing in [TreeGridBody ID:isc_TreeGrid_0_body] on clickMask hide with current focusCanvas: [DynamicForm ID:isc_DynamicForm_0]
    Tags: None
    #2
    Why are you canceling the click event? It appears that you are ending up canceling some of the code that correctly sets up the clickmask so that editors are considered unmasked (so that clicks on then do not end editing, as you're seeing).

    Comment

      #3
      The problem persists without this handler. (I must have copied it from some example code).

      Comment

        #4
        ? But at that point your sample code is exactly like all the Tree editing samples, where this problem does not occur.

        We would suggest looking for an explanation such as third-party code added to the page, browser development tools interfering with the operation of your browser, or a problem on one specific machine (try another).

        Comment

          #5
          This is the HTML structure of my host page:

          <body>
          <div id="pageContainer">
          <div id="msgContainer"></div>
          <div id="mainContainer"></div>
          </div>
          </body>

          I was binding the SmartGWT layout to the page with:

          RootPanel.get("mainContainer").add(layout);

          Based on the samples I replaced it with:

          layout.draw();

          The problem is now gone.

          Is the use of RootPanel expected to cause problems as such?

          Comment

            #6
            It's not clear how it caused this problem (or if its really even the cause on its own), but generally, using RootPanel.add() encourages GWT to become involved in a DOM it does not understand, and could lead to problems of this kind.

            That's why the QuickStart Guide tells you not to use RootPanel.add(), and to use draw() instead.

            Comment

              #7
              Thank you!

              Comment

                #8
                For information:

                After some more testing, it turns out the problem is triggered by a position:relative rule in #mainContainer div. This somewhat messes up the clickmask code.

                Comment

                Previous template Next
                Working...
                X