PDA

View Full Version : [CLOSED] Gridpanel component Column in CodeBehind



ebeker
Nov 07, 2013, 3:04 PM
I have a component column in my gridpanel and a textfield in that component column. When i fire my event button i am getting the selected row(s) values in code behind with the fallowing method.

My Question is how can i get the textfield's text value in code behind for the selected rows.


Public Sub SaveGrid()
Dim sm As Ext.Net.RowSelectionModel = TryCast(gpanel1.SelectionModel.Primary, Ext.Net.RowSelectionModel)
Dim selectedRecordID As Integer
For Each row As Ext.Net.SelectedRow In sm.SelectedRows
selectedRecordID = row.RecordID

i

Next

End Sub


<ext:GridPanel runat="server" ID="gpanel1" Width="500" Scroll="Vertical" Height="1500" Flex="1" Layout="FormLayout">
<Store>
<ext:Store runat="server" GroupField="FloorPlanItemName" GroupDir="ASC" ID="storeItemSelection" DataSourceID="dtsItems">
<Model>
<ext:Model runat="server" IDProperty="FloorPlanItemActionId">
<Fields>
<ext:ModelField Name="FloorPlanItemName" Type="String"></ext:ModelField>
<ext:ModelField Name="FloorPlanItemActionName" Type="String"></ext:ModelField>
<ext:ModelField Name="FloorPlanSqFt" Type="String"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Sorters>
<ext:DataSorter Property="FloorPlanItemName" Direction="ASC" />
</Sorters>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" ID="asdasd" Flex="2" DataIndex="FloorPlanItemName" Filterable="False" Text="Section">
</ext:Column>
<ext:Column runat="server" ID="Column1" Flex="3" DataIndex="FloorPlanItemActionName" Text="FloorPlanItemActionName">
<HeaderItems>
<ext:Container runat="server" Layout="HBoxLayout" Margin="2">
<Items>
<ext:CycleButton runat="server" ShowText="true" Width="48" ForceIcon="#Magnifier">
<Menu>
<ext:Menu ID="Menu1" runat="server">
<Items>

<ext:CheckMenuItem ID="CheckMenuItem4" runat="server" Text="*" Checked="true" ToolTip="Contains" />
</Items>
</ext:Menu>
</Menu>
<Listeners>
<Change Handler="this.up('grid').filterHeader.onFieldChange(this.up ('container'));" />
</Listeners>
</ext:CycleButton>

<ext:TextField runat="server" Flex="1">
<Plugins>
<ext:ClearButton runat="server" />
</Plugins>
<Listeners>
<Change Handler="this.up('grid').filterHeader.onFieldChange(this.up ('container'));" />
</Listeners>
</ext:TextField>
</Items>
<CustomConfig>
<ext:ConfigItem Name="getValue" Value="getCompanyValue" Mode="Raw" />
</CustomConfig>
</ext:Container>
</HeaderItems>
</ext:Column>
<ext:Column runat="server" Filterable="False" ID="Column2" Flex="1" DataIndex="FloorPlanSqFt" Text="FloorPlanSqFt"></ext:Column>
<ext:ComponentColumn ID="ComponentColumn1" Filterable="False"
runat="server"
Editor="true"
Flex="2"
Text="Description">
<Component>
<ext:TextField ID="txtDescription" runat="server" />
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
<Plugins>
<ext:FilterHeader ID="FilterHeader1" runat="server" />
</Plugins>
<SelectionModel>
<ext:CheckboxSelectionModel Enabled="true"></ext:CheckboxSelectionModel>
</SelectionModel>
<Features>
<ext:Grouping ID="Grouping2" runat="server" HideGroupedHeader="False" StartCollapsed="false"
GroupHeaderTplString='{columnName}: {name} ( {rows.length} {[values.rows.length > 1 ? "" : ""]})' />

</Features>

<Buttons>
<ext:Button runat="server" ID="btnSaveGrid" Icon="Accept" >
<DirectEvents>
<Click OnEvent="SaveGrid">

</Click>

</DirectEvents>

</ext:Button>

</Buttons>
</ext:GridPanel>

Baidaly
Nov 07, 2013, 8:50 PM
Hello!

Please, don't forget to use CODE tag, read #3 here: http://forums.ext.net/showthread.php?10205

These values are saved into the Store, so you need to add ExtraParameter which will send required field of each selected record. Take a look at the following sample:


<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = new object[]
{
new object[] { 1, 1, "Text 1", DateTime.Now.Date },
new object[] { 2, 2, "Text 2", DateTime.Now.Date },
new object[] { 3, 3, "Text 3", DateTime.Now.Date },
new object[] { 4, 4, "Text 4", DateTime.Now.Date },
new object[] { 5, 5, "Text 5", DateTime.Now.Date },
new object[] { 6, 6, "Text 6", DateTime.Now.Date },
new object[] { 7, 7, "Text 7", DateTime.Now.Date },
new object[] { 8, 8, "Text 8", DateTime.Now.Date },
new object[] { 9, 9, "Text 9", DateTime.Now.Date }
};

this.Store1.DataBind();
}
}

protected void SaveGrid(object sender, DirectEventArgs e)
{
var values = JSON.Deserialize(e.ExtraParams["values"]);
}
</script>

<!DOCTYPE html>

<html>
<head id="Head1" runat="server">
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="GridPanel1"
runat="server"
Title="ComponentColumn Editor"
Width="600"
Height="300">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button Text="Show Selected TextFields' values">
<DirectEvents>
<Click OnEvent="SaveGrid">
<ExtraParams>
<ext:Parameter Name="values" Value="App.GridPanel1.getRowsValues({selectedOnly: true}).map(function(item) { return item.TextField; })" Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="IntField" Type="Int" />
<ext:ModelField Name="ComboField" Type="Int" />
<ext:ModelField Name="TextField" Type="String" />
<ext:ModelField Name="DateField" Type="Date" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<SelectionModel>
<ext:CheckboxSelectionModel />
</SelectionModel>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:ComponentColumn ID="ComponentColumn1"
runat="server"
Editor="true"
DataIndex="IntField"
Flex="1"
Text="Integer">
<Component>
<ext:NumberField ID="NumberField1" runat="server" />
</Component>
</ext:ComponentColumn>

<ext:ComponentColumn ID="ComponentColumn2"
runat="server"
Editor="true"
DataIndex="ComboField"
Flex="1"
Text="ComboBox">
<Component>
<ext:ComboBox ID="ComboBox1" runat="server">
<Items>
<ext:ListItem Text="Item 1" Value="1" Mode="Raw" />
<ext:ListItem Text="Item 2" Value="2" Mode="Raw" />
<ext:ListItem Text="Item 3" Value="3" Mode="Raw" />
<ext:ListItem Text="Item 4" Value="4" Mode="Raw" />
<ext:ListItem Text="Item 5" Value="5" Mode="Raw" />
<ext:ListItem Text="Item 6" Value="6" Mode="Raw" />
<ext:ListItem Text="Item 7" Value="7" Mode="Raw" />
<ext:ListItem Text="Item 8" Value="8" Mode="Raw" />
<ext:ListItem Text="Item 9" Value="9" Mode="Raw" />
</Items>
</ext:ComboBox>
</Component>
</ext:ComponentColumn>

<ext:ComponentColumn ID="ComponentColumn3"
runat="server"
Editor="true"
DataIndex="TextField"
Flex="1"
Text="Text">
<Component>
<ext:TextField ID="TextField1" runat="server" />
</Component>
</ext:ComponentColumn>

<ext:ComponentColumn ID="ComponentColumn4"
runat="server"
Editor="true"
DataIndex="DateField"
Flex="1"
Text="Date">
<Component>
<ext:DateField ID="DateField1" runat="server" />
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

ebeker
Nov 07, 2013, 9:17 PM
Thank you . I do not how mark your answer as SOLUTION.

Baidaly
Nov 07, 2013, 9:39 PM
Thank you . I do not how mark your answer as SOLUTION.

You just need to confirm that your problem has been solved and we will close it.