Uploaded image for project: 'ZK'
  1. ZK
  2. ZK-4638

Clients.submitForm() posts form twice on FF

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Normal
    • Resolution: Cannot Reproduce
    • Affects Version/s: Freshly, 9.5.0, 9.1.0
    • Fix Version/s: 9.5.1
    • Component/s: ZK Client Engine
    • Security Level: Jimmy
    • Labels:
    • Environment:

      reproduced on FF 79
      (doesn't happen on Chrome 84)

    • gh.sprint.customfield.default.name:
      ZK 9.5.1 S1

      Description

      Steps to Reproduce

      form_submit.zul

      <zk xmlns:w="client" xmlns:n="native">
          <n:form action="target.zul" id="testForm" method="POST">
              <vlayout>
                  <button label='JAVA: Clients.submitForm("testForm")' onClick='Clients.submitForm("testForm")'/>
                  <button label="JS: zAu.cmd0.submit(testForm)" w:onClick="zAu.cmd0.submit(testForm)"/>
                  <button label="JS: testForm.submit() - workaround" w:onClick="testForm.submit()"/>
              </vlayout>
          </n:form>
      </zk>
      

      target.zul

      <zscript><![CDATA[
          System.out.println("received on " + desktop.getId());
      ]]></zscript>
      

      click the first or second button

      Current Result

      FF will post the form twice

      The server side will receive both requests (logged on target.zul):

      received on z_kph
      received on z_lph
      

      potentially related:
      https://stackoverflow.com/questions/49587933/firefox-doesnt-preventing-dispatched-submit-event#49592762
      https://github.com/facebook/react/issues/12639

      Expected Result

      the form should be submitted only once

      Debug Information

      both a 'submit' event is dispatched and the submit() function is called
      FF posts the form for both (potential browser bug/difference)
      https://github.com/zkoss/zk/blob/v9.1.0/zk/src/archive/web/js/zk/dom.js#L76-L77

      maybe related:
      deprecated usage of Event.initEvent

      https://github.com/zkoss/zk/blob/v9.1.0/zk/src/archive/web/js/zk/dom.js#L2662

      Workaround

      As implemented in the 3rd button simply invoke the native form.submit() function directly

      From java: Clients.evalJavaScript("testForm.submit()");

        Attachments

          Activity

            People

            Assignee:
            DevChu DevChu
            Reporter:
            cor3000 cor3000
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved: