简体   繁体   English

Flex下拉列表绑定问题(或Bug?)

[英]Flex Drop Down List Binding Issue (or Bug?)

I'm using the MVC model in my flex project. 我在flex项目中使用MVC模型。

What I'd like is to bind a value object's class properties to a view mxml, then change that view by altering the value object. 我想要的是将值对象的类属性绑定到视图mxml,然后通过更改值对象来更改该视图。

What happens: 怎么了:

  1. Set the selected value to 'c' - index 2 将所选值设置为“ c”-索引2
  2. Add 'x,y,z,' before 'c' 在“ c”之前添加“ x,y,z”
  3. Hit enter -> now index 5 点击Enter->现在索引5
  4. Hit enter -> now index is -1 按Enter->现在索引为-1
  5. See 4. 见4。

Why does only the first update work ? 为什么只有第一次更新有效? I know I'm probably missing something obvious... 我知道我可能缺少明显的东西...

Edit: Running Example 编辑: 运行示例

(PS first post and im not sure how to turn on MXML highlighting) (PS的第一篇文章,我不确定如何打开MXML高亮显示)

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" 
               creationComplete="created(event)"
               width="160" height="220">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;
            import mx.events.FlexEvent;

            import spark.events.IndexChangeEvent;

            //===================================
            //     Pretend Value Object Class
            [Bindable] private var list:ArrayList = null;
            [Bindable] private var index:int = 0;
            //===================================

            protected function created(event:FlexEvent):void {
                ddValues.addEventListener(FlexEvent.ENTER, update);
                update();
            }

            private function update(... args):void {
                //note selected item

                trace("dropdown index: " + dd.selectedIndex);
                var s:String = dd.selectedItem as String;
                trace("selected item: " + s);
                //build new list from csv
                list = new ArrayList(ddValues.text.split(","));
                trace("new list: " + ddValues.text);
                trace("selected item: " + s);
                //if exists in new list, set value object index
                var newIndex:int = 0;
                if(list)
                list.toArray().forEach(function(ss:String, i:int, a:Array):void { 
                    if(s == ss) newIndex = i;; 
                });
                index = newIndex;
                trace("new index: " + index + "  (dropdown index: " + dd.selectedIndex + ")");
                trace("===");
            }


            protected function ddChange(event:IndexChangeEvent):void
            {
                trace("selected item: " + (dd.selectedItem as String) + "  (dropdown index: " + dd.selectedIndex + ")");
                trace("===");
            }

        ]]>
    </fx:Script>
    <s:Panel width="100%" height="100%" title="Drop Down Bug">
        <s:layout>
            <s:VerticalLayout gap="10" paddingLeft="10" paddingTop="10" paddingRight="10" paddingBottom="10"/>
        </s:layout>
        <s:DropDownList id="dd" dataProvider="{list}" selectedIndex="@{index}" change="ddChange(event)"></s:DropDownList>
        <s:Label text="Label: {dd.selectedItem as String}" paddingTop="5" paddingBottom="5"/>
        <s:Label text="Code Index: {index}" paddingTop="5" paddingBottom="5"/>
        <s:Label text="DropDown Index: {dd.selectedIndex}" paddingTop="5" paddingBottom="5"/>
        <s:TextInput id="ddValues" text="a,b,c,d,e"/>
    </s:Panel>
</s:Application>

And heres the output Edited code and added traces. 这里是输出已编辑的代码和添加的跟踪。 Heres the output that shows my problem: 这是显示我的问题的输出:

dropdown index: -1
selected item: null
new list: a,b,c,d,e
selected item: null
new index: 0  (dropdown index: 0)
===
selected item: c  (dropdown index: 2)
===
dropdown index: 2
selected item: c
new list: a,b,x,y,z,c,d,e
selected item: c
new index: 5  (dropdown index: 5)
===
dropdown index: 5
selected item: c
new list: a,b,x,y,z,c,d,e
selected item: c
new index: 5  (dropdown index: 5)
===
dropdown index: -1
selected item: null
new list: a,b,x,y,z,c,d,e
selected item: null
new index: 0  (dropdown index: 0)
===

Oh, I see what's going on now. 哦,我知道现在发生了什么。 When you replace the whole list, the selected item will be null, because the item that was selected was in the old list. 当您替换整​​个列表时,所选项目将为 null,因为所选项目在旧列表中。 You'll need to store the selected item when it is selected, and then do the comparison against that stored item, not the current selected (null) item. 您需要先存储选定的项目,然后再与该存储的项目而不是当前选定的(空)项目进行比较。

Note that what you're doing is in no way MVC, unless you've redefined MVC to mean "Model, View, and Controller are all the same thing." 请注意,除非您已重新定义MVC表示“模型,视图和控制器都是同一件事”,否则您所做的绝不是MVC。 In MVC, the model has no idea of the view, and the view only has access to read as much of the model as it needs to to display the data. 在MVC中,模型不了解视图,并且视图只能读取显示数据所需的模型数量。 It does not have write access to the model. 它没有对模型的权限。 That is the function of the controller. 那就是控制器的功能。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM