Jan 24, 2013, 10:16 AM
[CLOSED] Combobox submit value in RowExpander
Hi,please consider the following example code:
I have a GridPanel with RowExpander.
In the RowExpander there is a ComboBox and two textfield.
I would submit a substring of the selected value (the part of the text after the character '-') from the ComboBox to the field with id ExpFieldSpare.
In the example I submit the whole value of the Combo but it doesnt'work
It seems simple but sure I miss something ...
can you please try it and give me a tip ?
I have a GridPanel with RowExpander.
In the RowExpander there is a ComboBox and two textfield.
I would submit a substring of the selected value (the part of the text after the character '-') from the ComboBox to the field with id ExpFieldSpare.
In the example I submit the whole value of the Combo but it doesnt'work
It seems simple but sure I miss something ...
can you please try it and give me a tip ?
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyClass.aspx.cs" Inherits="MyClass" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Cluster Management</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="Script" />
<script type="text/javascript">
var myFilter = function (filters, value) {
if (Ext.isString(filters)) {
filters = {
property: filters,
value: value
};
}
var me = this,
decoded = me.decodeFilters(filters),
i = 0,
length = decoded.length;
for (; i < length; i++) {
me.filters.replace(decoded[i]);
}
if (me.filters.getCount()) {
me.filterBy(me.filters.get(0).filterFn);
}
};
var submitValue = function (destfield, format) {
destfield.setValue(format);
};
</script>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" DirectMethodNamespace="Julia" runat="server" />
<ext:Store ID="Store1" runat="server" PageSize="20">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="Field1" />
<ext:ModelField Name="Field2" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:Store ID="Store3" runat="server" OnReadData="Store_ReadData" PageSize="5" RemotePaging="false"
IsPagingStore="true">
<CustomConfig>
<ext:ConfigItem Name="filter" Value="myFilter" Mode="Raw" />
</CustomConfig>
<Model>
<ext:Model ID="Model5" runat="server">
<Fields>
<ext:ModelField Name="value" />
<ext:ModelField Name="text" />
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy>
<Reader>
<ext:ArrayReader />
</Reader>
</ext:PageProxy>
</Proxy>
</ext:Store>
<ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout">
<Items>
<ext:Panel ID="North" runat="server" Split="true" Region="Center" Layout="BorderLayout"
Border="False">
<Items>
<ext:Panel ID="Panel1" runat="server" Split="true" Resizable="true" Region="Center"
Layout="BorderLayout" Border="False">
<Items>
<ext:GridPanel ID="GridPanel1" StateID="GridCluster" Stateful="true" runat="server"
StoreID="Store1" Region="Center" Frame="true" Title="Clusters" Height="300" Layout="FitLayout"
Margins="0 0 0 0">
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" AllowDeselect="true" runat="server"
Mode="Multi" />
</SelectionModel>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="Id" Visible="true" Width="50" DataIndex="ID" />
<ext:Column ID="Column2" runat="server" Text="Cluster Id" Width="400" DataIndex="Field1" />
<ext:Column ID="Column3" runat="server" Text="Cluster Name" Width="400" DataIndex="Field2" />
</Columns>
</ColumnModel>
<Plugins>
<ext:RowExpander ID="RowExpander1" runat="server" SingleExpand="false">
<Component>
<ext:FormPanel ID="FormPanel3" Icon="User" Visible="true" Frame="true" runat="server"
Region="West" Split="true" Title="Cluster fields" Width="350" BodyPadding="5"
ButtonAlign="Left">
<Items>
<ext:FieldSet ID="FieldSet1" runat="server" Title="Cluster Query Fields" Collapsible="true"
DefaultAnchor="100%">
<Defaults>
<ext:Parameter Name="labelWidth" Value="89" Mode="Raw" />
</Defaults>
<Items>
<ext:ComboBox ID="ComboBox1" StoreID="Store3" runat="server" FieldLabel="Field X"
Name="Field23" DisplayField="text" ValueField="value" Width="600" MinChars="1"
PageSize="5" QueryMode="Local">
<Listeners>
<Select Handler="submitValue(#{ExpFieldSpare}, #{ComboBox1}.getValue());" />
</Listeners>
</ext:ComboBox>
<ext:TextField ID="ExpField2" runat="server" Name="Field2" Width="600" FieldLabel="Field 2" />
<ext:TextField ID="ExpFieldSpare" runat="server" Name="FieldSpare" Width="600" FieldLabel="FieldSpare" />
</Items>
</ext:FieldSet>
</Items>
<Listeners>
<AfterRender Handler="this.getForm().loadRecord(this.record);" />
</Listeners>
<TopBar>
<ext:Toolbar ID="Toolbar4" runat="server">
<Items>
<ext:Button ID="btnSave" runat="server" Text="Save DE" Icon="Disk">
<Listeners>
<Click Handler="var grid = this.up('grid'), form = this.up('form');
grid.getRowExpander().collapseRow(grid.store.indexOf(form.record));
form.getForm().updateRecord(form.record);" />
</Listeners>
</ext:Button>
<ext:Button ID="btnCancel" runat="server" Text="Cancel" Icon="Decline">
<Listeners>
<Click Handler="var grid = this.up('grid'), form = this.up('form');
grid.getRowExpander().collapseRow(grid.store.indexOf(form.record));" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
</ext:FormPanel>
</Component>
</ext:RowExpander>
</Plugins>
</ext:GridPanel>
</Items>
</ext:Panel>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
behind codeusing System;
using Ext.Net;
public partial class MyClass: MainInherit
{
public object[] data = new object[]
{
new object[] { 1, "Test 1", "my data description 1"},
new object[] { 2, "Test 2", "my data description 2"},
new object[] { 3, "Test 3", "my data description 3"},
};
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest) // avoid direct events requests
{
this.Store1.DataSource = data;
this.Store1.DataBind();
}
}
protected void Store_ReadData(object sender, StoreReadDataEventArgs e)
{
Store store = sender as Store;
object[] dcombo = new object[]
{
new object[] { "3m Co", "Manufacturing - FieldSpareValue"},
new object[] { "Alcoa Inc", "Manufacturing - FieldSpareValue"},
new object[] { "Altria Group Inc", "Manufacturing - FieldSpareValue"},
};
store.DataSource = dcombo;
}
}
Last edited by Daniil; Jan 24, 2013 at 1:56 PM.
Reason: [CLOSED]