3 Replies Latest reply on Jan 6, 2010 12:35 PM by iamfuric

    datagrid and checkbox renderer

    BosDog Level 1

      I'm looking to have a datagrid have a dataprovider from a coldfusion remote object in which i want to save a boolean value for checkboxes. i want the user to be able to select and deselect checked items and submit to a back end DB where their changes are saved.

       

      Then on load I want the checkbox value to be selected or deselected based on their previously saved prefs. Checkbox item renderers are a re-occuring problem for me. There seems to be so many ways to implement them and so far using online examples they don't show how to save results to a DB and reload them based on a DB. please help

       

      code i'm currently trying to use (where ITEM_TYPE is a DB value of true or false) and the getCheckList.lastResult is made up of 7 rows with ITEM_TYPE and DESCRIPTION (the checkbox description for the user):

       

       

       

      <mx:DataGrid id="myDG"

      dataProvider="

      {parentApplication.ATService.getCheckList.lastResult}"

      variableRowHeight="

      true"

      width="

      500" height="250"

      editable="

      true">

       

       

      <mx:columns>

       

       

      <mx:DataGridColumn textAlign="center" width="25" dataField="ITEM_TYPE"

      itemRenderer="

      mx.controls.CheckBox"

      rendererIsEditor="

      true"

      editorDataField="

      selected"/>

       

       

      <mx:DataGridColumn dataField="DESCRIPTION" />

       

       

      </mx:columns >

       

       

      </mx:DataGrid>

        • 2. Re: datagrid and checkbox renderer
          BosDog Level 1

          I tried that Blog. It doesn't show how to preload from a database the checked or unchecked values. I did figure it out on my own though after some hard work. Using the <mx:Component> tag is nice... but i found it can't reference anything in the component its in b/c anything under <mx:Componenet> is not of the same class. trick here is to add the parentDocument. prefix and you call anything you want. also found that a DB string value (or varchar) of "true" or "false" is not recognized as boolean by flex. So to check or uncheck based on a DB result set from a CF componenet you need to actually check the value. I've attached my sample code for anyone else having trouble with this:

           

           

           

          <mx:DataGrid id="chkListDG" dataProvider="{parentApplication.ATService.getCheckList.lastResult}"

          width="

          100%" height="100%">

           

           

          <mx:columns>

           

           

          <mx:DataGridColumn textAlign="center" headerText="" dataField="CHKLIST_ID" width="30">

           

           

          <mx:itemRenderer>

           

           

          <mx:Component>

           

           

          <mx:CheckBox selected="{data.CHK_STATUS == 'true'}" click="dbChange()">

           

           

          <mx:Script>

          <![CDATA[

           

           

          import mx.controls.Alert;

           

          private function dbChange():void{

           

          if (parentDocument.chkListDG.selectedItem.CHK_STATUS == 'false'){

          parentDocument.chkListDG.selectedItem.CHK_STATUS =

          'true'

          }

           

          else{

          parentDocument.chkListDG.selectedItem.CHK_STATUS =

          'false'

          };

          parentApplication.ATService.chkListSave(parentDocument.chkListDG.selectedItem.CHKLIST_ID,p arentDocument.chkListDG.selectedItem.CHK_STATUS);

          }

          ]]>

           

          </mx:Script>

           

          </mx:CheckBox>

           

          </mx:Component>

           

          </mx:itemRenderer>

           

          </mx:DataGridColumn>

           

          <mx:DataGridColumn headerText="Description" dataField="DESCRIPTION"/>

           

          <mx:DataGridColumn headerText="Value" dataField="CHK_STATUS"/>

           

          </mx:columns>

           

          </mx:DataGrid>

          • 3. Re: datagrid and checkbox renderer
            iamfuric Level 2

            This will do the same:

             

             

            <mx:itemRenderer>

            <mx:Component>

             

            <mx:CheckBox selected="{data.CHK_STATUS == 'true'}" click="data.CHK_STATUS=selected?'true':'false';parentApplication.ATService.chkListSave(da ta.CH KLIST_ID,selected);"/>

             

             

             

            </mx:Component>

             

            </mx:itemRenderer>