Remove selected item from DataGrid : DataGrid Selection « Grid « Flex






Remove selected item from DataGrid

Remove selected item from DataGrid
        
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="500"
    height="600">
    <mx:Script>
        
        import mx.events.*;
        import mx.collections.*;

        public function addPerson():void {
            ac.addItem({first:firstInput.text, last:lastInput.text,email:emailInput.text});
            clearInputs();
        }
        public function removePerson():void {
            if (dg.selectedIndex >= 0) {
                ac.removeItemAt(dg.selectedIndex);
            }
        }
        public function updatePerson():void {
            if (dg.selectedItem !== null) {
                ac.setItemAt({first:firstInput.text, last:lastInput.text,email:emailInput.text}, dg.selectedIndex);
            }
        }
        public function dgChangeHandler():void {
            clearInputs();
            firstInput.text = dg.selectedItem.first;
            lastInput.text = dg.selectedItem.last;
            emailInput.text = dg.selectedItem.email;
        }
        public function clearInputs():void {
            firstInput.text = "";
            lastInput.text = "";
            emailInput.text = "";
        }
        public function myLabelFunc(item:Object):String {
            return item.first + " " + item.last;
        }
      
    </mx:Script>
    <mx:ArrayCollection id="ac">
        <mx:source>
            <mx:Object first="A" last="B" email="a@m.com" />
            <mx:Object first="C" last="D" email="c@m.com" />
            <mx:Object first="E" last="F" email="e@m.com" />
        </mx:source>
    </mx:ArrayCollection>
    <mx:DataGrid width="450" id="dg" dataProvider="{ac}" change="dgChangeHandler()">
        <mx:columns>
            <mx:DataGridColumn dataField="first" headerText="First Name" />
            <mx:DataGridColumn dataField="last" headerText="Last Name" />
            <mx:DataGridColumn dataField="email" headerText="Email" />
        </mx:columns>
    </mx:DataGrid>
    <mx:Form>
        <mx:FormItem label="First Name">
            <mx:TextInput id="firstInput" />
        </mx:FormItem>
        <mx:FormItem label="Last Name">
            <mx:TextInput id="lastInput" />
        </mx:FormItem>
        <mx:FormItem label="Email">
            <mx:TextInput id="emailInput" />
        </mx:FormItem>
    </mx:Form>
    <mx:HBox>
        <mx:Button label="Add New" click="addPerson()" />
        <mx:Button label="Update Selected" click="updatePerson()" />
        <mx:Button label="Remove Selected" click="removePerson()" />
        <mx:Button label="Clear" click="clearInputs()" />
    </mx:HBox>
</mx:Application>

   
    
    
    
    
    
    
    
  








Related examples in the same category

1.Get selected index from DataGridGet selected index from DataGrid
2.DataGrid allows Multiple SelectionDataGrid allows Multiple Selection
3.Navigate to URL from DataGrid as selection changedNavigate to URL from DataGrid as selection changed
4.Handling a user interaction by passing the event object to a functionHandling a user interaction by passing the event object to a function