PDA

View Full Version : [CLOSED] Can not Get or Set values to Ext.Net.Hidden in 2.1



blurken
Dec 05, 2012, 2:30 AM
I am having a problem getting or setting the value of a dynamically created ext:hidden as of 2.1

The following is just a sample of what I am trying to achieve but enough to demonstate the point...

1) I need to create a place holder for a the results of a calulatedValue.


Dim vp As New Ext.Net.Hidden()
vp.ID = "ElementGUI_Value"


2) When the calculation is made I call a DirectMethod to store that calulatedValue.


<DirectMethod()> _
Sub SetValue(calulatedValue As Integer)
'Value Part
Dim vp As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
vp.Value = calulatedValue
End Sub


3) Then when the user presses save the value is needed. This again is achieved by a DirectMethod.


<DirectMethod()> _
Sub Save()
Dim vp As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
Dim calulatedValue As Integer = CInt(vp.Value)
End Sub



This problem did not occur in 2.0. Any help

Note: When I have a Ext.Net.NumberField it works perfectly, the problem is that I do not want to display a numberfield. Alternatively, when I set either of these two options when it is a numberfield

vp.Hidden = True
OR

vp.Visible = False
It has exact same problem as a Ext.Net.Hidden

geoffrey.mcgill
Dec 05, 2012, 3:45 AM
Please post a complete (but simplified) code sample demonstrating how to reproduce the issue.

blurken
Dec 05, 2012, 10:16 PM
Hi I have made a simple example. There is an input field and a Get and Set button.

The Set Button sets the value and stores it in Ext.Net.Hidden and the Get Button retrieves the value from Ext.Net.Hidden field.

Please not that if I use Ext.Net.TextfField it works perfectly, however if I set the TexField to Hidden it does not.

Regards,
Aaron

Example.aspx


<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Example.aspx.vb" Inherits="Blurken6.Example" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" Theme="Gray" HideInDesign="True" />

<ext:window ID="Window1" Width="600" Height="400" runat="Server" Layout="TableLayout">

</ext:window>
</form>
</body>
</html>


Example.aspx.vb


Imports Ext.Net

Public Class Example
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

Dim layoutConfig As New TableLayoutConfig
layoutConfig.Columns = 4
Window1.LayoutConfig.Add(layoutConfig)


'Value Field
Dim ElementGUI_Value As New Hidden()
ElementGUI_Value.ID = "ElementGUI_Value"
Window1.Items.Add(ElementGUI_Value)

'Input Field
Dim ElementGUI_Inout As New TextField
ElementGUI_Inout.FieldLabel = "Value"
ElementGUI_Inout.ID = "ElementGUI_Input"
ElementGUI_Inout.Width = 200
Window1.Items.Add(ElementGUI_Inout)

'GET AND SET Button
Dim Btn_Set As New SplitButton
Btn_Set.Icon = Icon.ImageAdd
Btn_Set.Text = "Set"
Btn_Set.OnClientClick = "#{DirectMethods}.SetValue(#{ElementGUI_Input}.getV alue());"

Dim Menu As New Menu
Btn_Set.Menu.Add(Menu)

Dim MenuItem_Get As New MenuItem
MenuItem_Get.Icon = Icon.ImageDelete
MenuItem_Get.Text = "Get"
MenuItem_Get.OnClientClick = "#{DirectMethods}.GetValue();"
Menu.Items.Add(MenuItem_Get)

Window1.Items.Add(Btn_Set)

End Sub

<DirectMethod()> _
Sub SetValue(value As String)
Dim hf_hide As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
hf_hide.Value = value

Ext.Net.X.Msg.Notify("Value Set", value).Show()
End Sub

<DirectMethod()> _
Sub GetValue()
Dim hf_hide As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
Dim value As String = hf_hide.Value

Ext.Net.X.Msg.Notify("Value Get", value).Show()
End Sub
End Class

geoffrey.mcgill
Dec 05, 2012, 10:49 PM
Hi,

I think you need to wrap your Page_Load logic inside an


if (!X.IsAjaxRequest)

blurken
Dec 05, 2012, 11:19 PM
Hi I have the check for if (!X.IsAjaxRequest) and the issue still occurs...
Note that the issue only occurs for a Ext.Net.Hidden and not for other fields types
Thanks.



Imports Ext.Net

Public Class Example
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

If Not Ext.Net.X.IsAjaxRequest Then

Dim layoutConfig As New TableLayoutConfig
layoutConfig.Columns = 4
Window1.LayoutConfig.Add(layoutConfig)

'Value Field
Dim ElementGUI_Value As New Hidden()
ElementGUI_Value.ID = "ElementGUI_Value"
Window1.Items.Add(ElementGUI_Value)

'Input Field
Dim ElementGUI_Inout As New TextField
ElementGUI_Inout.FieldLabel = "Value"
ElementGUI_Inout.ID = "ElementGUI_Input"
ElementGUI_Inout.Width = 200
Window1.Items.Add(ElementGUI_Inout)

'GET AND SET Button
Dim Btn_Set As New SplitButton
Btn_Set.Icon = Icon.ImageAdd
Btn_Set.Text = "Set"
Btn_Set.OnClientClick = "#{DirectMethods}.SetValue(#{ElementGUI_Input}.getV alue());"

Dim Menu As New Menu
Btn_Set.Menu.Add(Menu)

Dim MenuItem_Get As New MenuItem
MenuItem_Get.Icon = Icon.ImageDelete
MenuItem_Get.Text = "Get"
MenuItem_Get.OnClientClick = "#{DirectMethods}.GetValue();"
Menu.Items.Add(MenuItem_Get)

Window1.Items.Add(Btn_Set)

Ext.Net.X.Msg.Notify("Window Rendered", Now).Show()
End If

End Sub

<DirectMethod()> _
Sub SetValue(value As String)
Dim hf_hide As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
hf_hide.Value = value

Ext.Net.X.Msg.Notify("Value Set", hf_hide.Value).Show()
End Sub

<DirectMethod()> _
Sub GetValue()
Dim hf_hide As Hidden = Ext.Net.X.GetCmp(Of Hidden)("ElementGUI_Value")
Dim value As String = hf_hide.Value

Ext.Net.X.Msg.Notify("Value Get", value).Show()
End Sub
End Class

geoffrey.mcgill
Dec 05, 2012, 11:48 PM
The following sample seems to work ok.

Example


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

<%@ Import Namespace="Button=Ext.Net.Button" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var hidden = new Hidden
{
ID = "Hidden1"
};


var text = new TextField
{
ID = "TextField1",
FieldLabel = "Value",
Width = 200
};


var button1 = new Button
{
Icon = Icon.ImageAdd,
Text = "Set",
OnClientClick = "App.direct.SetValue(App.TextField1.getValue());"
};


var button2 = new Button
{
Icon = Icon.ImageAdd,
Text = "Get",
OnClientClick = "App.direct.GetValue();"
};


this.Form.Controls.Add(hidden);
this.Form.Controls.Add(text);
this.Form.Controls.Add(button1);
this.Form.Controls.Add(button2);
}
}

[DirectMethod]
public void SetValue(string value)
{
var hidden = X.GetCmp<Hidden>("Hidden1");
hidden.Value = value;

X.Msg.Notify("Value Set", value).Show();
}


[DirectMethod]
public void GetValue()
{
var hidden = X.GetCmp<Hidden>("Hidden1");

var value = hidden.Value;

X.Msg.Notify("Value Get", value).Show();
}
</script>


<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
</form>
</body>
</html>

blurken
Dec 06, 2012, 1:10 AM
Hi Geoffry, I have worked out the problem. Using your example if I target the fields to a Ext.Net.Panel rather than the generic form it works as expected.


<ext:panel Width="800" Height="600" Title="Test" runat="server" ID="Window1"></ext:panel>

HOWEVER, when I add a Layout="TableLayout" to that Panel it no longer works.


<ext:panel Width="800" Height="600" Title="Test" runat="server" ID="Window1" Layout="TableLayout"></ext:panel>

I have tested for other layouts such as ColumnLayout and AnchorLayout and they work fine? Is this a bug?

Aaron

geoffrey.mcgill
Dec 06, 2012, 3:17 AM
I think the issue is that TableLayout can only accept Container type components (such as Container, Panel, etc) in the .Items Collection.

Here's a full sample demonstrating a working scenario.

Example


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

<%@ Import Namespace="Button=Ext.Net.Button" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var panel = this.Panel1;

panel.Items.Add(new Container
{
Items =
{
new Hidden
{
ID = "Hidden1"
}
}
});


panel.Items.Add(new Container
{
Items =
{
new TextField
{
ID = "TextField1",
FieldLabel = "Value",
Text = "Hello World",
Width = 200
}
}
});


panel.Buttons.Add(new Button
{
Icon = Icon.ImageAdd,
Text = "Set",
OnClientClick = "App.direct.SetValue(App.TextField1.getValue());"
});


panel.Buttons.Add(new Button
{
Icon = Icon.ImageAdd,
Text = "Get",
OnClientClick = "App.direct.GetValue();"
});
}
}

[DirectMethod]
public void SetValue(string value)
{
var hidden = X.GetCmp<Hidden>("Hidden1");
hidden.Value = value;

X.Msg.Notify("Value Set", value).Show();
}


[DirectMethod]
public void GetValue()
{
var hidden = X.GetCmp<Hidden>("Hidden1");

var value = hidden.Value;

X.Msg.Notify("Value Get", value).Show();
}
</script>


<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />


<ext:Panel
ID="Panel1"
runat="server"
Height="215"
Width="350"
Layout="TableLayout"
/>
</form>
</body>
</html>

I discuss with the dev team about throwing an Exception if non-Container type components are added to the .Items Collection when TableLayout.

Hope this helps.

blurken
Dec 06, 2012, 3:36 AM
Hi,

Thanks for the update. What I have done is instead of using the Ext.Net.Hidden, I have used Ext.Net.TextField and set the property StyleSpec = "display:none;" and this works as if it is a hidden...

Otherwise i saw that putting it inside another container did the trick.

Please close this for now but an error specifying non-container objects in TableLayout would be good.

Thanks for your quick response on this...

Regards,
Aaron

Daniil
Dec 06, 2012, 7:10 AM
Hi everybody,

I think TableLayout does support non-container components. At least, it works.

Just it doesn't render a Hidden, therefore it is not submitted (its HTML element is not rendered).

Generally, I would not place a Hidden into an Items collection.

You could place it directly to a <form>.

If you want to encapsulate a Hidden to a Panel, then I can suggest to place it into a Bin collection and manually render to a <form>.

Example

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

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void SetValue(object sender, DirectEventArgs e)
{
Hidden h = X.GetCmp<Hidden>("Hidden1");
h.Value = "test";
}

protected void GetValue(object sender, DirectEventArgs e)
{
Hidden h = X.GetCmp<Hidden>("Hidden1");
X.Msg.Alert("DirectEvent", h.Value).Show();
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:Panel runat="server">
<LayoutConfig>
<ext:TableLayoutConfig Columns="2" />
</LayoutConfig>
<Bin>
<ext:Hidden ID="Hidden1" runat="server" />
</Bin>
<Items>
<ext:TextField runat="server" />
<ext:DateField runat="server" />
<ext:TextField runat="server" />
<ext:DateField runat="server" />
</Items>
<Listeners>
<AfterRender Handler="this.getBinComponent('Hidden1').render(Ext.net.Res ourceMgr.aspForm);" />
</Listeners>
</ext:Panel>

<ext:Button runat="server" Text="Set Hidden's value" OnDirectClick="SetValue" />

<ext:Button runat="server" Text="Get Hidden's value" OnDirectClick="GetValue" />
</form>
</body>
</html>

Daniil
Dec 06, 2012, 11:43 AM
Another approach is putting a Hidden into HtmlBin instead of Bin.

In this case you won't need to render a Hidden manually.