PDA

View Full Version : [OPEN] [#42] numberField with plugin editor



tactime10
Sep 25, 2012, 10:14 AM
Hi,

I created a gridPanel with plugin editor and I added for the column the numberField. Now I want to disable SpinDown button but if I set the property SpinDownEnabled="false" the button is always enabled.

How can do this?
My code is below:



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

<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<script runat="server">

protected void AddElement(object sender, DirectEventArgs e) {
this.storeAction.DataSource = this.DataElement1;
this.storeAction.DataBind();
}

private object[] DataElement1 {
get
{
return new object[]
{
new object[] { "element1", "description1", "workcenter1", 1 },
new object[] { "element2", "description2", "workcenter2", 1 },
new object[] { "element3", "description3", "workcenter3", 1 },
new object[] { "element4", "description4", "workcenter4", 1 },
new object[] { "element5", "description5", "workcenter5", 1 },
new object[] { "element6", "description6", "workcenter6", 1 },
new object[] { "element7", "description7", "workcenter7", 1 },
new object[] { "element8", "description8", "workcenter8", 1 },
new object[] { "element9", "description9", "workcenter9", 1 },
new object[] { "element10", "description10", "workcenter10", 1 },
new object[] { "element11", "description11", "workcenter11", 1 },
new object[] { "element12", "description12", "workcenter12", 1 },
new object[] { "element13", "description13", "workcenter13", 1 },
new object[] { "element14", "description14", "workcenter14", 1 },
new object[] { "element15", "description15", "workcenter15", 1 },
new object[] { "element16", "description16", "workcenter16", 1 },
new object[] { "element17", "description17", "workcenter17", 1 },
new object[] { "element18", "description18", "workcenter18", 1 },
new object[] { "element19", "description19", "workcenter19", 1 },
new object[] { "element20", "description20", "workcenter20", 1 },
new object[] { "element21", "description21", "workcenter21", 1 }
};
}
}

private object[] DataElement {
get
{
return new object[]
{
new object[] { "element1", "description1", "workcenter1", 1 },
new object[] { "element2", "description2", "workcenter2", 1 },
new object[] { "element3", "description3", "workcenter3", 1 },
new object[] { "element4", "description4", "workcenter4", 1 },
new object[] { "element5", "description5", "workcenter5", 1 },
new object[] { "element6", "description6", "workcenter6", 1 },
new object[] { "element7", "description7", "workcenter7", 1 },
new object[] { "element8", "description8", "workcenter8", 1 },
new object[] { "element9", "description9", "workcenter9", 1 },
new object[] { "element10", "description10", "workcenter10", 1 },
new object[] { "element11", "description11", "workcenter11", 1 },
new object[] { "element12", "description12", "workcenter12", 1 },
new object[] { "element13", "description13", "workcenter13", 1 },
new object[] { "element14", "description14", "workcenter14", 1 },
new object[] { "element15", "description15", "workcenter15", 1 },
new object[] { "element16", "description16", "workcenter16", 1 },
new object[] { "element17", "description17", "workcenter17", 1 },
new object[] { "element18", "description18", "workcenter18", 1 },
new object[] { "element19", "description19", "workcenter19", 1 },
new object[] { "element20", "description20", "workcenter20", 1 }
};
}
}

public void Page_Load() {
if (!X.IsAjaxRequest) {
this.storeAction.DataSource = this.DataElement;
this.storeAction.DataBind();
}
}

</script>
<script type="text/javascript">
var validate = function(editor, e) {

}

var edit = function (editor, e) {
/*
"e" is an edit event with the following properties:

grid - The grid
record - The record that was edited
field - The field name that was edited
value - The value being set
originalValue - The original value for the field, before the edit.
row - The grid table row
column - The grid Column defining the column that was edited.
rowIdx - The row index that was edited
colIdx - The column index that was edited
*/

// Call DirectMethod
if (e.value !== e.originalValue) {
CompanyX.Edit(row, e.field, e.originalValue, e.value, e.record.data);
}
};
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<br/>
<h1>Example</h1>
<br/>
<ext:Button ID="btnAdd" Text="Add Element" runat="server" Hidden="false" >
<DirectEvents>
<Click OnEvent="AddElement">
<EventMask ShowMask="true" MinDelay="100"/>
</Click>
</DirectEvents>
</ext:Button>
<br/>
<ext:Panel runat="server" Id="panel" Border="false"
Layout="FitLayout" Flex="1" BodyPadding="10" Width="500" Height="300">
<Items>
<ext:GridPanel
ID="gridPanel"
runat="server"
Border="false"
Title="Action" Width="300" Height="300">
<Store>
<ext:Store ID="storeAction" runat="server">
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="element"/>
<ext:ModelField Name="description"/>
<ext:ModelField Name="workcenter"/>
<ext:ModelField Name="progress"/>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="Element" DataIndex="element" Locked="true"/>
<ext:Column runat="server" Text="Description" DataIndex="description" />
<ext:Column runat="server" Text="Workcenter" DataIndex="workcenter" />
<ext:Column runat="server" Text="Advancement" DataIndex="progress" >
<Renderer Handler="return value + '%';" />
<Editor>
<ext:NumberField runat="server" MinValue="0" MaxValue="100" SpinDownEnabled="false"/>
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:CellEditing runat="server">
<Listeners>
<Edit Fn="edit" />
</Listeners>
</ext:CellEditing>
</Plugins>
</ext:GridPanel>
</Items>
</ext:Panel>
</form>
</body>
</html>



Thank you so much.

Daniil
Sep 25, 2012, 11:03 AM
Hi @tactime10,

Thank you for the report. I re-reported to Sencha.
http://www.sencha.com/forum/showthread.php?243815

For now I can suggest the following workaround: place this script into the page <head>.

Workaround

Ext.form.field.Number.prototype.toggleSpinners = Ext.Function.createSequence(
Ext.form.field.Number.prototype.toggleSpinners,
function () {
this.setSpinDownEnabled(false);
}
);

Baidaly
Nov 17, 2012, 12:52 AM
Opened an Issue to track this defect, see

https://github.com/extnet/Ext.NET/issues/42

Looks like this issue has been fixed in Ext JS 4.1.3 Sprint 1. The fix will be incorporated in one of the next the Ext.NET releases.

Daniil
Dec 29, 2012, 9:23 AM
The SpinDownEnabled and SpinUpEnabled works well with the trunk.