PDA

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



tactime10
Sep 25, 2012, 11: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, 12:03 PM
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, 1: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, 10:23 AM
The SpinDownEnabled and SpinUpEnabled works well with the trunk.