1

我正在开发一个带有 4 个选项卡的 flex 应用程序。当用户切换选项卡时，我想将前一个选项卡重置为其初始状态。另外我需要提醒用户，如果他没有保存他所做的更改（如果有的话），将会丢失。

我打算在模型中设置一个变量，如果选项卡下的字段发生任何更改，则设置/重置它。但是我该如何监控呢？有没有可用的听众？

另外如何检查和重置上一个选项卡的状态？选项卡下的内容仅来自组件。

[编辑] 我的问题是：

  1. 如何检查用户是否在当前选项卡中进行了任何编辑？一些字段也是动态生成的。
  2. 我在 TabNavigator 的 onchange 事件中调用了一个函数，并询问用户是否真的要切换选项卡。我希望其他选项卡仅在用户对弹出的警报框单击“是”时才加载其内容。但是现在弹出确认框，内容被加载到另一个选项卡中，如果用户单击“否”，它会返回到另一个选项卡。在用户按下“是”之前，如何完全阻止加载其他选项卡内容的操作？

请提供您宝贵的意见。

4

3 回答 3

2

问题1的答案如下；使用布尔变量来跟踪用户是否编辑了数据。当用户选择一个选项卡时，将此变量设置为 false。监听选项卡内所有字段的更改事件。将所有字段的更改事件处理程序设置为将布尔值设置为 true 的方法。对于动态字段，添加与其他字段相同的更改事件处理程序。创建每个动态字段后立即执行此操作。请参阅下面的代码；

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
            private var userChangedData:Boolean=false

            function onUserChangedData()
            {
                trace("onUserChangedData")
                userChangedData=true
            }

            function onTabChanged()
            {
                trace("ontabchanged")
                trace(userChangedData)
                userChangedData=false
            }
        ]]>
    </mx:Script>
    <mx:Panel title="TabNavigator Container Example"
              height="90%"
              width="90%"
              paddingTop="10"
              paddingLeft="10"
              paddingRight="10"
              paddingBottom="10">

        <mx:TabNavigator id="tn"
                         width="100%"
                         height="100%"
                         change="onTabChanged()">
            <!-- Define each panel using a VBox container. -->

            <mx:VBox label="Panel 1">
                <mx:Label text="TabNavigator container panel 1"/>
                <mx:TextInput text="default"
                              change="onUserChangedData()"/>
                <mx:CheckBox label="check something"
                             change="onUserChangedData()"/>
            </mx:VBox>

            <mx:VBox label="Panel 2">
                <mx:Label text="TabNavigator container panel 2"/>
            </mx:VBox>

            <mx:VBox label="Panel 3">
                <mx:Label text="TabNavigator container panel 3"/>
            </mx:VBox>
        </mx:TabNavigator>


    </mx:Panel>

于 2009-08-10T13:21:33.113 回答
1

对于 1) 您可以在每次用户编辑字段时分派一个事件。该事件可以通过一个命令来处理，该命令将使用有关已更新内容的正确信息更新模型中的某些属性。然后，在您的视图中关心的任何人都可以绑定到这些属性。

对于 2) 在 onChange() 处理程序中调用 event.preventDefault()。然后，只有当用户单击是时，您才能以编程方式选择下一个选项卡。

于 2009-08-10T01:53:30.440 回答
0

我还没有添加评论的声誉，但要回答您的问题：

“是否可以添加一个全局 onchange/onkeypress 方法，该方法与完整的应用程序挂钩并设置布尔值？否则我将不得不在多个位置进行编辑以添加 onchange 事件。- Basani”

是的，让每个需要发出“发生变化”信号的地方都派发一个事件。然后让一个命令监视该事件的调度。该命令可以完成您需要的所有处理，包括在模型中设置 userDataChanged 布尔值。

听起来您正在根据您标记问题的方式使用 Cairngorm，因此应该很容易支持这一点。

于 2009-08-10T18:22:58.900 回答