PDA

View Full Version : [CLOSED] GridPanel with CheckboxSelectionModel getting selected records issue



Leonid_Veriga
Sep 13, 2012, 2:52 PM
Hi!
I have GridPanel with CheckboxSelectionModel and local paging. How can I get all selected records on all pages? CheckboxModel.getSelection( ) returns only selected records for active page.

<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
[DirectMethod]
public object BindData(string action, Dictionary<string, object> extraParams)
{
var data = Ext.Net.Examples.Northwind.Employee.GetAll();
int total = data.Count;

return new { data, total };
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>GridPanel</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
var fullName = function (value, metadata, record, rowIndex, colIndex, store) {
return "<b>" + record.data.LastName + " " + record.data.FirstName + "</b>";
};

var getSelectedRecords = function (sm, label) {
label.setText("Total selected: " + sm.getSelection().length);
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:GridPanel
runat="server"
ID="GridPanel1"
Title="Employees"
Frame="true"
Height="300">
<Store>
<ext:Store
ID="Store1"
runat="server"
RemoteSort="false"
RemotePaging="false"
PageSize="3" GroupField="Country">
<AutoLoadParams>
<ext:Parameter Name="start" Value="0" Mode="Raw" />
<ext:Parameter Name="limit" Value="3" Mode="Raw" />
</AutoLoadParams>
<Proxy>
<ext:PageProxy DirectFn="App.direct.BindData" />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="EmployeeID" >
<Fields>
<ext:ModelField Name="FirstName" />
<ext:ModelField Name="LastName" />
<ext:ModelField Name="Title" />
<ext:ModelField Name="TitleOfCourtesy" />
<ext:ModelField Name="BirthDate" Type="Date" />
<ext:ModelField Name="HireDate" Type="Date" />
<ext:ModelField Name="Address" />
<ext:ModelField Name="City" />
<ext:ModelField Name="Region" />
<ext:ModelField Name="PostalCode" />
<ext:ModelField Name="Country" />
<ext:ModelField Name="HomePhone" />
<ext:ModelField Name="Extension" />
<ext:ModelField Name="Notes" />
</Fields>
</ext:Model>
</Model>
<Sorters>
<ext:DataSorter Property="LastName" Direction="ASC" />
</Sorters>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="Full Name" Width="150" DataIndex="LastName">
<Renderer Fn="fullName" />
</ext:Column>
<ext:Column runat="server" DataIndex="Title" Text="Title" Width="150" />
<ext:Column runat="server" DataIndex="TitleOfCourtesy" Text="Title Of Courtesy" Width="150" />
<ext:DateColumn runat="server" DataIndex="BirthDate" Text="BirthDate" Width="110" Format="yyyy-MM-dd" />
<ext:DateColumn runat="server" DataIndex="HireDate" Text="HireDate" Width="110" Format="yyyy-MM-dd" />
<ext:Column runat="server" DataIndex="Address" Text="Address" Width="150" />
<ext:Column runat="server" DataIndex="City" Text="City" Width="100" />
<ext:Column runat="server" DataIndex="Region" Text="Region" Width="100" />
<ext:Column runat="server" DataIndex="PostalCode" Text="PostalCode" Width="100" />
<ext:Column runat="server" DataIndex="Country" Text="Country" Width="100" />
<ext:Column runat="server" DataIndex="HomePhone" Text="HomePhone" Width="150" />
<ext:Column runat="server" DataIndex="Extension" Text="Extension" Width="100" />
</Columns>
</ColumnModel>
<View>
<ext:GridView runat="server">
<GetRowClass Handler="return 'x-grid-row-expanded';" />
</ext:GridView>
</View>
<SelectionModel>
<ext:CheckboxSelectionModel ID="SelectionModel1" runat="server" />
</SelectionModel>
<Features>
<ext:Grouping ID="Grouping1" runat="server" />
</Features>
<BottomBar>
<ext:PagingToolbar
runat="server"
DisplayInfo="true"
DisplayMsg="Displaying employees {0} - {1} of {2}"
EmptyMsg="No employees to display"
/>
</BottomBar>
<Buttons>
<ext:Button ID="Button2" runat="server" Text="Get Selected Count">
<Listeners>
<Click Handler="getSelectedRecords(#{SelectionModel1},#{Label1});" />
</Listeners>

</ext:Button>
</Buttons>
</ext:GridPanel>
<div style="width:590px; border:1px solid gray; padding:5px;">
<ext:Label ID="Label1" runat="server" />
</div>
</form>
</body>
</html>

Daniil
Sep 13, 2012, 5:40 PM
Hi,

The selection through all pages is stored here:

App.GridPanel1.getSelectionMemory().selectedIds
in the following format:

{
someRecordId1 : {
id : "someRecordId1",
index : 1
},
someRecordId2 : {
id : "someRecordId2",
index : 10
}
}

You can use it.

Leonid_Veriga
Sep 14, 2012, 6:30 AM
It works. Thank you!