6 Replies Latest reply on Dec 8, 2010 5:31 AM by ShubaV

    Issues with  incrementig and decrementing ID column of data grid

    ShubaV

      I am using a cutom data grid component with handlers for click, creation complete events.

      THere are two buttons to add and remove items from the grid. The datagrid contains columns with values submitted in other fields of the form.

       

       

      Now when items are added, there is an ID column, which gets incremented and decremented on removal.

      This behaves as expected. But sporadically the ID column gets messed up.

       

      If there are 3 rows and 3rd row is deleted, and again a new rolw is added, id shows as '2' against the 3rd row instead of '3'.

       

      I would appreciate any inputs for handling this issue.

        • 1. Re: Issues with  incrementig and decrementing ID column of data grid
          Aurelien Vannieuwenhuyze

          Hello,

           

          If you use an ArrayCollection for manipulate the Dataprovider of the datagrid, i think that you can easely find a solution to your problem.

           

          The solution is to recalculate the id of the new element like this :

           

          If you delete the 3rd element :

          - the second becomes the first, the

          - the third becomes the secon

          - the new one becomes the third

           

          This is an example in flex 4 :

           

          <?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" minWidth="955" minHeight="600">

           

           

          <fx:Declarations>

           

           

          <!-- Placer ici les éléments non visuels (services et objets de valeur, par exemple). -->

           

          </fx:Declarations>

           

           

           

           

           

          <fx:Script>

          <![CDATA[

           

           

          import mx.collections.ArrayCollection;

           

           

          [Bindable]

           

          public var dataCollection:ArrayCollection = new ArrayCollection();

           

           

          public var incrementValue:int=0;

           

           

           

           

           

          public function addingElement():void

          {

           

           

          //nbr of data.

           

           

          var nbrRecords:int=dataCollection.length;

           

           

          //Calculate the id of each element of the dataCollection

           

           

          var id:int=1;

           

          for (var i:int=0; i<nbrRecords;i++)

          {

           

          var obj:Object = new Object();

          obj=dataCollection.getItemAt(i);

          obj.id = id;

          id++;

          }

           

           

          //Add the new element

           

           

          var obj:Object = new Object();

          obj.id=id;

          obj.data=

          "Value";

          dataCollection.addItem(obj);

           

           

          }

           

           

           

          public function deletingElement():void

          {

           

           

          var index:int= dgData.selectedIndex;

          dataCollection.removeItemAt(index);

           

          }

           

           

          ]]>

           

          </fx:Script>

           

           

           

          <mx:DataGrid id="dgData" x="95" y="120" dataProvider="{dataCollection}">

           

           

          <mx:columns>

           

           

          <mx:DataGridColumn headerText="ID" dataField="id"/>

           

           

          <mx:DataGridColumn headerText="Data" dataField="data"/>

           

           

          </mx:columns>

           

           

          </mx:DataGrid>

           

           

          <s:Button x="95" y="91" label="+" width="59" id="btn_add" click="addingElement()"/>

           

           

          <s:Button x="162" y="91" label="-" id="btn_del" click="deletingElement()"/>

           

           

           

           

           

          </s:Application>

           

           

          I hope you have helped

           

          • 2. Re: Issues with  incrementig and decrementing ID column of data grid
            drkstr_1 Level 4

            Your idea works just fine. Post your code.

            • 3. Re: Issues with  incrementig and decrementing ID column of data grid
              Aurelien Vannieuwenhuyze Level 1

              You've got the code in my precedent answer :

               

               

              public function addingElement():void

               

               

              //nbr of data.

              var nbrRecords:int=dataCollection.length;

               

              //Calculate the id of each element of the dataCollection

              var id:int=1;

               

              for (var i:int=0; i<nbrRecords;i++)

               

              var obj:Object = new Object();

               

              //Add the new element

              var obj:Object = new Object();

               

              "Value";

              dataCollection.addItem(obj);

               

               

              }

               

               

              obj.id=id;

              obj.data=

              obj=dataCollection.getItemAt(i);

              obj.id = id;

              id++;

              }

               

               

              {

               

               

               

               

              {

               

              • 4. Re: Issues with  incrementig and decrementing ID column of data grid
                drkstr_1 Level 4

                My reply was intended for the original poster. For some reason I didn't see your (much better than my own) reply before I posted. My apologies for the confusion.

                • 6. Re: Issues with  incrementig and decrementing ID column of data grid
                  ShubaV Level 1

                  I have pasted the code here.

                   

                   

                  <mx:DataGrid id="creditorsDg" x="10" y="299" width="678" height="107"
                       dataProvider="{creditorsDp}"  rowHeight="25"
                       creationComplete="UIHelper.selectRow(creditorsDg, 0);"
                       click="dataGrid_changeHandler(creditorsDp)">
                    <mx:columns>
                     <mx:DataGridColumn headerText="Id" dataField="creditorid" width="50"/>
                     <mx:DataGridColumn headerText="Given Name" dataField="givenname"/>
                     <mx:DataGridColumn headerText="Surname" dataField="surname"/>
                     <mx:DataGridColumn headerText="Company Name" dataField="companyname"/>
                    </mx:columns>
                  </mx:DataGrid>

                  <s:Button x="10" y="271" label="Add" height="19" width="58"
                       click="newRow_clickHandler()" />
                  <s:Button x="76" y="271" label="Remove" height="19" width="67"
                       click="Delete_clickHandler()" />
                      
                      
                      
                  protected function newRow_clickHandler():void
                     {
                      var cls:Class = Class(getDefinitionByName(getQualifiedClassName(currentRow)));
                      currentRow = new cls();
                     
                      currentRow[idString]=0;
                      enableNewRow=true;
                     
                      if (callBackNewRow!=null)
                       callBackNewRow();
                     
                     }
                    
                  protected function callBackNewRow():void
                     {
                      var curCreditor:creditor = new creditor();
                      currentRow=curCreditor;
                     
                      curCreditor.creditorid=0;
                      enableNewRow=true;
                      //set ddl
                      provinceDdl.selectedIndex=0;
                      addUnitDdl.selectedIndex=0;
                      //set rb
                      personRbClick_handler('P');
                     
                      saveToRow(curCreditor,"creditorid", creditorsDp, creditorsDg);
                     }
                    
                  public static function saveToRow(objToSave:Object,idString:String,
                            dataProvider:Object, dataGrid:DataGrid):void
                    {
                     if (objToSave[idString]==0) {
                      var idx:int=dataProvider.length;
                     
                      var lastId:int;
                     
                      if (idx==0)
                       lastId=0;
                      else
                       lastId=dataProvider.getItemAt(idx-1)[idString];
                     
                      objToSave[idString]=lastId+1;
                      dataProvider.addItem(objToSave);
                     
                      selectRow(dataGrid, idx);
                     }
                    }
                         
                    

                  public function Delete_clickHandler():void
                     {
                      var idx:int=dataGrid.selectedIndex//(debtorsDg.selectedItem as Debtor).DebtorId - 1;
                      var len:int=dataGrid.dataProvider.length;
                      var reorderNeeded:Boolean = true;
                    
                      if (idx>=0){
                       dataGrid.dataProvider.removeItemAt(idx);
                       dataGrid.dataProvider.refresh();
                      
                      
                       if (idx>=len-1) {
                        idx--;
                        callbackResetData(idx);
                        reorderNeeded=false; //last element deleted.
                       }
                       if (idx>=0) {
                        selectRow(dataGrid,idx);
                       }
                      }
                      dataGrid_changeHandler(dataGrid.dataProvider as ArrayCollection);
                      if(reorderNeeded)
                       this.callBackReorderList(dataGrid.dataProvider as ArrayCollection,idx);
                     }
                    


                    
                    
                       
                    
                  protected function callbackResetData(deleteIdx:int):void{
                      //set ddl
                      provinceDdl.selectedIndex=0;
                      addUnitDdl.selectedIndex=0;
                      //set rb
                      personRbClick_handler('P');
                     }
                    

                  protected function callBackReorderList(dp:ArrayCollection,deleteIdx:int):void{
                      var len:int= dp.length;
                      if(deleteIdx<len) //last row
                      {
                       for(var selectIdx:int=deleteIdx; selectIdx<len; selectIdx++){
                        var cred:Object = dp.getItemAt(selectIdx) ;//as creditor;
                        cred.creditorid=cred.creditorid -1 ;
                       }
                      }
                     
                     }         
                    
                    
                  protected function callBackNewRow():void
                     {
                      var curCreditor:creditor = new creditor();
                      currentRow=curCreditor;
                     
                      curCreditor.creditorid=0;
                      enableNewRow=true;
                      //set ddl
                      provinceDdl.selectedIndex=0;
                      addUnitDdl.selectedIndex=0;
                      //set rb
                      personRbClick_handler('P');
                     
                      UIHelper.saveToRow(curCreditor,"creditorid", creditorsDp, creditorsDg);
                     }  
                    
                    
                     public function dataGrid_changeHandler(dp:ArrayCollection):void
                     {
                      if (dataGrid.dataProvider!=dp)
                       dataGrid.dataProvider==dp;
                     
                      if (dataGrid.dataProvider.length==0) {
                      
                       var cls:Class = Class(getDefinitionByName(getQualifiedClassName(currentRow)));
                       currentRow = new cls();
                      
                       enableNewRow=false;
                      }
                     
                      if (dataGrid.selectedIndex==-1) {
                       if (callBackValidate!=null)
                        callBackValidate();
                       return;
                      }
                     
                      var idx:int=dataGrid.selectedIndex;
                     
                      if (idx==dataGrid.dataProvider.length)
                       idx=idx-1;
                     
                      if (idx>=0 && dataGrid.dataProvider.length>0){
                       enableNewRow=true;
                      
                       currentRow=dataGrid.dataProvider.getItemAt(idx);
                      
                      }
                     
                      if (callBackSetCurrentRow!=null && enableNewRow){
                       callBackSetCurrentRow();
                      }
                     
                      if (callBackValidate!=null)
                       callBackValidate();
                     
                     }