Question

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

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

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

[编辑] 我的问题是：

如何检查用户是否在当前标签中进行了任何修改？某些字段也是动态生成的。
我正在调用TabNavigator的onchange事件中的一个函数，并询问用户是否真的想要切换标签。我希望其他标签仅在用户点击“警报”框中的“是”时加载其内容我是弹出。但现在弹出确认框，内容将加载到另一个选项卡中，如果用户单击否，则返回到另一个选项卡。在用户按是？

请提供您宝贵的意见。

Answer 1

对问题1的回答如下; 使用布尔变量来跟踪用户是否已编辑数据。当用户选择选项卡时，将此变量设置为false。在选项卡中的所有字段上侦听更改事件。将所有字段的change事件处理程序设置为将Boolean设置为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>

Answer 2

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

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

Answer 3

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

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

是的，让每个地方都需要发出信号“发生了变化”的事件。然后让Command观察该事件的发送。该命令可以执行您需要的所有处理，包括在模型中设置userDataChanged布尔值。

听起来你根据标记问题的方式使用Cairngorm，所以应该很容易支持。

Flex - 检查选项卡下字段的更改

3 个答案: