7 Replies Latest reply on Jul 23, 2009 10:07 AM by Flex harUI

    Update DataGrid!

    Vitor Wsis

      Hi,

       

      I have this code on the first component file:

       

      <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#525050"
          horizontalGap="4" xmlns:components="components.*">


      <mx:Script>
          <![CDATA[
              import mx.core.Container;
              import valueObjects.UserObject;
              import events.UserEvent;
             
              [Bindable]
              private var selectedUser:UserObject;
                     
              private function selectUserEventHandler(event:UserEvent):void{
                  selectedUser = event.user;
                  ConfContent.selectedChild=cpUpdateUtilizador;
              }
             
              private function Menu(op:Container):void{
                  ConfContent.selectedChild=op;
                 
              }
          ]]>
      </mx:Script>


          <mx:Canvas width="150" height="100%" backgroundColor="#C6C6C6">
              <mx:Label x="20" y="20" text="Utilizadores"/>
              <mx:LinkButton x="27" y="37" label="Adiccionar" click="Menu(cpfrmUtilizador)"/>
              <mx:LinkButton x="27" y="55" label="Listagem" click="Menu(cpListaUtilizadores)"/>
          </mx:Canvas>
         
          <mx:ViewStack id="ConfContent" width="100%" height="100%" backgroundColor="#E8EAEB" selectedIndex="2">
              <components:frmUtilizadores id="cpfrmUtilizador"/>
              <components:updateUtilizador id="cpUpdateUtilizador" selectedUser="{selectedUser}"/>
              <components:listaUtilizadores id="cpListaUtilizadores" selectUserEvent="selectUserEventHandler(event)"/>
          </mx:ViewStack>
      </mx:HBox>

       

      The second component file is a dataGrid with the follow code:

       

      <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#525050"
          horizontalGap="4" xmlns:components="components.*">


      <mx:Script>
          <![CDATA[
              import mx.core.Container;
              import valueObjects.UserObject;
              import events.UserEvent;
             
              [Bindable]
              private var selectedUser:UserObject;
                     
              private function selectUserEventHandler(event:UserEvent):void{
                  selectedUser = event.user;
                  ConfContent.selectedChild=cpUpdateUtilizador;
              }
             
              private function Menu(op:Container):void{
                  ConfContent.selectedChild=op;
                 
              }
          ]]>
      </mx:Script>


          <mx:Canvas width="150" height="100%" backgroundColor="#C6C6C6">
              <mx:Label x="20" y="20" text="Utilizadores"/>
              <mx:LinkButton x="27" y="37" label="Adiccionar" click="Menu(cpfrmUtilizador)"/>
              <mx:LinkButton x="27" y="55" label="Listagem" click="Menu(cpListaUtilizadores)"/>
          </mx:Canvas>
         
          <mx:ViewStack id="ConfContent" width="100%" height="100%" backgroundColor="#E8EAEB" selectedIndex="2">
              <components:frmUtilizadores id="cpfrmUtilizador"/>
              <components:updateUtilizador id="cpUpdateUtilizador" selectedUser="{selectedUser}"/>
              <components:listaUtilizadores id="cpListaUtilizadores" selectUserEvent="selectUserEventHandler(event)"/>
          </mx:ViewStack>
      </mx:HBox>

       

      When i update the Database with new data, i have to RUN again the project because the data on DataGrid isn't updated with a browser refresh, or with a click on the "<mx:LinkButton x="27" y="55" label="Listagem" click="Menu(cpListaUtilizadores)"/>".

       

      Can you help me?

        • 1. Re: Update DataGrid!
          Flex harUI Adobe Employee

          Where's the database?  Is it on a server?  How do the updates get back to the DataGrid?

           

          Alex Harui

          Flex SDK Developer

          Adobe Systems Inc.

          Blog: http://blogs.adobe.com/aharui

          • 2. Re: Update DataGrid!
            Vitor Wsis Level 1

            The database is on a MySql Server.

             

             

             

            The code that updates the server is the folowing:

             

             

             

             

             

            <?xml version="1.0" encoding="utf-8"?>

             

            <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" paddingLeft="15" width="100%" height="100%" paddingRight="15"

             

                            hideEffect="" showEffect="" >

             

            <mx:Dissolve id="dissolveOut" duration="200" alphaFrom="1.0" alphaTo="0.0"/>

             

            <mx:Dissolve id="dissolveIn" duration="200" alphaFrom="0.0" alphaTo="1.0"/>     

             

            <mx:Script>

             

                                           <![CDATA[

             

                                                           import mx.controls.Text;

             

                                                           import valueObjects.UserObject;

             

                        import mx.validators.Validator;

             

                        import mx.events.ValidationResultEvent;

             

                        import mx.controls.Alert;

             

               

             

                       

             

                        public var formIsValid:Boolean = false;

             

             

             

                       

             

                        public var formIsEmpty:Boolean = true;

             

                 

             

                                          

             

                                           public var selectedUser:UserObject;

             

                                            

             

                        private var focussedFormControl:DisplayObject;

             

                                               

             

                         

             

                        private function validateForm(event:Event):void

             

                        {                   

             

            .

             

                            focussedFormControl = event.target as DisplayObject;   

             

             

             

                            formIsValid = true;           

             

             

             

                            formIsEmpty = (txtNomeUtilizador.text == "" && txtUsername.text == ""

             

                                && txtPassword.text == "" && txtRepetirPassword.text == "");                                                                               

            validate(nameValidator);               

             

                            validate(userValidator);

             

                            validate(passValidator);

             

                            validate(rpassValidator);

             

                        }

             

                  

             

                         private function validate(validator:Validator):Boolean

             

                         {               

             

                             var validatorSource:DisplayObject = validator.source as DisplayObject;

             

                             

             

                            var suppressEvents:Boolean = (validatorSource != focussedFormControl);

             

                             

             

                            var event:ValidationResultEvent = validator.validate(null, suppressEvents);                                                                                

            var currentControlIsValid:Boolean = (event.type == ValidationResultEvent.VALID);

             

                              

             

                             formIsValid = formIsValid && currentControlIsValid;

             

                              

             

                             return currentControlIsValid;

             

                          }

             

                           

             

             

             

                        private function submitForm():void

             

                        {

             

                                                                           if(txtPassword.text!=txtRepetirPassword.text) Alert.show("As Paswords são diferentes!");

             

                                                                           else srv.send();

             

                        }

             

                      

             

                    ]]>

             

             

             

            </mx:Script>

             

            <mx:StringValidator

             

                    id="nameValidator"

             

                    source=""

             

                    property="text"

             

                    minLength="2"

             

                    requiredFieldError="Tem que preencher o Nome do utilizador."

             

                />

             

                 

             

            <mx:StringValidator

             

                    id="userValidator"

             

                    source=""

             

                    property="text"

             

                    minLength="2"

             

                    requiredFieldError="Tem que preencher o Username."

             

                />

             

            <mx:StringValidator

             

                    id="passValidator"

             

                    source=""

             

                    property="text"

             

                    minLength="2"

             

                    requiredFieldError="Tem que preencher a Password."

             

                />

             

            <mx:StringValidator

             

                    id="rpassValidator"

             

                    source=""

             

                    property="text"

             

                    minLength="2"

             

                    requiredFieldError="Tem que Repetir a Password."

             

                />

             

             

             

             

             

             

             

             

             

             

             

            PHP FILE:

             

             

             

            $SERVIDOR = mysql_connect("localhost","webuser","Wsis2003");

             

            $BD = mysql_select_db("bdweb");

             

             

             

            if (!$SERVIDOR) die('Não foi possível conectar ao Servidor: ' . mysql_error());

             

            if (!$BD) die('Não foi possível aceder à  BD: ' . mysql_error());

             

             

             

            $nome = $_POST['nome'];

             

                  $username = $_POST['username'];

             

                  $password = $_POST['password'];

             

                  $tipo = $_POST['tipo'];

             

                   

             

                  $hoje = date("d-m-Y \á\s H:i:s");

             

                   

             

                  $sql = "SELECT MAX(id) as id FROM users";

             

                  $result = mysql_query($sql);

             

                  $array = mysql_fetch_array($result);

             

                  $id = $array["id"] + 1;

             

                  $dir = “DIR”.$id;

             

                   

             

                  $sql = "INSERT INTO users(id,nome,user,pass,tipo,data,activo,pasta,ulogin)

             

                              VALUES(".$id.",'".$nome."','".$username."','".$password."','".$tipo."','".$hoje."','Sim', '".$dir."','".$hoje."')";

             

                  $result = mysql_query($sql);

             

                   

             

                  if($result)

             

                  {

             

                        if(!file_exists($dir)) mkdir($dir,0777,true);

             

                        echo("Utilizador introduzido com sucesso!");

             

                  }else echo("Não foi possível criar o Utilizador.");

             

             

             

             

             

            Regards,

             

            Vitor Correia

            • 3. Re: Update DataGrid!
              Flex harUI Adobe Employee

              Do you get a successful result?  Does that result contain the updates?

               

              Alex Harui

              Flex SDK Developer

              Adobe Systems Inc.

              Blog: http://blogs.adobe.com/aharui

              • 4. Re: Update DataGrid!
                Vitor Wsis Level 1

                The "result" value of the php file is ok! The data is inserted correctly in the MySQL DataBase!

                However i do not visualize the introduced data with a simple page refresh, or page "init()".

                I have to re-compile the Flex aplication to be able to see the newlly introduced data!

                NOTE: This data can be seen on the DataBase at all time.

                • 5. Re: Update DataGrid!
                  Flex harUI Adobe Employee

                  See if the DataGrid gets a collectionChange event when the data is updated.

                   

                  Alex Harui

                  Flex SDK Developer

                  Adobe Systems Inc.

                  Blog: http://blogs.adobe.com/aharui

                  • 6. Re: Update DataGrid!
                    Vitor Wsis Level 1

                    I still don't have a deep knowledge on Flex language.

                    Where i can find that collectionChange event?

                    • 7. Re: Update DataGrid!
                      Flex harUI Adobe Employee

                      In the documentation.  Should also be there as CollectionEvent.  It will be dispatched from the dataProvider and the DataGrid should have a collectionChangeHandler method that gets called

                       

                      Alex Harui

                      Flex SDK Developer

                      Adobe Systems Inc.

                      Blog: http://blogs.adobe.com/aharui

                      1 person found this helpful