Coolite 中前台获取 GridPanel 当前选择行值的代码

主要目的

a. 掌握获取 GridPanel 当前行的各个字段值的方法

b. 掌握如何将前台数据传递到后台，并将后台操作结果返回到前台

c. 掌握如何获取和设置 button 和 textField 控件的文本值

主要内容

a. 我们先在页面中添加三个 ext 组件：store, menu,gridpanel

b. 将 gridpanel 的contextmenuID 设置为　menu 控件的ID, 从而为GridPanel 添加右键菜单

复制代码代码如下:

<ext:Store ID="Store1" runat="server"

onbeforestorechanged="Store1_BeforeStoreChanged" >

<Reader>

<ext:JsonReader ReaderID="id" >

<Fields >

<ext:RecordField Name="id" Type="Int"></ext:RecordField>

<ext:RecordField Name="uid" Type="String"></ext:RecordField>

<ext:RecordField Name="uname" Type="String"></ext:RecordField>

<ext:RecordField Name="uage" Type="Int"></ext:RecordField>

</Fields>

</ext:JsonReader>

</Reader>

</ext:Store>

此处的 ReaderID 可以不设置，设置了的话，就可以使用方法 GridPanel1.getSelectionModel().getSelected().id 来获取该行 id 字段所对应的值。

使用该方法的前提是在GridPanel 中设置其选择方式为行选择模式，代码会在后面贴出。Name 对应于数据库表中的字段名。

复制代码代码如下:

<ext:Menu ID="Menu1" runat="server">

<Items>

<ext:MenuItem ID="MenuItem1" runat="server" Text="查看用户信息">

<Listeners>

<Click Fn="ShowUserInfo" />

</Listeners>

</ext:MenuItem>

<ext:MenuItem ID="MenuItem2" runat="server" Text="修改用户信息">

<Listeners>

<Click Fn="ShowUserInfo" />

</Listeners>

</ext:MenuItem>

<ext:MenuItem ID="MenuItem3" runat="server" Text="添加用户信息">

<Listeners>

<Click Fn="ShowUserInfo" />

</Listeners>

</ext:MenuItem>

<ext:MenuItem ID="MenuItem4" runat="server" Text="删除用户信息">

<Listeners>

<Click Fn="DeleteUserInfo" />

</Listeners>

</ext:MenuItem>

</Items>

</ext:Menu>

效果如下：

c. 将 gridPanel 的 storeID 设为 store 控件的 ID, 为 Gridpanel 添加数据源

GridPanel 源码如下：

复制代码代码如下:

<ext:GridPanel ID="GridPanel1" runat="server" ContextMenuID="Menu1" AutoHeight="true" Width="400px"

AutoDataBind="true" StoreID="Store1">

<ColumnModel ID="ctl10">

<Columns>

<ext:Column DataIndex="id" Header="用户编号">

<PrepareCommand Args="grid, record, rowIndex, columnIndex, value" />

</ext:Column>