Aug 12, 2010, 3:29 PM
[CLOSED] [1.0] Combobox not firing blur event when in gridpanel editor
I have a combobox editor in a grid column. If I edit the cell, type into it, tab out to next cell, the blur event of the combobox is not fired. In example below, when blur event fires, it will show the current datetime. If you select a value from the combobox list, the blur event will fire. But if you use typeahead, it does not fire until you click somewhere else in the grid.
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e) {
if (!X.IsAjaxRequest) {
this.GridPanel1.Store.Primary.DataSource = new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
};
this.GridPanel1.Store.Primary.DataBind();
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Simple Array Grid - Ext.NET Examples</title>
<style type="text/css">
.x-grid3-hd-inner
{
white-space: normal !important;
}
</style>
</head>
<body>
<script type="text/javascript">
var template = '<span style="color:{0};">{1}</span>';
var change = function(value) {
return String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function(value) {
return String.format(template, (value > 0) ? "green" : "red", value + "%");
};
</script>
<ext:ResourceManager ID="ResourceManager1" runat="server" ScriptMode="Debug" />
<div style="padding: 5px;">
<ext:GridPanel ID="GridPanel1" runat="server" StripeRows="true" Title="Array Grid"
TrackMouseOver="true" Width="600" Height="350" ClicksToEdit="1" ForceValidation="false">
<Store>
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="company" />
<ext:RecordField Name="price" Type="Float" />
<ext:RecordField Name="change" Type="Float" />
<ext:RecordField Name="pctChange" Type="Float" />
<ext:RecordField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
<ext:RecordField Name="flag" Type="Boolean" DefaultValue="true">
</ext:RecordField>
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ColumnID="Company" Header="Company Long Header Description Blah" DataIndex="company"
Locked="true">
<Editor>
<ext:ComboBox runat="server" ID="cbCompany">
<Items>
<ext:ListItem Text="3m Co" Value="3m Co" />
<ext:ListItem Text="Alcoa Inc" Value="Alcoa Inc" />
</Items>
<Listeners>
<Blur Handler="Ext.getCmp('lblMsg').setText(new Date().toString())" />
</Listeners>
</ext:ComboBox>
</Editor>
</ext:Column>
<ext:Column Header="Price Long Header" DataIndex="price" Editable="true">
<Renderer Format="UsMoney" />
<Editor>
<ext:TextField runat="server">
</ext:TextField>
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="false" />
</SelectionModel>
<View>
<ext:LockingGridView EmptyText="No data available." ForceFit="true">
</ext:LockingGridView>
</View>
</ext:GridPanel>
<ext:Label runat="server" ID="lblMsg" Text="Nothing Happened Yet">
</ext:Label>
</div>
</body>
</html>
Last edited by Daniil; Aug 17, 2010 at 10:05 PM.
Reason: [CLOSED]