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:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
              <!-- Place non-visual elements (e.g., services, value objects) here -->
                  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:Binding source="dg.selectedItems" destination="secondArray" />
          <mx:DataGrid id="dg" dataProvider="{ac}" x="10" y="10" width="596" height="356" allowMultipleSelection="true">
                  <mx:DataGridColumn headerText="Name" dataField="Name"/>
                  <mx:DataGridColumn headerText="Score" dataField="Score" width="50"/>
                  <mx:DataGridColumn headerText="Rating" dataField="Rating" width="100"/>
          <mx:DataGrid x="10" y="374" width="596" dataProvider="{secondArray}" height="142">
                  <mx:DataGridColumn headerText="Name" dataField="Name"/>
                  <mx:DataGridColumn headerText="Score" dataField="Score"/>
                  <mx:DataGridColumn headerText="Rating" dataField="Rating"/>



      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



            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">
                        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
                                //Remove the last added item (disable adding new ones)
                                list.selectedItems = arr;


                <mx:List id="list" allowMultipleSelection="true" change="list1_changeHandler(event)" width="100" x="100">
                                <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" />