2 Replies Latest reply on Oct 5, 2010 7:46 AM by George I Flex

    Datagrid, selection setting a maximum

    djh88ukwb Level 1

      Hello all.

       

      Is it at all possible to set a maximum to the number of selections a user can make when using the allowMultipleSelection of a datagrid?

       

      Here is my code -

       

      <?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>
              <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
         
          <fx:Script>
              <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.events.ListEvent;
                  import mx.collections.ArrayCollection;
                  import mx.controls.Alert;
                  import mx.events.FlexEvent;
                  import mx.events.ItemClickEvent;
                  import mx.events.ListEvent;
                  import mx.managers.PopUpManager;
                  import mx.rpc.events.FaultEvent;
                  import mx.rpc.events.ResultEvent;
                 
                  import spark.events.IndexChangeEvent;
                  import spark.events.TextOperationEvent;
                 
                  [Bindable] public var i:int=0;
                  [Bindable] public var za:int=0;
                  [Bindable] public var secondArray:Array;

                  [Bindable] private var ac:ArrayCollection=new ArrayCollection([
                      {ID: "1", Name: "John", Score:"25", Rating:"3", sel: false},
                      {ID: "2", Name: "Joe", Score:"45", Rating:"5", sel: false},
                      {ID: "3", Name: "Bob", Score:"27", Rating:"2", sel: false},
                      {ID: "4", Name: "Dave", Score:"37", Rating:"4", sel: false},
                      {ID: "5", Name: "Tom", Score:"21", Rating:"3", sel: false},
                      {ID: "6", Name: "Dan", Score:"39", Rating:"2", sel: false},
                      {ID: "7", Name: "Jack", Score:"47", Rating:"5", sel: false},
                      {ID: "8", Name: "Jill", Score:"35", Rating:"2", sel: false}])



              ]]>
          </fx:Script>
         
          <fx:Binding source="dg.selectedItems" destination="secondArray" />
         
          <mx:DataGrid id="dg" dataProvider="{ac}" x="10" y="10" width="596" height="356" allowMultipleSelection="true">
              <mx:columns>
                  <mx:DataGridColumn headerText="Name" dataField="Name"/>
                  <mx:DataGridColumn headerText="Score" dataField="Score" width="50"/>
                  <mx:DataGridColumn headerText="Rating" dataField="Rating" width="100"/>
              </mx:columns>
          </mx:DataGrid>
         
          <mx:DataGrid x="10" y="374" width="596" dataProvider="{secondArray}" height="142">
              <mx:columns>
                  <mx:DataGridColumn headerText="Name" dataField="Name"/>
                  <mx:DataGridColumn headerText="Score" dataField="Score"/>
                  <mx:DataGridColumn headerText="Rating" dataField="Rating"/>
              </mx:columns>
          </mx:DataGrid>

      </s:Application>

       

      What i have it doing is as follows - you can select a number of records from the top datagrid and they get bound to the second datagrid, so i can then use the selected records later on in the application i am creating.

       

      What i want thou is to limit the number of records that the secondArray will hold to 4.

       

      So in all, i want to limit the number of records loaded into the secondArray to 4.

       

      If anyone could help that would be great thanks

        • 1. Re: Datagrid, selection setting a maximum
          Flex harUI Adobe Employee

          What user experience do you want?  Last 4 clicked, or can't click anything

          after four?

          • 2. Re: Datagrid, selection setting a maximum
            George I Flex Level 1

            Hi,

             

            Look below. Unfortunatelly there is no Changing event that you can cancel of the DataGrid, so the only thing to do is to remove last element once it reaches over 4 in length.

             

            <?xml version="1.0" encoding="utf-8"?>
            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600">
                <mx:Script>
                    <![CDATA[
                        import mx.events.ListEvent;
                       
                        protected function list1_changeHandler(event:ListEvent):void {
                            if (list.selectedItems.length > 4)
                            {
                                var arr:Array = list.selectedItems;
                                //Remove the first added item
                                //arr.pop();
                                //Remove the last added item (disable adding new ones)
                                arr.shift();
                                list.selectedItems = arr;
                            }
                        }

             

                    ]]>
                </mx:Script>
                <mx:List id="list" allowMultipleSelection="true" change="list1_changeHandler(event)" width="100" x="100">
                        <mx:dataProvider>
                            <mx:ArrayCollection>
                                <mx:Object label="Abc 1" data="abc 1" />
                                <mx:Object label="Abc 2" data="abc 2" />
                                <mx:Object label="Abc 3" data="abc 3" />
                                <mx:Object label="Abc 4" data="abc 4" />
                                <mx:Object label="Abc 5" data="abc 5" />
                                <mx:Object label="Abc 6" data="abc 6" />
                                <mx:Object label="Abc 7" data="abc 7" />
                                <mx:Object label="Abc 8" data="abc 8" />
                            </mx:ArrayCollection>
                        </mx:dataProvider>
                    </mx:List>
            </mx:Application>