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

the if element doesn't keep the position of its child component

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Major
    • Resolution: Fixed
    • Affects Version/s: 9.6.2
    • Fix Version/s: 10.0.0, 9.6.3
    • Component/s: None
    • Security Level: Jimmy
    • Labels:
      None

      Description

      Steps to Reproduce

      <zk>
          <zscript><![CDATA[
              Map dummyVm = new HashMap();
              dummyVm.put("flag", true);
          ]]></zscript>
          <div viewModel="@id('vm') @init(dummyVm)">
              <apply template="test">
                  <template name="content">
                      <apply template="some-control"/>
      <!--                workaround, make the apply dynamic-->
      <!--                <apply template="some-control" dynamicValue="true"/>-->
                      <div>
                          2) <button label="toggle A/B" onClick='dummyVm.put("flag", !dummyVm.get("flag")); BindUtils.postNotifyChange(null, null, dummyVm, "flag");'/>
                      </div>
                      <if test="@load(vm.flag)">
                          <div>
                              3) show A
                          </div>
                      </if>
                      <if test="@load(not vm.flag)">
                          <div>
                              3) show B
                          </div>
                      </if>
                  </template>
              </apply>
          </div>
      
          <template name="some-control">
              <div>
                  1) some control
              </div>
          </template>
      
          <template name="test">
              <div>
                  header
              </div>
              <div>
                  <apply template="content"/>
              </div>
              <div>
                  footer
              </div>
          </template>
      </zk>
      

      1. click the "toggle" button

      Current Result

      injection position is not preserved, and the 3rd row moves to the top of the content

      Expected Result

      keep the injected position

      Workaround

      set dynamiceValue at the first child
      <apply template="some-control" dynamicValue="true"/>

        Attachments

          Activity

            People

            Assignee:
            DevChu DevChu
            Reporter:
            hawk hawk
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved: