将内容动态加载到区域中 Load content dynamically into area

<< 点击显示目录 >>

主页  mappView帮助助手 > mappView入门简单Wiki >

将内容动态加载到区域中 Load content dynamically into area



需求

•Automation Studio 4.4

•mappView 5.4

说明

-->此案例<-- 显示如何使用左侧的三个按钮将内容动态加载到主区域。

Img

主要工作由“InfoSample.eventbinding”中的事件绑定代码完成。 在页面更改时，Web 服务器会记住左侧选定的切换按钮，但不会记住主区域中加载的内容。 它总是会加载默认内容，通常是第一个内容页面。 这可能会导致左侧按钮与主区域中的内容不对齐。 要解决此问题，在加载页面并取消选择所有按钮时始终选择第一个按钮

实现

•添加新页面并定义布局

•创建多个按钮以在内容之间切换

•添加多个内容文件并在布局文件中分配默认内容

•创建事件绑定以在内容之间切换

Event binding 文件

<?xml version="1.0" encoding="utf-8"?>
<EventBindingSet id="InfoSample_eventbinding" xmlns="http://www.br-automation.com/iat2014/eventbinding/v2" xmlns:types="http://www.br-automation.com/iat2015/widgetTypes/v2" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
  <Bindings>
    <!-- Make sure first button is selected when page is loaded />-->
    <EventBinding>
      <Source xsi:type="clientSystem.Event" event="ContentLoaded" />
 <EventHandler condition="contentId=&quot;contentInfoSample&quot;" >
        <Sequence>
          <Step order="0">
            <Action>
              <Target xsi:type="widgets.brease.ToggleButton.Action" contentRefId="contentInfoSample" widgetRefId="ToggleButton1">
                <Method xsi:type="widgets.brease.ToggleButton.Action.SetValue" value="1" />
              </Target>
            </Action>
          </Step>
          <Step order="1">
            <Action>
              <Target xsi:type="widgets.brease.ToggleButton.Action" contentRefId="contentInfoSample" widgetRefId="ToggleButton2">
                <Method xsi:type="widgets.brease.ToggleButton.Action.SetValue" value="0" />
              </Target>
            </Action>
          </Step>
          <Step order="2">
            <Action>
              <Target xsi:type="widgets.brease.ToggleButton.Action" contentRefId="contentInfoSample" widgetRefId="ToggleButton3">
                <Method xsi:type="widgets.brease.ToggleButton.Action.SetValue" value="0" />
              </Target>
            </Action>
          </Step>
        </Sequence>
      </EventHandler>
    </EventBinding>
    <!-- Load content depending on button 1-3 />-->
    <EventBinding id="contentInfoSample.ToggleButton1.Click">
      <Source contentRefId="contentInfoSample" widgetRefId="ToggleButton1" xsi:type="widgets.brease.ToggleButton.Event" event="Click" />
      <EventHandler>
        <Action>
          <Target xsi:type="clientSystem.Action">
            <Method xsi:type="clientSystem.Action.LoadContentInArea" contentId="contentSample1" areaId="AreaContent" pageId="pageSample"/>
          </Target>
        </Action>
      </EventHandler>
    </EventBinding>
    <EventBinding id="contentInfoSample.ToggleButton2.Click">
      <Source contentRefId="contentInfoSample" widgetRefId="ToggleButton2" xsi:type="widgets.brease.ToggleButton.Event" event="Click" />
      <EventHandler>
        <Action>
          <Target xsi:type="clientSystem.Action">
            <Method xsi:type="clientSystem.Action.LoadContentInArea" contentId="contentSample2" areaId="AreaContent" pageId="pageSample"/>
          </Target>
        </Action>
      </EventHandler>
    </EventBinding>
    <EventBinding id="contentInfoSample.ToggleButton3.Click">
      <Source contentRefId="contentInfoSample" widgetRefId="ToggleButton3" xsi:type="widgets.brease.ToggleButton.Event" event="Click" />
      <EventHandler>
        <Action>
          <Target xsi:type="clientSystem.Action">
            <Method xsi:type="clientSystem.Action.LoadContentInArea" contentId="contentSample3" areaId="AreaContent" pageId="pageSample"/>
          </Target>
        </Action>
      </EventHandler>
    </EventBinding>
  </Bindings>
</EventBindingSet>