ICEfaces
  1. ICEfaces
  2. ICE-7569

Nested f:ajax tag in h:inputText causing issue with MenuItem ajax submit

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 3.0.RC1
    • Fix Version/s: 3.0.RC2, 3.0
    • Component/s: ACE-Components
    • Labels:
      None
    • Environment:
      ICEfaces 3.0 RC1, All browsers
    • Assignee Priority:
      P1
    • Workaround Exists:
      Yes
    • Workaround Description:
      Remove the f:ajax tag.

      Description

      In the WIlliams app they have a dataTable where one column contains an inputText field. Editing this field and then submitting the row vie a Menu Item is causing a JavaScript error to be thrown and the app becomes unresponsive. This h:inputText component is using a nested f:ajax tag. Removing this tag resolves the issue.

      This issue is reproducible on the Williams POC. To reproduce, load a tab with the Screen 1 content and click the retrieve button to load the table. The Name column contains an inputText field that has a nested f:ajax tag. Editing one of the input fields and then clicking on the Print menu item (top right hand side of page) will cause the JavaScript error to be thrown.

        Activity

        Hide
        Ken Fyten added a comment -

        Further testing shows that if the nested f:ajax tag does not actually render, things continue to work (<f:ajax execute="@this" render="@none "/> ).

        Show
        Ken Fyten added a comment - Further testing shows that if the nested f:ajax tag does not actually render, things continue to work (<f:ajax execute="@this" render="@none "/> ).
        Hide
        Ted Goddard added a comment -

        The onclick handler of the "print" button is as follows:

        onclick="this.id = 'sub_Screen1:screen1Form:printTab'; (function() { ice.ace.ab(

        {"source":"sub_Screen1:screen1Form:printTab","execute":((arguments[1]) ? arguments[1] + ' ' + '@all' : '@all'),"render":((arguments[2]) ? arguments[2] + ' ' + '@all' : '@all'),"event":"activate","params":arguments[0]}

        );; })(

        {'ice.customUpdate':'sub_Screen1:screen1Form:printTab'}

        );"

        The element ID should not be modified after the element is created, and especially not during event processing.

        Show
        Ted Goddard added a comment - The onclick handler of the "print" button is as follows: onclick="this.id = 'sub_Screen1:screen1Form:printTab'; (function() { ice.ace.ab( {"source":"sub_Screen1:screen1Form:printTab","execute":((arguments[1]) ? arguments[1] + ' ' + '@all' : '@all'),"render":((arguments[2]) ? arguments[2] + ' ' + '@all' : '@all'),"event":"activate","params":arguments[0]} );; })( {'ice.customUpdate':'sub_Screen1:screen1Form:printTab'} );" The element ID should not be modified after the element is created, and especially not during event processing.
        Hide
        Ted Goddard added a comment -

        The menu component must be modified to not use the illegal JavaScript technique. The modification of the id during event handling results in null "source" values during event processing.

        It might be possible to add error checking code to abort processing when the event source is null, but this would have unpredictable side effects.

        Show
        Ted Goddard added a comment - The menu component must be modified to not use the illegal JavaScript technique. The modification of the id during event handling results in null "source" values during event processing. It might be possible to add error checking code to abort processing when the event source is null, but this would have unpredictable side effects.
        Hide
        Ted Goddard added a comment -

        It may be possible to use a hidden field specific to this component and not use the element with the changing ID at all (for instance, make the "source" be the root of the menu). This is similar to how h:commandLink is implemented.

        Show
        Ted Goddard added a comment - It may be possible to use a hidden field specific to this component and not use the element with the changing ID at all (for instance, make the "source" be the root of the menu). This is similar to how h:commandLink is implemented.
        Hide
        Arturo Zambrano added a comment -

        This issue was fixed by avoiding setting the id to the element and then calling ice.ace.AjaxRequest. Instead, a node reference is provided to ice.ace.AjaxRequest and the id of the element will be set there, inside the function. The passed node reference will be used in the underlying submit functions. One more measure was taken to avoid conflicts with other ajax requests on the page. It consists of triggering the menu action with a delay via the setTimeout() function.

        Show
        Arturo Zambrano added a comment - This issue was fixed by avoiding setting the id to the element and then calling ice.ace.AjaxRequest. Instead, a node reference is provided to ice.ace.AjaxRequest and the id of the element will be set there, inside the function. The passed node reference will be used in the underlying submit functions. One more measure was taken to avoid conflicts with other ajax requests on the page. It consists of triggering the menu action with a delay via the setTimeout() function.

          People

          • Assignee:
            Arturo Zambrano
            Reporter:
            Arran Mccullough
          • Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: