Feb 05, 2014, 8:01 PM
I'm facing the same issue having to "implement" the change event on DisplayField controls. Here's the override I've come up with following some pretty helpful suggestions in this thread:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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 runat="server">
<title>Ext.NET Example</title>
<ext:ResourcePlaceHolder runat="server" Mode="Script" />
<script type="text/javascript">
Ext.override(Ext.form.DisplayField, {
setValue: function (value) {
var field = this;
var oldValue = field.getValue();
field.setRawValue(value);
if (oldValue !== value) {
field.fireEvent("change", field, value, oldValue);
}
}
});
var test = function () {
DisplayField1.setValue(String.format("After testing @ {0}", new Date()));
};
var onChange = function (field, newValue, oldValue) {
Ext.Msg.alert("'change' Event Was Fired!", String.format("Old value: {0}<br/>New value: {1}", oldValue, newValue));
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:FormPanel runat="server" Height="120" Width="500" Frame="true" Border="true">
<Items>
<ext:DisplayField runat="server" ID="DisplayField1" Width="300" Text="No 'change' Event Was Fired yet!">
<Listeners>
<AfterRender Handler="this.on('change', onChange);" />
</Listeners>
</ext:DisplayField>
</Items>
<BottomBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="Test">
<Listeners>
<Click Handler="test();" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:FormPanel>
</form>
</body>
</html>
