EXT.NET: how to render only a subset of a store into a grid?

Question

So here's the deal: I have two grids bound to the following stores:

        <ext:Store ID="storeProjects" runat="server" UseIdConfirmation="true">
            <Reader>
                <ext:JsonReader IDProperty="idProject" >
                    <Fields>
                        <ext:RecordField Name="idProject" Type="Int" />
                        <ext:RecordField Name="nmProject" Type="String" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>

        <ext:Store ID="storeProjectHistory" runat="server" UseIdConfirmation="true" >
            <Reader>
                <ext:JsonReader IDProperty="cdProject">
                    <Fields>
                        <ext:RecordField Name="cdProject" Type="Int" />
                        <ext:RecordField Name="nmProject" Type="String" />                             
                        <ext:RecordField Name="csStatus" Type="String" />                        
                        <ext:RecordField Name="dsDescription" Type="String" />
                        <ext:RecordField Name="dtChange" Type="Auto" DateFormat="MM/yyyy" />                              
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store> 

They are "linked" (at least in theory) by having idProject in the first store equals cdProject in the second store.

On to the grids. Whenever I click a row in the first grid (bound to storeProjects), I'd like to only partially fill the second grid with the history of the selected project - in other words, a subset of storeProjectHistory where cdProject = selected idProject from the first grid - and not with the whole storeProjectHistory data.

The whole click one grid to fill another works fine with Javascript, but like I said before, it uses the whole store and I only want data of a project in particular.

I had previously made a huge mess with a ton of Javascript and it worked somehow, but I rewrote the whole code in order to make it cleaner and now I'm stuck at this particular point. I figure that I can use some grid properties and much less javascript I previously used to achieve what I want, but I can't quite figure out how. Help, please?

BTW: That's a simplified example, so don't mind fields that apparently don't make sense.

Answer 1

inside the grid u should use selection model first.(this is the firts grid that triger the fill event of the the second grid)

something like this

  <SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel2" runat="server" Mode="Single">
                                    <DirectEvents>
                                        <Select OnEvent="RowSelect_Triger" Buffer="250">
                                            <ExtraParams>
 <%how many parameter u need decribe here-%>
      <ext:Parameter Name="Id" Value="record.data.Id" Mode="Raw" />
                                            </ExtraParams>
                                        </Select>
                                    </DirectEvents>
                                </ext:RowSelectionModel>
                            </SelectionModel>

later from the codebehind get the parameter (in this case id),and load the second grid depents on the this id.

 int Id = int.Parse(e.ExtraParams["Id"]);