Проблема с привязкой datagrid к тексту. Вход

Question

То, что я пытаюсь сделать, - это ввести данные пользователя в несколько текстовых полей, а затем, как только данные будут введены, они будут отображаться в datagrid во время выполнения. Проблема в том, что когда я запускаю приложение, я нажимаю кнопку, но никакая введенная информация не добавляется в datagrid. Мои текстовые поля также должны очищаться после нажатия кнопки, но снова ничего не происходит. Вот мой код:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Script> 
    <![CDATA[ 

    import mx.collections.ArrayCollection; 

    [Bindable]private var dgItems:ArrayCollection; 
    [Bindable]public var temp:Object; 


    public function addItem(evt:Event):void { 
    //add item if the text input fields are not empty 
     if(name_input.text != ""&& location_input.text !="") { 
    //create a temporary Object 
     temp = myDG.selectedItem; 
     var temp:Object = new Object(); 
    //add the text from the textfields to the object 
     temp = {name:name_input.text, location:location_input.text}; 

    //this will add the object to the ArrayColldection (wich is binded with the DataGrid) 
     dgItems.addItem(temp); 
    //clear the input fields 
     name_input.text = ""; 
     location_input.text =""; 
     } 
    } 
    ]]> 
    </mx:Script> 

<mx:DataGrid x="97" y="110" dataProvider="{dgItems}" id="myDG"> 
    <mx:columns> 
    <mx:DataGridColumn headerText="Column 1" dataField="name:"/> 
    <mx:DataGridColumn headerText="Column 2" dataField="location:"/> 

    </mx:columns> 
</mx:DataGrid> 
<mx:Button x="97" y="51" label="add" click="addItem(event)"/> 
<mx:TextInput x="117" y="300" id="location_input"/> 
<mx:TextInput x="117" y="340" id="name_input"/> 
</mx:Application> 

Любая помощь будет принята с благодарностью.

Answer 1

В вашем коде имеется множество ошибок. Во-первых, вы не инициализировали коллекцию массива dgItems, поэтому значение равно null. При попытке «addItem» к нулевому объекту вы получите ошибки.

Во-вторых, вы пытались получить доступ к выбранному элементу DataGrid перед инициализацией DataGrid's ArrayCollection dataProvider. В списке нет элементов, не может быть выбранItem.

В-третьих, вы создаете новый объект дважды; один раз с линией «новый объект» и снова с встроенным синтаксисом для определения объектов: '{}

В-четвертых, свойства данных поля данных в DataGridColumn содержали в них двоеточия, но свойств объекта не было.

Надеюсь, это поможет.

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Script> 
     <![CDATA[ 

      import mx.collections.ArrayCollection; 

      // array collection was never initialized; you can't items to a null object 
      [Bindable]private var dgItems:ArrayCollection = new ArrayCollection(); 
// not needed 
//   [Bindable]public var temp:Object; 


      public function addItem(evt:Event):void { 
       //add item if the text input fields are not empty 
       if(name_input.text != ""&& location_input.text !="") { 
        //create a temporary Object 
        // this line of code serves no purpos 
        //     temp = myDG.selectedItem; 
        var temp:Object // = new Object(); 
        //add the text from the textfields to the object 
        temp = {name:name_input.text, location:location_input.text}; 

        //this will add the object to the ArrayColldection (wich is binded with the DataGrid) 
        dgItems.addItem(temp); 
        //clear the input fields 
        name_input.text = ""; 
        location_input.text =""; 
       } 
      } 
     ]]> 
    </mx:Script> 

    <mx:DataGrid x="97" y="110" dataProvider="{dgItems}" id="myDG"> 
     <mx:columns> 
      <!-- need to remove the colons from the data field --> 
      <mx:DataGridColumn headerText="Column 1" dataField="name"/> 
      <mx:DataGridColumn headerText="Column 2" dataField="location"/> 

     </mx:columns> 
    </mx:DataGrid> 
    <mx:Button x="97" y="51" label="add" click="addItem(event)"/> 
    <mx:TextInput x="117" y="300" id="location_input"/> 
    <mx:TextInput x="117" y="340" id="name_input"/> 
</mx:Application> 

Многие из этих ошибок были легко пойманы, как только я запустил отладчик. Если вы еще не используете его, я предлагаю немного прочитать его.