Ext.Net开发_GridPanel行选中取值

项目中常用到GridPanel,单击(双击)一行数据后展示一些数据,打开新页面……这些功能都可以实现。只要获取单击(双击)时行的主键ID,即可!

 

Ext.Net中常见的单击(双击)取值 有一下几种:

 

一 、   注意(record.data.BI_Seq) 中的BI_Seq是该GridPanel主键。如果ColumnModel中无,则取不到值               

数据源Store 别忘了 添加属性 IDProperty="BI_Seq"

 

 

<ext:Store ID="stProduct" runat="server">
<Reader>
<ext:JsonReader IDProperty="BI_Seq">
<Fields>
<ext:RecordField Name="BI_Seq" Type="Int" />
<ext:RecordField Name="BI_ShopId" Type="Int" />
<ext:RecordField Name="NC_ShopName" Type="String" />
<ext:RecordField Name="BI_ClassId" Type="String" />
……
……
……
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>



       

      

js:

  function ProductSelelct(id)
  {
    alert(id);
  }

<ColumnModel>
<Columns>
<ext:Column Header="商品ID" Width="100" DataIndex="BI_Seq" /> //BI_Seq 主键ID必须有,否则下面函数娶不到值
<ext:Column Header="商品名称" Width="100" DataIndex="NC_ProductName" />
<ext:Column Header="拼音缩写" Width="100" DataIndex="NC_Abbreviation" />
<ext:Column Header="商品编码" Width="100" DataIndex="NC_ProductNameCode" />
<ext:Column Header="商品销售单价" Width="100" DataIndex="N_Price" />
<ext:Column Header="平台编码" Width="100" DataIndex="NC_ProductSkuCode" />
<ext:Column Header="商品第一属性名称" Width="100" DataIndex="NC_FirstAttributeName" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel2" runat="server">
<Listeners>
<RowSelect Handler="ProductSelelct(record.data.BI_Seq);" />
</Listeners>
</ext:RowSelectionModel>
</SelectionModel>

 效果:

Ext.Net开发_GridPanel行选中取值_第1张图片

 

方法二、直接看代码即会明白……

 <SelectionModel>
<ext:RowSelectionModel runat="server" SingleSelect="true">
<DirectEvents>
<RowSelect OnEvent="RowSelect" Buffer="100">
<EventMask ShowMask="true" Target="CustomTarget" CustomTarget="#{fpnProductDetail}" />
<ExtraParams>
<ext:Parameter Name="ProductSkuId" Value="this.getSelected().id" Mode="Raw" />
</ExtraParams>
</RowSelect>
</DirectEvents>
</ext:RowSelectionModel>
</SelectionModel>
 
 

protected void RowSelect(object sender, DirectEventArgs e)
{
  string productSkuId = e.ExtraParams["ProductSkuId"];

}

效果:

Ext.Net开发_GridPanel行选中取值_第2张图片

 

3  返回数据Json格式,但不影响取值。换成CheckboxSelectModel 同样可以实现功能,具体见代码……

 <SelectionModel>
<ext:CheckboxSelectionModel ID="RowSelectionModel2" runat="server">
<DirectEvents>
<RowSelect OnEvent="RowSelect" Buffer="100">
<ExtraParams>
<ext:Parameter Name="ProductSkuId" Value="Ext.encode(#{gpOnLineProduct}.getRowsValues({selectedOnly:true}))"
Mode="Raw" />
</ExtraParams>
<EventMask ShowMask="true" Msg="数据正在生成,请稍候..." MinDelay="200" />
</RowSelect>
</DirectEvents>
</ext:CheckboxSelectionModel>
</SelectionModel>
 
     /// <summary>
/// 行选择
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void RowSelect(object sender, DirectEventArgs e)
{
RowSelectionModel sm = gpOnLineProduct.SelectionModel.Primary as RowSelectionModel;
string source = string.Empty;
foreach (SelectedRow item in sm.SelectedRows)
{
source += item.RecordID + "~";
}
Message.ShowAlert("提示", source);
}

 

效果同样精彩:

Ext.Net开发_GridPanel行选中取值_第3张图片

 

                     

Ext.Net 功能很丰富,上面两点,经本人测试。如果放在拖拽窗口中,取值会出现问题    ……

如果批量取值,会出现问题

Ext.Net开发_GridPanel行选中取值_第4张图片

原因猜测:

因拖拽,选中了一行,则要求你拖拽后才可以单击再选择……

 

 

具体   继续     ……          

 

 

 

 

Ext.Net开发_GridPanel行选中取值_第5张图片

                        


作者:PEPE
出处:http://pepe.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

你可能感兴趣的:(gridPanel)