ICEfaces
  1. ICEfaces
  2. ICE-9455

ace:dateTimeEntry stops working in editable ace:dataTable

    Details

    • Assignee Priority:
      P1
    • Salesforce Case Reference:
    • Workaround Exists:
      Yes
    • Workaround Description:
      Do not use h:panelGrid in this circumstance.

      Description

      Instructions to reproduce:

      1. Click to edit a table row
      2. Select a date from calendar
      3. Click the commandLink titled 'Click Me'
      4. Try selecting another date. The ace:dateTimeEntry will no longer popup

      There are no suspicious errors in the server logs and focus is attempting to be applied to the calendar:
      [window] persisted focus for element "j_idt9:genAnnounceTable:0:fromDateInput_input". The issue is caused by the following h:panelGrid. The table is located inside index.xhtml. Test case attached.

                      <h:panelGrid>
      <h:panelGroup>
      <h:form>
      <ui:include src="./index.xhtml" />
      </h:form>
      </h:panelGroup>
      </h:panelGrid>

        Activity

        Hide
        Deryk Sinotte added a comment -

        Assigning to Mark for re-assignment as necessary.

        Show
        Deryk Sinotte added a comment - Assigning to Mark for re-assignment as necessary.
        Hide
        yip.ng added a comment - - edited

        Error on app. start-up: screenshot-01.png. (Framework error?) Need to fix it first before I can even get to the problem.

        Show
        yip.ng added a comment - - edited Error on app. start-up: screenshot-01.png . (Framework error?) Need to fix it first before I can even get to the problem.
        Hide
        Deryk Sinotte added a comment -

        I downloaded the supplied test case and deployed it straight to Tomcat 7 and it ran fine. Was able to reproduce the problem following the provided steps.

        Show
        Deryk Sinotte added a comment - I downloaded the supplied test case and deployed it straight to Tomcat 7 and it ran fine. Was able to reproduce the problem following the provided steps.
        Hide
        yip.ng added a comment - - edited

        Given up on fixing standalone app. (See comment above.)

        Copied and pasted into showcase. Runs but nothing happens when I click: screenshot-02.png.

        Show
        yip.ng added a comment - - edited Given up on fixing standalone app. (See comment above.) Copied and pasted into showcase. Runs but nothing happens when I click: screenshot-02.png .
        Hide
        yip.ng added a comment - - edited

        Compared with run from war file. The pencil icon in the update column is missing: screenshot-02.png.

        Show
        yip.ng added a comment - - edited Compared with run from war file. The pencil icon in the update column is missing: screenshot-02.png .
        Hide
        Deryk Sinotte added a comment -

        Looking at the original test case, if I simply comment out the panelGrid component from the page-template.xml file, the component appears to work fine:

        
        	<h:body>
        <!-- 
        		<h:panelGrid>
         -->
        			<h:panelGroup>
        				<h:form>
        					<ui:include src="./index.xhtml" />
        				</h:form>
        			</h:panelGroup>
        <!-- 
        		</h:panelGrid>
         -->
        	</h:body>
        
        Show
        Deryk Sinotte added a comment - Looking at the original test case, if I simply comment out the panelGrid component from the page-template.xml file, the component appears to work fine: <h:body> <!-- <h:panelGrid> --> <h:panelGroup> <h:form> <ui:include src= "./index.xhtml" /> </h:form> </h:panelGroup> <!-- </h:panelGrid> --> </h:body>
        Hide
        Tyler Johnson added a comment - - edited

        Yup, that's the workaround but the user's requirement is to have a table layout.

        Show
        Tyler Johnson added a comment - - edited Yup, that's the workaround but the user's requirement is to have a table layout.
        Hide
        Deryk Sinotte added a comment - - edited

        Sorry...guess I forgot to read that. In any event, as Yip noted, when I copy their content into our showcase (for example, replacing the accordion example with their markup) including the panelGrid, it works fine. So there seems to be something else that our app is doing/not doing that is different from the test case. Since they based their test case off of our existing code, perhaps our beans are interacting with the content of the test case in an unpredictable way.

        Also, it doesn't appear that you need to click the link to cause the problem. If I pick a date and click the checkbox and then re-edit the date input, it stops as well. If click the "x" to cancel the edit, then when I go to re-edit, it works fine.

        Show
        Deryk Sinotte added a comment - - edited Sorry...guess I forgot to read that. In any event, as Yip noted, when I copy their content into our showcase (for example, replacing the accordion example with their markup) including the panelGrid, it works fine. So there seems to be something else that our app is doing/not doing that is different from the test case. Since they based their test case off of our existing code, perhaps our beans are interacting with the content of the test case in an unpredictable way. Also, it doesn't appear that you need to click the link to cause the problem. If I pick a date and click the checkbox and then re-edit the date input, it stops as well. If click the "x" to cancel the edit, then when I go to re-edit, it works fine.
        Hide
        yip.ng added a comment - - edited

        Test app. (transplanted to showcase) works only built and run against EE 3.3.0 GA. (I was using 3.3 trunk, future 3.4., which didn't work.)

        Same problem as in ICE-8970: Framework indiscriminately updates whole body, wiping out the DateTimeEntry's popup div attached to the end of body: screenshot-03.png. In that case, we decided that the solution is to add a panelGroup with an id: http://www.icesoft.org/JForum/posts/downloadAttach/4269.page. However, doing the same with this test app. doesn't seem to work.

        The framework doesn't do whole body update if we remove the <h:panelGrid>. So the problem seems to be the interaction of framework DOM diff. and <h:panelGrid> in this particular test case. Nothing to do with DateTimeEntry.

        Show
        yip.ng added a comment - - edited Test app. (transplanted to showcase) works only built and run against EE 3.3.0 GA. (I was using 3.3 trunk, future 3.4., which didn't work.) Same problem as in ICE-8970 : Framework indiscriminately updates whole body, wiping out the DateTimeEntry's popup div attached to the end of body: screenshot-03.png . In that case, we decided that the solution is to add a panelGroup with an id: http://www.icesoft.org/JForum/posts/downloadAttach/4269.page . However, doing the same with this test app. doesn't seem to work. The framework doesn't do whole body update if we remove the <h:panelGrid>. So the problem seems to be the interaction of framework DOM diff. and <h:panelGrid> in this particular test case. Nothing to do with DateTimeEntry.
        Hide
        Deryk Sinotte added a comment -

        Try putting another panelGroup around the panelGrid:

        <h:panelGroup>
            <h:panelGrid>
                <h:panelGroup>
        
        Show
        Deryk Sinotte added a comment - Try putting another panelGroup around the panelGrid: <h:panelGroup> <h:panelGrid> <h:panelGroup>
        Hide
        Mark Collette added a comment -

        Try adding the domDiff context-parameter, set to debugAB, to see what's triggering the whole page update.

        Show
        Mark Collette added a comment - Try adding the domDiff context-parameter, set to debugAB, to see what's triggering the whole page update.
        Hide
        yip.ng added a comment -

        Deryk's solution works! Thanks so much to Deryk.

        Show
        yip.ng added a comment - Deryk's solution works! Thanks so much to Deryk. screenshot-04.png video
        Hide
        Deryk Sinotte added a comment -

        With the supplied test case, adding the extra panelGroup around the panelGrid solved the problem in my environment.

        Show
        Deryk Sinotte added a comment - With the supplied test case, adding the extra panelGroup around the panelGrid solved the problem in my environment.
        Hide
        Mark Collette added a comment -

        Deryk, can you please attach the output of using domDiff=debugAB while reproducing this issue, without the extra panelGroup fix.

        Show
        Mark Collette added a comment - Deryk, can you please attach the output of using domDiff=debugAB while reproducing this issue, without the extra panelGroup fix.
        Hide
        Deryk Sinotte added a comment -

        Attaching log of debugAB

        Show
        Deryk Sinotte added a comment - Attaching log of debugAB
        Hide
        Mark Collette added a comment -

        From the test case's debugAB, we can see that the issue of TEXT nodes being aggregated to cause a DOM difference was a key issue for the full update. So, I updated to the newest icefaces3 trunk and ICEfaces EE 3.3.0 P01 code, and tested for that with them and they came up clean. So no lingering code issues, and an app work-around for the old code shows this is resolved.

        Show
        Mark Collette added a comment - From the test case's debugAB, we can see that the issue of TEXT nodes being aggregated to cause a DOM difference was a key issue for the full update. So, I updated to the newest icefaces3 trunk and ICEfaces EE 3.3.0 P01 code, and tested for that with them and they came up clean. So no lingering code issues, and an app work-around for the old code shows this is resolved.

          People

          • Assignee:
            yip.ng
            Reporter:
            Tyler Johnson
          • Votes:
            0 Vote for this issue
            Watchers:
            3 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: