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

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

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Major Major
    • 10.0.0, 9.6.3
    • 9.6.2
    • None
    • Security Level: Jimmy
    • None

      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"/>

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

              Created:
              Updated:
              Resolved: