7 Replies Latest reply on Nov 10, 2010 3:40 AM by BhaskerChari

    quick reponse required please.............

    ravi burila

      Hi friend,

                   i just want to create a horizontal box containing(textInput--3 fields and button) dynamically depending upon data in database.

      i created horizontal box with its child elements sucessfully but here i have to call a function to store data entered by the enduser in textInput field into database.

      I am unable to retrieve data of a particular set of textinput field by clicking the button

       

       

      to be clear consider a small example

       

       

      textinputfield1        textinputfield2        textinputfield3          button

      textinputfield1       textinputfield2         textinputfield3         button

       

       

      no of rows depend upon data in database. Now by clicking on button,i want the entire textfield data to be displayed .

       

      thanx in advanceeee

        • 1. Re: quick reponse required please.............
          Tanu Jain Level 2

          Number of rows depend on the values in Database. Hence, you might have tried using Repeaters or List with custom itemRenderer.

           

          In case of custom ItemRenderer, button's click event can be handled and can directly access textInput field by its name. A custom event can then be dispatched sending the textInput Field's value upto its parent for saving onto database.

           

          Regards,

          Tanu

          • 2. Re: quick reponse required please.............
            ravi burila Level 1

            yes i used repeaters,. i have 78 fields in my database so iam getting 78

            textfields with same ID. so while retrieving data with textINput id iam

            getting undefined

             

             

             

            thanks for your reply

            """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""" """"""""""""""""

            • 3. Re: quick reponse required please.............
              rvollmar Level 1

              It looks like you want many rows, each row containing a few TextInputs and a Button, correct?  It seems that Tanu's suggestion of making a List with a custom renderer would be the way to go.

              • 4. Re: quick reponse required please.............
                dpark1113 Level 1

                How do you bind the data to txtinput?  I suggest Tanu's suggestion. 

                • 5. Re: quick reponse required please.............
                  rvollmar Level 1

                  Something like this would work:

                   

                  Code in main app:

                   

                      <fx:Declarations>
                          <s:ArrayCollection id="ac1">
                              <fx:Object fName="Albert" lName="Albertson" />
                              <fx:Object fName="Ann" lName="Annerton" />
                              <fx:Object fName="David" lName="Davidson" />
                          </s:ArrayCollection>
                      </fx:Declarations>
                     
                      <s:List dataProvider="{ac1}" itemRenderer="NamesRenderer" />

                   

                   

                  Code in NamesRenderer.mxml:

                   

                   

                  <?xml version="1.0" encoding="utf-8"?>
                  <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  xmlns:mx="library://ns.adobe.com/flex/mx"
                                  autoDrawBackground="true">
                     
                      <s:HGroup>
                          <s:TextInput text="{data.fName}" />
                          <s:TextInput text="{data.lName}" />
                      </s:HGroup>

                   

                  </s:ItemRenderer>

                  • 6. Re: quick reponse required please.............
                    ravi burila Level 1

                    the following is my program code

                     

                     

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

                     

                    <!--vertical box contains the textinput and button depending up on the size of array named column1 -->


                      <mx:VBox id="horizontal_box">
                      <mx:Repeater id="myRep" dataProvider="{column1}" >
                       <mx:HBox borderThickness="2">
                       <mx:Label text="{myRep.currentItem}" id="processName" width="220"/>         //contains array content as label text
                       <mx:TextInput id="startTime" width="100" />
                       <mx:TextInput id="endTime" width="100" />
                      
                       <mx:TextInput id="remarks" width="100" />
                       <mx:TextInput id="recordCount" width="100" />
                        <mx:Button id="submit"  label="ADD>>" click="addTrans();"/>             //addTrans() is the method called when button click event occured
                      </mx:HBox>
                        </mx:Repeater>

                    </mx:VBox>
                       <mx:Script>
                    <![CDATA[
                        import mx.collections.ArrayCollection;
                           import mx.controls.Alert;
                               [Bindable] private var column1:Array=[1,2,3,4,5,6,7,8,9,10];        

                             [Bindable] private var max:int;


                            [Bindable] private var i:int;
                          
                            [Bindable]private var array_date:Array = new Array();
                             private var u:URLRequest; 
                       
                             public function addTrans(start:String):void{                       //addTrans method declaration                                                                           
                    Alert.show("values entered in text input field by user are"+startTime.text+" "+endTime.text);  

                     

                     

                        //it is the place where iam unable to retrieve data entered by user.  the result displayed is undefined

                    }


                    ]]>
                    </mx:Script>

                    </mx:Application>

                    • 7. Re: quick reponse required please.............
                      BhaskerChari Level 4

                      Hi Ravi,

                       

                      You can use the following code below....

                       

                      Note:

                       

                      Observe the code in the blue and also the code in green...

                       

                      The code in blue is more of a dynamic one where in which you are dynamically looping through the children of your HBox container irrespective of the order of occurence of TextInputs and it will work for any number of TextInputs horizontally..

                       

                      Where as the code in green is a sort of static one and you code based on the indexes by hardcoding the positions of occurences in order to get the values.

                       

                      Observe both you will know the difference..:)

                       

                      <?xml version="1.0" encoding="utf-8"?>
                      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
                        <mx:VBox id="horizontal_box">
                        <mx:Repeater id="myRep" dataProvider="{column1}" >
                         <mx:HBox borderThickness="2">
                          <mx:Label text="{myRep.currentItem}" id="processName" width="220"/>
                          <mx:TextInput id="startTime" width="100" />
                          <mx:TextInput id="endTime" width="100" />
                          <mx:TextInput id="remarks" width="100" />
                          <mx:TextInput id="recordCount" width="100" />
                          <mx:Button id="submit"  label="ADD>>" click="addTrans(event.currentTarget as Button);"/>
                        </mx:HBox>
                          </mx:Repeater>

                      </mx:VBox>
                         <mx:Script>
                      <![CDATA[
                      import mx.containers.HBox;
                          import mx.collections.ArrayCollection;
                          import mx.controls.Alert;
                          import mx.controls.Button;
                          import mx.controls.TextInput;
                         
                                 [Bindable] private var column1:Array=[1,2,3,4,5,6,7,8,9,10];       

                               [Bindable] private var max:int;


                              [Bindable] private var i:int;
                            
                              [Bindable]private var array_date:Array = new Array();
                               private var u:URLRequest; 
                         
                               public function addTrans(clickedBtn:Button):void{                   
                                  var parentHBox:HBox = clickedBtn.parent as HBox;
                                 
                                  var enteredValues:String="";
                                  for each(var control:* in parentHBox.getChildren())
                                  {
                                   if(control is TextInput)
                                    enteredValues += (control as TextInput).text + " ";
                                  }
                                 
                                  Alert.show("values entered in text input field by user are "+ enteredValues);
                        
                                 
                                  /* var text1:String = (parentHBox.getChildAt(1) as TextInput).text;
                                  var text2:String = (parentHBox.getChildAt(2) as TextInput).text;
                                  var text3:String = (parentHBox.getChildAt(3) as TextInput).text;
                                  var text4:String = (parentHBox.getChildAt(4) as TextInput).text;
                                 
                         Alert.show("values entered in text input field by user are "+ text1 + " " + text2 + " " + text3 + " " + text4); */
                        
                        }


                      ]]>
                      </mx:Script>

                      </mx:Application>

                       

                      Thanks,

                      Bhasker