Tapestry
  1. Tapestry
  2. TAPESTRY-1527

@Dialog component triggers a lot a javascript errors on scroll after show/hide by EventListener

    Details

    • Type: Bug Bug
    • Status: Resolved
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 4.1.2
    • Fix Version/s: 4.1.3
    • Component/s: XHR/dhtml/Ajax
    • Labels:
      None
    • Environment:
      JRE1.5.0.7, Tomcat 5.5, WinXP, Firefox 2, IE 7

      Description

      Issue with the dojo javascript with the @Dialog component and EventListener annotations:

      • the @Dialog component is initialized as hidden
      • A user clicks on a link, which triggers an EventListener, which updates a component that wraps the @Dialog and makes it visible
      • within the Dialog, a "Close" button is displayed. When the user clicks on it, it triggers the EventListener again, the wrapper component is updated and the Dialog is set back to hidden.

      Everything works as expected, but once the Dialog has been opened then closed once, every scroll event on the page triggers js errors.
      on FF2.0 : "node has no properties" on line 96 in dojo.js
      on IE7 : "offsetWidth is null or is not an object" (freely translated from french)

      Tried it on 4.1.1 and latest 4.1.2 snapshot : exact same behavior.

      my HTML template:

      <span jwcid="dialwrapper@Any">
      <div jwcid="dial@Dialog" hidden="ognl:hidden" backgroundColor="blue">
      <div style="background-color: white; border-width: 1px; width: 600px; height: 400px;">DIV content<br />
      <form><input type="button" onclick="someJsThatEventuallyTriggersTheEventListener();" value="Close" /></form>
      </div>
      </div>
      </span>

      my page class:

      @InitialValue("true")
      public abstract void setHidden(boolean value);

      @EventListener(elements = "dialwrapper", events = "someCustomJsEvent", submitForm = "hiddenFormWhichUpdatesSelectedAnnounceId")
      public void selectAnnounce(IRequestCycle cycle, BrowserEvent event)

      { setHidden(getSelectedAnnounceId() == null); cycle.getResponseBuilder().updateComponent("dialwrapper"); }
      1. Dialog.script
        2 kB
        Lionel Touati

        Activity

        Hide
        Lionel Touati added a comment -

        Hi,

        By modifying the Dialog.script to the attachment, the problem disappear. Apparently the hide method is not properly called when coming from a XHR request.

        L.

        Show
        Lionel Touati added a comment - Hi, By modifying the Dialog.script to the attachment, the problem disappear. Apparently the hide method is not properly called when coming from a XHR request. L.
        Hide
        Jesse Kuhnert added a comment -

        Probably not the happiest resolution but there really is no easy fix to the client side widget for this particular component other than re-writing it. (which has been done in the upcoming Dojo 0.9 release)

        There are however a lot of ways to avoid this problem and still have the same functionality. I've updated the component documentation for this component with all of the knowledge I have personally on using it and common techniques I employ to do various things. That should hopefully be more than enough to prevent future people from having to code in the dark. (sorry about that)

        The short version fix for this (that I've outlined more extensively in the new documentation) is that you can't wrap the @Dialog component with another component and update it in AJAX requests by updating the outer div. I know that is a common thing people had to do in Tacos but this should really never be the case in 4.1.2 for anyone anymore. That part of XHR updates has become pretty iron clad and I'd be surprised if someone were able to point out any issues with it.

        Luckily for you - you should have no problems just updating the dialog component directly instead of the wrapping Any component. This will solve the problems outlined in this particular ticket.

        Show
        Jesse Kuhnert added a comment - Probably not the happiest resolution but there really is no easy fix to the client side widget for this particular component other than re-writing it. (which has been done in the upcoming Dojo 0.9 release) There are however a lot of ways to avoid this problem and still have the same functionality. I've updated the component documentation for this component with all of the knowledge I have personally on using it and common techniques I employ to do various things. That should hopefully be more than enough to prevent future people from having to code in the dark. (sorry about that) The short version fix for this (that I've outlined more extensively in the new documentation) is that you can't wrap the @Dialog component with another component and update it in AJAX requests by updating the outer div. I know that is a common thing people had to do in Tacos but this should really never be the case in 4.1.2 for anyone anymore. That part of XHR updates has become pretty iron clad and I'd be surprised if someone were able to point out any issues with it. Luckily for you - you should have no problems just updating the dialog component directly instead of the wrapping Any component. This will solve the problems outlined in this particular ticket.
        Hide
        Jesse Kuhnert added a comment -

        Actually is a bug.

        Show
        Jesse Kuhnert added a comment - Actually is a bug.

          People

          • Assignee:
            Jesse Kuhnert
            Reporter:
            Christian Dutaret
          • Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved:

              Development