[CLOSED] Unable to preselect grid rows from code behind.

[Sowjanya]

Hi,

I have a page where I use a grid panel on the left. On selecting a row on this gridpanel, the form that is located at the right side of this page is populated with corresponding details ( details respective to the grid row ID selected on the left side.)

So, when ever i change the selection of rows on left grid, the right form would change accordingly with respective details.

In that case, I have a small grid on the right form panel. this grid is loaded with data on this page load.

On row select event of the left grid, on the code behind, I am calling a service to get the data. based on this data, I am trying to preselect the rows on the small grid thats on the right side, and displaying it on the screen. HERE is where the error occurs. on the screen, i am unable to see the selected rows. the rows that i preselected using the IDs in the code behind are not showing as selected.

code is as follows:
----------------------

Left grid panel:
==========



  <ext:FormPanel ID="FormPanelLeft" runat="server" ButtonAlign="left"
                Frame="true" Layout="VBoxLayout" Flex="1">
               
                <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Stretch"/>
                </LayoutConfig>
                <Items>

              


                  <ext:GridPanel 
            ID="ProjectPanel" 
            runat="server" 
            Title="Museum Projects"
            Frame="true"
            Flex="1" AutoScroll="true" Margins="10 10 10 10">
          
                            
                 <Store>
    <ext:Store runat="server" ID="MuseumProjectStore" AutoLoad="true">
        <Proxy>
            <ext:AjaxProxy Json="true" Url='<%#ProjectsUrl%>' AutoDataBind="true" >
                <ActionMethods Read="POST" Create="POST"/>     
                                 <Headers>
                                 
                                 <ext:Parameter Name="Accept" Value="application/json" />
                                 <ext:Parameter Name="Content-Type" Value="application/json" />
                                 

                                 </Headers>                       
                            <Reader>
                                <ext:JsonReader Root=""/>
                            </Reader>
                            <Writer>
                            <ext:JsonWriter Root="" Encode="true"/>                            
                            </Writer>
            </ext:AjaxProxy>
        </Proxy>
        <Model>
            <ext:Model ID="Model1" runat="server">
                <Fields>
                    <ext:ModelField Name="PROJECT_ID" Type="Int" />
                    <ext:ModelField Name="PROJECT_NAME" Type="String" />
                    <ext:ModelField Name="PROJECT_DESC" Type="String" />                   
                    <ext:ModelField Name="START_DATE" Type="String" />
                    <ext:ModelField Name="END_DATE" Type="String" />
                     <ext:ModelField Name="CONTACT_SID" Type="String" />
                     <ext:ModelField Name="CONTACT_NAME" Type="String" />                    
                    <ext:ModelField Name="CLARITY_ID" Type="String" />
                    <ext:ModelField Name="CLARITY_PROJECT" Type="String" />
                    <ext:ModelField Name="PROGRAM_NAME" Type="String" />
                    <ext:ModelField Name="PROGRAM_ID" Type="String" />
                   
                </Fields>
            </ext:Model>
        </Model>
    </ext:Store>

    </Store>

                 <ColumnModel ID="ColumnModel1" runat="server">
                        <Columns>
.
.
.
.
..
   <SelectionModel>
                        <ext:RowSelectionModel runat="server" ID="MuseumProjectGridSelection" Mode="Single">
                       
                            <DirectEvents>
                                <Select OnEvent="ProjectSelect">
                                    <EventMask ShowMask="true" Target="CustomTarget" CustomTarget="#{ProjectForm}" />
                                    <ExtraParams>
                                        <ext:Parameter Name="jsonRecord" Value="Ext.encode(#{ProjectPanel}.getRowsValues({selectedOnly:true}))"
                                            Mode="Raw" />
                                    </ExtraParams>
                                </Select>
                            </DirectEvents>
                        </ext:RowSelectionModel>
                    </SelectionModel>
 </ext:GridPanel>  


        </Items>

              </ext:FormPanel>


Right Form panel:
============

 <ext:FormPanel ID="FormPanelRight" runat="server" ButtonAlign="left"
                Frame="true" Layout="VBoxLayout" Flex="1" AutoScroll="true">
               
                <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Stretch"/>
                </LayoutConfig>
                <Items>
.
.
.
.

<ext:GridPanel runat="server" ID="grdRepPrograms" Height="110" Width="400" ForceFit="true" MultiSelect="true" HideHeaders="true" SortableColumns="false" AutoScroll="true" >
                                 <Store>

                                
      <ext:Store ID="StoreRepPrograms" runat="server" AutoLoad="true">
                                    <Proxy>
            <ext:AjaxProxy Json="true" Url='<%#RepProgramsUrl%>' AutoDataBind="true" >
                <ActionMethods Read="POST" Create="POST"/>     
                                 <Headers>
                                 
                                 <ext:Parameter Name="Accept" Value="application/json" />
                                 <ext:Parameter Name="Content-Type" Value="application/json" />
                                 

                                 </Headers>                       
                            <Reader>
                                <ext:JsonReader Root=""/>
                            </Reader>
                            <Writer>
                            <ext:JsonWriter Root="" Encode="true"/>                            
                            </Writer>
                            
                              
            </ext:AjaxProxy>
        </Proxy>
                                        <Model>
                                            <ext:Model ID="Model5" runat="server">
                                                <Fields>
                                                 <ext:ModelField Name="REP_PROGRAM_ID" Type="String"/>
                                                    <ext:ModelField Name="REP_PROGRAM_NAME" Type="String"/>
                                                    
                                                </Fields>
                                            </ext:Model>
                                        </Model>
                                        
                                    </ext:Store>

                                    
                                    
                                  
                                </Store>
                                 <ColumnModel ID="ColumnModel2" runat="server">
                        <Columns>
                            <ext:Column ID="Column8" runat="server" Text="Reporting Program Name" Width="150" DataIndex="REP_PROGRAM_NAME"/>    
                                     </Columns>
                                     </ColumnModel>
                                

                                <SelectionModel>
                                <ext:CheckboxSelectionModel ID="RepProgramsSelectModel" runat="server" ShowHeaderCheckbox="false" Mode="Multi">
                                
                                
                                </ext:CheckboxSelectionModel> 
                                </SelectionModel>
                              </ext:GridPanel>

</Items>
  </ext:FormPanel>   


Left grid panel row select event:
=====================


 protected void ProjectSelect(object sender, DirectEventArgs e) // use this for populatg prj form if prj grid row is selected.
        {
  .
.
.
.
 string response = executePost(MuseumProject, "MuseumProjects?RepPrograms="+true+"&ProjectID=" + PROJECT_ID, out respond, true);

            if (!respond)
                return;

            Dictionary<string, string>[] grid1Data = JSON.Deserialize<Dictionary<string, string>[]>(response);
            CheckboxSelectionModel sm = this.grdRepPrograms.SelectionModel.Primary as CheckboxSelectionModel;

 if (grid1Data.Count() > 0)
            {
               
              
                    foreach (var record in grid1Data)
                    {
                        repProgramID = (record["REP_PROGRAM_ID"]);

                     
            //RepProgramsSelectModel.SelectedRows.Add(new SelectedRow(repProgramID));
                        sm.SelectedRows.Add(new SelectedRow(repProgramID));
                        //this.RepProgramsSelectModel.Select(new SelectedRow(repProgramID));
                        sm.UpdateSelection();



                    }

                    
                }


}

The attached screenshot shows the small grid - Museum reporting Programs that is on right side. It is where I want the line items "abcdefgh" and "New prgm" to be selected, on project select event.

pls help me resolve this.

[Baidaly]

Hello!

You have to provide IDProperty for your model:

<ext:Model runat="server" ID="Model5" IDProperty="REP_PROGRAM_ID">

And also, it's not clear, what type has variable repProgramID, is it string or int?

[Sowjanya]

Hello!

You have to provide IDProperty for your model:

<ext:Model runat="server" ID="Model5" IDProperty="REP_PROGRAM_ID">

And also, it's not clear, what type has variable repProgramID, is it string or int?

Hi Baidaly,

I tried and it works, ok...now the problem is that it remembers previous selections.....I am using sm.UpdateSelection();

say, i select first row in the left grid, the museumreporting programs grid on the right is selecting its current items -> which is fine.
Now, when i select second row on left grid, museumreporting programs grid on the right is selecting its current items + the items selected previously


I tried all these, but did not work:
======================

 this.grdRepPrograms.GetStore().RemoveAll();
            grdRepPrograms.Call("getStore().removeAll");
            this.RepProgramsSelectModel.ClearSelection();
            X.Js.Call("ClearGridSelection");

            this.StoreRepPrograms.Reload(new Ext.Net.ParameterCollection()
                {
                    new Ext.Net.Parameter("ProjectID","")

                });

            this.grdRepPrograms.GetStore().RemoveAll();
            grdRepPrograms.Call("getStore().removeAll");
            this.RepProgramsSelectModel.ClearSelection();
            X.Js.Call("ClearGridSelection");
            this.RepProgramsSelectModel.UpdateSelection();
            this.grdRepPrograms.Call("clearMemory");
            this.grdRepPrograms.SelectionMemory = false;
      this.RepProgramsSelectModel.DeselectAll();           

            grdRepPrograms.AddScript("{0}.getSelectionModel().clearSelections();", grdRepPrograms.ClientID);

And btw, the variable - repProgramID is of type int. I also modified the places where this variable is used, to int and tried again, still did not work. :(

[Baidaly]

At first, you don't need selection memory so SelectionMemory should be to false in the markup.

Secondly, try to replcae this code:

this.RepProgramsSelectModel.ClearSelection();

with

this.grdRepPrograms.GetSelectionModel() as RowSelectionModel.ClearSelection();

If it doesn't help, remove all code from this method and leave only calling the previous line of code and investigate the response from the server using FireBug or Chrome.

[Sowjanya]

At first, you don't need selection memory so SelectionMemory should be to false in the markup.

Secondly, try to replcae this code:

this.RepProgramsSelectModel.ClearSelection();

with

this.grdRepPrograms.GetSelectionModel() as RowSelectionModel.ClearSelection();

If it doesn't help, remove all code from this method and leave only calling the previous line of code and investigate the response from the server using FireBug or Chrome.

But, why is this behaving like this? ideally, clearselection() should remove previous selections right ?
Also, where exactly i need to set SelectionMemory=false? - coz I am not finding a property by that name for selectionmodel control.

[Daniil]

Hi everybody,

A RowSelectionModel's SelectedRows is also used for submitted selection from client. So, it contains the current selection.

Please try:

sm.SelectedRows.Clear();
sm.SelectedRows.Add(...);
sm.UpdateSelection();

where "sm" is a RowSelectionModel instance.

As for SelectionMemory. It is a GridPanel's property. Though, I doubt it is the reason of the current problem.

[Sowjanya]

Hi everybody,

A RowSelectionModel's SelectedRows is also used for submitted selection from client. So, it contains the current selection.

Please try:

sm.SelectedRows.Clear();
sm.SelectedRows.Add(...);
sm.UpdateSelection();

where "sm" is a RowSelectionModel instance.

As for SelectionMemory. It is a GridPanel's property. Though, I doubt it is the reason of the current problem.

Cool ! the solution worked like a charm !!
You can mark this thread as closed ...

Thanks,
Veda