DataGrid Checkbox

Hello!
I have a DataGrid with this column:
<mx:DataGridColumn headerText="" width="25" itemRenderer="mx.controls.CheckBox" rendererIsEditor="true" editorDataField="selected" sortable="false" paddingLeft="6"/>
How can I get the ArrayCollection made up of the rows that have that checkbox selected when a button is pressed for example?
Thank you!

If this post answers your question or helps, please mark it as such.
Greg Lafrance - Flex 2 and 3 ACE certified
www.ChikaraDev.com
Flex / AIR Development, Training, and Support Services
Here you go:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script>
    <![CDATA[
      import mx.collections.ArrayCollection;
      import mx.controls.CheckBox;
      private var arr:Array = [
        {name: "Bob Smith", FLAG: false},
        {name: "Fred Tompas", FLAG: false},
        {name: "Mary Freeman", FLAG: false},
        {name: "Tim Thorat", FLAG: false}
      [Bindable] public var ac:ArrayCollection = new ArrayCollection(arr);
      [Bindable] public var selectedNames:ArrayCollection = new ArrayCollection();
      private function selectedOnly(item:Object, idx:uint, arr:Array):Boolean {
        return (item.FLAG == "true");
    ]]>
  </mx:Script>
  <mx:DataGrid id="dg" dataProvider="{ac}">
    <mx:columns>
      <mx:DataGridColumn dataField="name" width="100" headerText="Name"/>
      <mx:DataGridColumn dataField="FLAG" width="100" headerText="Selected">
        <mx:itemRenderer>
          <mx:Component>
            <mx:CheckBox selectedField="FLAG" change="onChange(event);" label="">
              <mx:Script>
                <![CDATA[
                  import mx.controls.Alert;
                  private function onChange(evt:Event):void {
                    data.FLAG = !data.FLAG;
                    if(data.FLAG == true){
                      outerDocument.selectedNames.addItem(data.name);
                    }else{
                      if(outerDocument.selectedNames.contains(data.name)){
                        outerDocument.selectedNames.removeItemAt(outerDocument.selectedNames.getItemIndex(data.name));                       
                ]]>
              </mx:Script>
            </mx:CheckBox>
          </mx:Component>
        </mx:itemRenderer>           
      </mx:DataGridColumn>
    </mx:columns>
  </mx:DataGrid>
  <mx:List dataProvider="{selectedNames}"/>
</mx:Application>

Similar Messages

  • Datagrid Checkbox item renderer Issue.

    Hi There
    Recently I faced a  requirement to have a checkbox inside a datagrid where I need to develop a music module with playlist management for ADOBE AIR based application.
    For this I have searched and found a source to use Datagrid and Checkbox components which overrides some inbuild methods to give the required result..
    But Finally I ended with one strange issue
    When the check box is placed in the datagrid at 0 column index it works firne but if we place at any index ( I need it to be last colum ) the checkbox is not updating the display.
    Source Flex Air project attached.
    From the sample... While clicking on a row the left column checkbox is getting updated but Right remains same... when you scroll the Datagrid then the checkboxes are getting update when they are redrawn. I didn't found where to call the redraw for the right checkbox column.
    Cany any one faced this strange issue. and found any solution ?????
    If the Logic what I am following for a Playlist module is not good one then suggest if you guys know any other mechanism to develop a playlist management with datagrid and Checkboxes.
    Message was edited by: ChintuBabu

    Hi There
    Recently I faced a  requirement to have a checkbox inside a datagrid where I need to develop a music module with playlist management for ADOBE AIR based application.
    For this I have searched and found a source to use Datagrid and Checkbox components which overrides some inbuild methods to give the required result..
    But Finally I ended with one strange issue
    When the check box is placed in the datagrid at 0 column index it works firne but if we place at any index ( I need it to be last colum ) the checkbox is not updating the display.
    Source Flex Air project attached.
    From the sample... While clicking on a row the left column checkbox is getting updated but Right remains same... when you scroll the Datagrid then the checkboxes are getting update when they are redrawn. I didn't found where to call the redraw for the right checkbox column.
    Cany any one faced this strange issue. and found any solution ?????
    If the Logic what I am following for a Playlist module is not good one then suggest if you guys know any other mechanism to develop a playlist management with datagrid and Checkboxes.
    Message was edited by: ChintuBabu

  • Datagrid Checkbox - Select All Headerrenderer

    i have a datagrid that utilizes an itemrenderer and headerrender for the same column to have checkboxes and also a select all checkbox in the column header...as such:
    <mx:DataGrid width="100%" height="100%" id="dg" dataProvider="{employees}" sortableColumns="false"
                                draggableColumns="false">
                                <mx:columns>
                                    <mx:DataGridColumn width="30" textAlign="center">
                                        <mx:headerRenderer>
                                            <mx:Component>
                                                <mx:CheckBox/>
                                            </mx:Component>
                                        </mx:headerRenderer>
                                        <mx:itemRenderer>
                                            <mx:Component>
                                                <mx:CheckBox selected="{(data.@isSelected == 'true')?true:false}" click="{data.@isSelected = (data.@isSelected != 'true') ? 'true' : 'false';}"/>
                                            </mx:Component>
                                        </mx:itemRenderer>
                                    </mx:DataGridColumn>
                                    <mx:DataGridColumn headerText="Item ID" dataField="@id" width="60"/>
                                    <mx:DataGridColumn headerText="Date" dataField="@date" width="85"/>
                                </mx:columns>
                            </mx:DataGrid>
    my XMLList is as follows (that populates the datagrid):
    <mx:XMLList id="employees">
            <request id="720" date="Aug 21 09" isSelected="false"/>
            <request id="721" date="Aug 21 09" isSelected="false"/>
            <request id="722" date="Aug 21 09" isSelected="false"/>
            <request id="723" date="Aug 21 09" isSelected="false"/>
    </mx:XMLList>
    Now, if I select a rows checkbox, it works fine and updates the XMLList with the new value of isSelected for that row.
    My question is this: how do I make it so that clicking on the checkbox inside the headerrenderer selects all the checkboxes in the itemrenderer?  I know that Flex doesn't build rows that are not in view yet, so what needs to happen here in order to a) select the itemrenderer checkboxes and b) update the related XMLList so all isSelected update to either true/false.
    Thanks!

    Thanks for putting me on the right track for this...quick question:
    My arrayCollection looks like this:
    [Bindable]
    private var myAC:ArrayCollection = new ArrayCollection([
        {id:1, date: 'Bob Jones', isSelected: true},
        {id:2, date: 'Jane Smith', isSelected: true},   
        {id:3, date: 'Doug Johnson', isSelected: false},
        {id:4, date: 'Bob Jones', isSelected: true},
        {id:5, date: 'Jane Smith', isSelected: true},   
        {id:6, date: 'Doug Johnson', isSelected: false},
        {id:7, date: 'Bob Jones', isSelected: true},
        {id:8, date: 'Jane Smith', isSelected: true},   
        {id:9, date: 'Doug Johnson', isSelected: false},      
    And the datagrid displays this correctly, so no problems there.
    Now, I have a function that gets called when the checkbox in the header is selected, but am stuck here as to how to update all of the isSelected values in myAC to true.
    This is what I tried with no success...any thoughts?
    public function checkAll():void {
        for(var i:int=0; i < myAC.length; i++){
            myAC.itemUpdated(myAC.getItemAt(i).isSelected, false, true);
    Thanks!

  • Datagrid checkbox headerrenderer check off problem

    I have a datagrid where one column has select option like what we have in mail inboxes. User can select one or many row items to perform any actions by selecting the checkbox. It has also one select all option which is shown in the header renderer of that particular column. If user clicks on that all checkboxes gets selected.
    I have done that but the problem is that whenever i am performing any action by selecting all(header checkbox) and as a result the datagrid sometimes sets visible off or switches to some other mxml component from the component which is holding the datagrid and after coming back from that scenario again to the datagrid, its seen that the checkbox is still checked ... i want that checkbox to set to non-checked.
    help me.

    Hi subhajit nag,
    Say the below is your mxml component in viewStack...
    <your component>
    <mx:Script>
    <![CDATA[
    [Bindable]private var headerChecked:Boolean = false;
    private function onShow():void
         headerChecked = false;
    ]]>
    </mx:Script>
    </your component>
    <mx:DataGrid x="35" y="10" id="mydg">
            <mx:columns>        
                <mx:DataGridColumn editable="true" sortable="false">
                 <mx:headerRenderer>
                  <mx:Component>
                            <mx:CheckBox selected="{outerDocument.headerChecked}" click="checkUnCheckCheckBoxes()">
                             <mx:Script>
                      <![CDATA[
                       import mx.collections.ArrayCollection;
                   private function checkUnCheckCheckBoxes():void
                      // You can handle your logic what you want to do when header check box is clicked....   
                      ]]>
                  </mx:Script>
                            </mx:CheckBox>
                        </mx:Component>
                 </mx:headerRenderer>
                    <mx:itemRenderer>                
                        <mx:Component>
                            <mx:CheckBox selected="{data.isSelected}" click="{data.recselected = !data.recselected}"/>
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
                <mx:DataGridColumn headerText="Column 1" dataField="firstName"/>
                <mx:DataGridColumn headerText="Column 2" dataField="lastName"/>           
            </mx:columns>
        </mx:DataGrid>
    So you just need to change the value of the headerChecked  bindable variable to false..in show event for your first scenario...and your header check box is automatically unselected because this check box is binded to a bindable variable to which you are setting to false...
    For your second scenario....you can use the same changing the headerChecked value to false...
    You need to set this varibale to false in your second scenario where you know that your Header Render datagrid is making it visible after you made it unvisible...
    say you have clicked header check box and you made this datagrid invisible and this header checkbox datagrid will be visible once again when you click toggle button so set the value to false in the toggle button click function....
    private function toggleButtonClickHandler():void
         headerChecked = false;
         yourHeaderChkDataGrid.visible = true;
         yourAnotherDG.visible = false;
    Hope this is clear for you now...Try this and let me know...
    Thanks,
    Bhasker Chari

  • Datagrid checkbox renderer refresh?

    I am using a checkbox renderer for one of the columns in a
    flex datagrid.
    When i scroll up or down, the checkboxes i have alread
    clicked, change to different boxes (records). ????
    Not sure if this is a redraw issue. Tried to validate, but
    did not help.
    Please help.

    When we add a customized checkbox column to a datagrid in .net (windows application) , the default property allows to check or uncheck the column using a double click. On the first click it selects the column and on the second click the column is either checked or unchecked.
    To change this default property, we need to handle the click event on grid and modify the selected cell value. Here is the sample code to achieve this.
    [C#.NET VS 2003 , Code to add checkbox column to grid using table style property]
    dgItemDetails.TableStyles.Clear(); // clears the tablestyle (dgItemDetails is the name of grid)
    DataGridTableStyle dgt = new DataGridTableStyle();
    dgt.MappingName = "ItemDetails";
    DataGridBoolColumn dgbCol = new DataGridBoolColumn(); // creates the checkbox column
    dgbCol.MappingName = "Select";
    dgbCol.HeaderText = "";
    dgbCol.Width = 40;
    dgbCol.AllowNull = false;
    dgbCol.Alignment = HorizontalAlignment.Left;
    dgt.GridColumnStyles.Add(dgbCol);
    dgItemDetails.TableStyles.Add(dgt); // add
    Eliza

  • Datagrid checkbox renderer

    Hi all,
    I have a datagrid with checkbox as item renderers and
    checkbox as header renderer in one of its columns.
    I created a custom datagrid column extending from datagrid
    column.
    The visible property of checkbox in a row is based on a
    condition.
    All works fine if there are only 7 rows in a datagrid,i get
    three rows with checkbox and the other without checkbox.
    but,if i have more than 7 rows(with vertical scrollbar) i see
    all the checkboxes visible which should not happen.
    Thanks

    thanks for the reply sreenivas
    but i have already done that..
    here is my set data method
    override public function set data(value:Object):void{
    if(value != null){
    super.data = value;
    checkDelPermission(null);
    public function checkDelPermission(event:FlexEvent =
    null):void{
    var checkpermissioninstance:CheckPermission = new
    CheckPermission();
    checkpermissioninstance.permissions = [8];
    if(data.hasOwnProperty("permission")){
    checkpermissioninstance.permBit = data.permission;
    var delpermission:ArrayCollection =
    checkpermissioninstance.getPermissions()
    if(delpermission!=null){
    if(delpermission[0]==true){
    this.visible = true;
    else{
    this.visible=false
    else{
    this.visible = false;
    MittoApp.logMessage("permission"+data.permission +" and
    visible=="+this.visible);
    the message is always printed with the correct values but the
    display is not.
    Thanku

  • Flex 4, datagrid, checkboxes, and the impossible dream?

    I want to build a datagrid that has a column with checkboxes so the user can select a single record or multiple records (for deletion, for exporting, for whatever). But I also want to enable the user to click on anywhere in the row other than the checkbox to open a record for editing. I know how to do one or the other function, but I haven't been smart enough to figure out how to combine the functions with Flex 4. Is it possible?
    I see this sort of functionality in my gmail account - I can click on checkboxes to select items for delete *and* I can click on any item to open it for reading, etc. The item doesn't open when I click on the checkbox. I see lots of posts discussing checkboxes in datagrids. I've studied Alex's Flex Closet post at http://blogs.adobe.com/aharui/2010/01/checkboxes_in_datagrid_with_ch.html most closely. Can anyone point me in the right direction?
    TIA!!!

    Interesting. For a workaround, does it work for you if you wrap the caselessSortForField() in some curly quotes (ie: use databinding)?
    <mx:DataGridColumn dataField="index"
            sortCompareFunction="{caselessSortForField('index')}" />
    It worked for me locally using my simple test case and a nightly Flex 4.1 SDK.
    Peter

  • DataGrid CheckBox ItemRenderer

    Hi
    I am having some problems with my CheckBox extended
    ItemRenderer for a DataGrid.
    All works fine except now rollover does not work properly on
    the DataGrid - you hover over a row and the first one you come to
    highlights but thereafter it will not update to show other rows you
    go over.
    I am attaching the code to see if anyone can spot anything.
    I've been searching the Internet for a solution for the last
    day and a half but hopefully someone here can help me out !
    Thanks in advance
    Chris

    No, the itemRenderer should be wrapped into a container, so
    "this" will refer to container itself.
    this->ComboBox_id will be right way.
    Here is the example of IR:
    <?xml version="1.0" encoding="utf-8"?>
    <mx:VBox xmlns:mx="
    http://www.adobe.com/2006/mxml"
    width="100%"
    verticalScrollPolicy="off" horizontalScrollPolicy="off">
    <mx:Label
    id="cellLabel"
    x="0" y="0"
    width="100%"
    textAlign="right"
    text="{data.hasOwnProperty('m_nDiscountPercent')?frmt_Percent.format(data.m_nDiscountPerc ent)
    + '%':'---'}"
    paddingRight="10"/>
    </mx:VBox>
    Yours will look similar, just ComboBox instead of a Label.
    Cheers,
    Dmitri.

  • Checkbox rendere in datagrid

    Hi all,
    I have a datagrid with checkbox as renderer.
    after selecting few checkboxes,if i scroll the datagrid
    checkboxes are selected at random.
    my renderer code is attached..
    thanks

    Hi karnatis,
    Just like Alex told you, we can do it easily by
    for (var i:int = 0; i < dg.selectedItems.length; i++) {   
         Alert.show(dg.selectedItems[i].lastName);
    dg.selectedItems  -> contains all checked items
    dg.selectedItem    -> contains last checked item
    Hope this help!

  • Datagrid itemrenderer

    <mx:Component
    id="cb">
    <mx:CheckBox click="click()" label="{data.ID}" selected="false">
    <mx:Script>
    <![CDATA[
    private function click():void
    data.select=this.selected;
    ]]>
    </mx:Script>
    </mx:CheckBox>
    </mx:Component> 
    <mx:DataGrid>
    <mx:DataGridColumn headerText="Sec" dataField="select" editorDataField="selected" itemRenderer="{cb}" visible="true" width="70" rendererIsEditor="true"/></mx:DataGrid>
    hi..
    I get data from datagride database via xml. I've got datagrid checkboxes. When I choose any checkbox and when a new data comes, the checkboxes of some lines are shown as chosen as well.
    how can I solve this problem?

    Hi,
    It looks like, you have to bind the data with item renderer. I have modified your code which may help you to understand.
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
        <mx:XML id="dp">
            <root>
                <node label="Parent 1" selected="true"/>
                <node label="Parent 2" selected="true"/>
            </root>
        </mx:XML>
    <mx:DataGrid id="dg" dataProvider="{dp.children()}">
        <mx:columns>
            <mx:DataGridColumn headerText="Label" dataField="@label"    />
            <mx:DataGridColumn headerText="Selected" dataField="@selected"    />
            <mx:DataGridColumn headerText="Sec" >
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:CheckBox click="click()" >
                            <mx:Script>
                            <![CDATA[
                              override public function set data(value:Object):void
                                super.data = value;
                                selected = value.@selected == "true";
                              private function click():void
                                data.@selected=this.selected;
                            ]]>
                            </mx:Script>
                        </mx:CheckBox>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>
    </mx:Application>
    -Arivu

  • Re:Item renderer AS3 for datagrid

    I am having a data grid with multiple check boxes for this i am using CheckCellRendererEdit as itemrenderer.When i am making a change in datagrid checkbox its not updating
    The problems are
    1. when i select a checkbox in second row it gets selected in another  row after saving
    2.when i choose one checkbox in a row it gets afftected in many row can i get a solution for this Below given is the code i am using
    CheckCellRendererEdit.as
    package
        import mx.controls.*;
    import mx.core.*;
    import mx.controls.dataGridClasses.DataGridListData;
    import flash.events.Event;
    import flash.events.MouseEvent;
    public class CheckCellRendererEdit extends CheckBox
    // Define the constructor and set properties.
    public function CheckCellRendererEdit() {
        super();
    override protected function clickHandler(event:MouseEvent):void
                if (!enabled)
                {    //DataGrid(this.parentDocument.dg).selectedItem.vdata=CheckBox(event.currentTarget).selec ted;
                        event.stopImmediatePropagation();
                        return;
                if (toggle)
                    selected = !selected;

    Currently i am migrating from flex1.5 to flex2 Just i am using this itemrenderer(checkbox) for DataGrid can i have some ideas for datagrid
    The DataGrid i am using is
    <mx:DataGrid id="screendg" ">
                <mx:columns>
                  <mx:Array>
                    <mx:DataGridColumn headerText="mdata" dataField="screenid" editable="false" />
                    <mx:DataGridColumn headerText="data" dataField="mdata" itemRenderer="CheckCellRendererEdit"  />
                    <mx:DataGridColumn headerText="mdata" dataField="vdata" itemRenderer="CheckCellRendererEdit"  />
                    <mx:DataGridColumn headerText="cdata" dataField="cdata" itemRenderer="CheckCellRendererEdit"  />
                    <mx:DataGridColumn headerText="vdata" dataField="udata" itemRenderer="CheckCellRendererEdit"  />
                </mx:Array>
                </mx:columns>
              </mx:DataGrid>
    When i am selecting a checkbox in data grid the grid value is not getting changed

  • Datagrid check box

    hi all
    when i click the datagrid checkbox want to get that selected value in arraylist
    can anyone help me out

    Hi,
    Here I am with the solution of your problem.In my example you can select simply
    one checkbox at a time and data related to this row will be shown in one another
    datagrid.Please let me know if you have any problem with this.I am putting the
    code here.First one is the Main application and the second one is the ItemRenderer
    for the checkbox.Pls let me know if it solves ur porlblem.
    Main Application
    <?xml version="1.0"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
            import itemRenderer.CheckBoxItemRenderer;
            import mx.events.ListEvent;
            import mx.collections.ArrayCollection;
                [Bindable]
                private var docDetailAC:ArrayCollection = new ArrayCollection([
                    {chkBoxValue:false,srNo:'1',docName:'Employee Details'},
                    {chkBoxValue:false,srNo:'2',docName:'Busines Policies'},
                    {chkBoxValue:false,srNo:'3',docName:'Tax Policies'}
                [Bindable]
                private var acCopy : ArrayCollection = new ArrayCollection();
                private function onItemClick(event : ListEvent):void
                    if(event.itemRenderer is CheckBoxItemRenderer)
                        var currentIndex : Number = event.rowIndex;
                        if(acCopy.length > 0)
                            acCopy.removeAll();
                            acCopy.refresh();
                            for (var i:Number = 0;i < docDetailAC.length;i++)
                                if(i == currentIndex)
                                    docDetailAC[i].chkBoxValue = true;
                                else
                                    docDetailAC[i].chkBoxValue = false;
                                docDetailGrid.invalidateList();
                        var acItem : Object = docDetailAC.getItemAt(currentIndex);
                        acCopy.addItem(acItem);
        ]]>
    </mx:Script>
        <mx:Panel height="100%" width="100%"
            paddingTop="10" paddingLeft="10" paddingRight="10">
            <mx:Label width="100%" color="black"
                text="Select a row in the DataGrid control."/>
           <mx:DataGrid width="300" height="150" id="docDetailGrid"
                    dataProvider="{docDetailAC}"
                    editable="true"
                    horizontalScrollPolicy="off"
                    itemClick="onItemClick(event)">
                    <mx:columns>                               
                        <mx:DataGridColumn id="docDetailDG_1" headerText="No" width="40" editable="false"
                            itemRenderer="itemRenderer.CheckBoxItemRenderer" />
                        <mx:DataGridColumn headerText="No" width="40" dataField="srNo" editable="false"/>
                        <mx:DataGridColumn headerText="Doc Name" dataField="docName" />
                    </mx:columns>
                </mx:DataGrid>
            <mx:Label width="100%" color="red"
                text="Selected item in the DataGrid control."/>                           
          <mx:DataGrid width="300" height="150"
                                        dataProvider="{acCopy}"
                                        horizontalScrollPolicy="off">
                                        <mx:columns>                               
                                            <mx:DataGridColumn  headerText="No" width="40" dataField="srNo" editable="false"/>
                                            <mx:DataGridColumn  headerText="Document Name " dataField="docName" />
                                        </mx:columns>
                                    </mx:DataGrid>                           
        </mx:Panel>
    </mx:Application>
    CheckBoxItemRenderer
    <?xml version="1.0" encoding="utf-8"?>
    <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
        horizontalScrollPolicy="off"
        horizontalAlign="center" verticalAlign="middle">
        <mx:Script>
            <![CDATA[
                override public function set data(value:Object):void
                    super.data = value;
                private function onCheckBoxClick():void
                    this.data.chkBoxValue = true;
            ]]>
        </mx:Script>
        <mx:Spacer width="1" />
        <mx:CheckBox click="onCheckBoxClick()" selected="{data.chkBoxValue}"/>
        <mx:Spacer width="1" />   
    </mx:HBox>
    with Regards,
    Shardul Singh Bartwal

  • Check boxes in Data grid

    Hi,
    I have check boxes in data grid, using action script how do i get the values of check boxes that were selected ?
    Can anybody guide me here.
    <mx:DataGrid id="targetBaseAdd" width="100%" height="100%" dataProvider="
    {Application.application.ccModel.initializeBusinessUnitData.initializeBusinessUnit.baseArra y}">
     <mx:columns>
     <mx:DataGridColumn headerText="" width="20">
     <mx:itemRenderer>
     <mx:Component>
     <mx:HBox width="100%">
                    <mx:CheckBox horizontalCenter="0"/>  </mx:HBox>
     </mx:Component>
     </mx:itemRenderer>
     </mx:DataGridColumn>
     <mx:DataGridColumn headerText="Base" labelFunction="baseTargetList"/>
     </mx:columns>  
    </mx:DataGrid>
    Thank You,
    Anu.
    </mx:HBox>
     </mx:Component>
     </mx:itemRenderer>
     </mx:DataGridColumn>
     <mx:DataGridColumn headerText="Base" labelFunction="baseTargetList"/>
     </mx:columns>  
    </mx:DataGrid>
    Thank You,
    Anu.

    refer following examples:
    http://blog.flexmonkeypatches.com/2007/11/06/datagrid-checkbox-itemeditor/
    http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/Flex/Q_23237167.ht ml

  • AdvancedDatagrid headerRenderer advanced question :-)

    Hello, it;s really hard to explain my problem, but I will try
    anyway
    I have just one AdvancedDataGrid (imagine only one column)
    with a custom headerRenderer, which is just a Label, nothing more.
    The headerRenderer is actually a ClassFactory object which craeates
    that Label by calling newInstance() method, whenever Flex needs to
    create that Label object for the header, this is all clear.
    And my question is: when Flex calls the newInstance() and
    what Flex would do with the old Label object, when he creates a new
    instance?
    I am asking, because when I create this simple application,
    nothing special, Flex creates 2 Label objects for the header
    renderer. I know it because I put the 'trace' function into that
    Label. So whenever Datagrid redraws, I can see that there are two
    Label objects, both the same (the same header text), but only one
    is visible. I think, that the first Label is obsolete, because the
    second Label was created by newInstance() method, but the first one
    is still there, was not deleted nor removed from container (it was
    just moved into a AdvancedDataGridListContentHolder).
    So, both Labels are active, when datagrid redraws, both
    Labels updates, but just one is visible. so my question is why Flex
    creates two labels??
    Thanks, just for reading :-)

    I have even problem. But i create CheckBoxes.
    Here is how i implement CheckBox in my Column
    <mx:DataGridColumn dataField="maxDamage" headerText="100%
    Damage" editable="false">
    <mx:itemRenderer>
    <myComp:CheckBoxRenderer/>
    </mx:itemRenderer>
    </mx:DataGridColumn>
    And this is my CheckBoxRenderer:
    import mx.controls.CheckBox;
    import mx.controls.DataGrid;
    import mx.controls.dataGridClasses.DataGridColumn;
    import mx.core.IFactory;
    import mx.events.CollectionEvent;
    import mx.events.FlexEvent;
    public class CheckBoxRenderer implements IFactory
    public function newInstance():*
    var checkBox:CheckBox = new CheckBox();
    checkBox.addEventListener(Event.CHANGE, onChange);
    checkBox.addEventListener(FlexEvent.CREATION_COMPLETE,
    onCreationComplete);
    return checkBox;
    private function onChange(event:Event):void
    var checkBox:CheckBox = event.target as CheckBox;
    if (checkBox == null) return;
    var dataGrid:DataGrid = checkBox.owner as DataGrid;
    // Field by data objects that must be midified
    var dataField:String =
    (dataGrid.columns[checkBox.listData.columnIndex] as
    DataGridColumn).dataField;
    checkBox.data[dataField] = checkBox.selected;
    dataGrid.dataProvider.dispatchEvent(new
    CollectionEvent(CollectionEvent.COLLECTION_CHANGE));
    private function onCreationComplete(event:FlexEvent):void
    var checkBox:CheckBox = event.target as CheckBox;
    if (checkBox == null) return;
    var grid:DataGrid = checkBox.owner as DataGrid;
    if (grid == null) return;
    var dataField:String =
    (grid.columns[checkBox.listData.columnIndex] as
    DataGridColumn).dataField;
    if (dataField == null) return;
    checkBox.selected = checkBox.data[dataField];
    checkBox.dispatchEvent(new Event(Event.CHANGE));
    Can anybody tell me, how must write my CheckBoxRenderer to
    haven't unvisible itemRenderers?
    With unvisible itemRenderer i have problem with checkboxes
    and they render unright...

  • How to get selected values (using checkBox) from DataGrid in flex.

    i have a datagrid which is getting values from a XML file (getting this xml file from database using PHP and HTTP request in flex). i have created a checkbox in every row in data grid. and here is my requirement: i want to select tow or three check-box and would like to get all the values form that particular ROWs in some form , prefered arraycollection (such that i can pass this array directly to a bar chart) .. can some one help me as i am new to flex .
    code ......
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="siteData.send()">
              <mx:Script>
                        <![CDATA[
                                  import mx.collections.XMLListCollection;
                                  import mx.controls.*;
                                  import mx.events.ListEvent;
                                  import mx.rpc.events.ResultEvent;
                                  import mx.controls.Alert;
                                  [Bindable] private var fullXML:XMLList;
                                  private function contentHandler(evt:ResultEvent):void{
                                            fullXML = evt.result.values;
                        ]]>
              </mx:Script>
              <mx:VBox>
                        <mx:Label text="This Data Grid is loading the full XML file"/>
                        <mx:DataGrid width="600"  id="datagrid" dataProvider="{fullXML}">
                                  <mx:columns>
                                            <mx:DataGridColumn headerText="Select">
                                                      <mx:itemRenderer>
                                                                <mx:Component>
                                                                          <mx:HBox horizontalAlign="center">
                                                                                    <mx:CheckBox id="check"/>
                                                                          </mx:HBox>
                                                                </mx:Component>
                                                      </mx:itemRenderer>
                                            </mx:DataGridColumn>
                                            <mx:DataGridColumn dataField="release_version" headerText="Release"/>
                                            <mx:DataGridColumn dataField="build" headerText="build"/>
                                            <mx:DataGridColumn dataField="time_login" headerText="time_login"/>
                                            <mx:DataGridColumn dataField="time_tunnel" headerText="time_tunnel"/>
                                            <mx:DataGridColumn dataField="rate_login" headerText="time_tunnel"/>
                                            <mx:DataGridColumn dataField="rate_tunnel" headerText="rate_tunnel"/>
                                  </mx:columns>
                        </mx:DataGrid>
              </mx:VBox>
              <mx:HTTPService url="http://localhost/php_genxml.php" id="siteData" result="contentHandler(event)" resultFormat="e4x"/>
    </mx:Application>
    as you can see in the image , i will get this datgrid . now i want to select two or three checkboxes and would like to get all the values form the perticular row (for which check box is selected). i would like to get in array from such that i can driectly pass them to bar chart....
    can some one help me in this. as i m new to flex. or if you have some other suggestion ...My final requirement is: select some values and generate bar gharph for those values.
    please help me in this.
    thanks
    tanuj

    Hi Timo -
    Thanks for the suggestion. I could get the values as below:
    public void multiOpUnitValChange(ValueChangeEvent valueChangeEvent) {
    // Add event code here...
    BindingContainer bindings = BindingContext.getCurrent().getCurrentBindingsEntry();
    DCIteratorBinding opUnitIter = (DCIteratorBinding)bindings.get("OperatingUnit2VOIterator");
    Integer[] values = (Integer[])valueChangeEvent.getNewValue();
    for (int i=0; i<values.length; i++){
    Row row = opUnitIter.getRowAtRangeIndex(i);
    System.out.println(row.getAttribute("OpUnitId"));
    Thanks -
    Rohit

Maybe you are looking for

  • CommandLink and js:confirm

    hi, i meet some problem with commandLink and js. jsf code: <h:commandLink value="Del" onclick="return delconfirm();" action="#{userAdminBean.userDel}" >                                         <f:param name="userId" value="#{info.uid}"/>             

  • Flash Builder 4.7 + OSX 10.10 Yosemite + File Dialogue Box = CRASH :-(

    Problem Description: When attempting to use a Flash Builder File Dialogue Box under OSX 10.10 Yosemite will immediately crash the application. This bug essentially now renders Flash Builder 100% useless! Steps to Reproduce: 1. Open Flash Builder 4.7

  • Import file to SAP system switch to SAP XI scenario

    Hi, we have scenario: download data from 3rd party system to the file and later on import this file to the SAP EPR system. What possiblity we have when we want to use SAP XI? Only create new RFC functions to be able upload files? Or it is possible to

  • Bapi or FM to read data for inspection lot

    Hi Experts I need bapi or FM that will read all specifications and result value for entered inspection lot the data that we also got in transaction qa13 I need exactly that data Thanks Taran

  • I need help get setup and started

    I have a Imac and Logic 8 and Iam using a Firepod interface. I want to get set up to record and I have no idea where to start. Want to record my own drums, guitar,bass and vocals so on is their a way to create a templete any help is need Thanks