PDA

View Full Version : [OPEN] [#290] RadioGroup SetValue function without event fire during page load.



kevinhwang
Jun 27, 2013, 3:53 PM
Hi Support team,

On page load I use SetValue function for RadioGroup control like below.


If Not objProcureHeader.nApprovalEntityID = 0 Then
Dim se If Not objProcureHeader.nApprovalEntityID = 0 Then
Dim setValue As New InsertOrderedDictionary(Of String, Object)
If objProcureHeader.nApprovalEntityID = 1 Then
setValue.Add(rbApprovalAuth.GroupName, "1")
rbApprovalAuth.SetValue(setValue)
ElseIf objProcureHeader.nApprovalEntityID = 2 Then
setValue.Add(rbApprovalAuth.GroupName, "2")
rbApprovalAuth.SetValue(setValue)
End If
End If


This SetValue function fire rbApprovalAuth_Change function below.
I want to know how I can avoid the event firing during page load event.



<DirectMethod([Namespace]:="ContractsCentral.DirectMethods")> _
Public Sub rbApprovalAuth_Change(ByVal newValue As String)
Try
Dim objApprvEnt As ProcurementMilestone = New ProcurementMilestone()
objApprvEnt.nProcurementID = EmptyToInteger(intProcureID)
objApprvEnt.nApprovalEntityID = EmptyToInteger(newValue)
objApprvEnt.nListTypeID = 12
objApprvEnt.UpdateRequisition()

Catch ex As Exception
Me.Master.SetValidationMessage = ex.Message
Finally

End Try
End Sub




<ext:RadioGroup ID="rbApprovalAuth" runat="server" GroupName="State">
<LayoutConfig>
<ext:CheckboxGroupLayoutConfig AutoFlex="false" />
</LayoutConfig>
<Defaults>
<ext:Parameter Name="name" Value="ccType" />
<ext:Parameter Name="style" Value="margin-right:15px;" />
</Defaults>
<Items>
<ext:Radio ID="RdBoardAward" runat="server" InputValue="1" BoxLabel="Board Award">
</ext:Radio>
<ext:Radio ID="RdPurchasingAward" runat="server" InputValue="2" BoxLabel="Purchasing Award">
</ext:Radio>
</Items>
<Listeners>
<Change Fn="OnrbApprovalAuth_Change" />
</Listeners>
</ext:RadioGroup>



Regards,

Kevin

Baidaly
Jun 27, 2013, 11:16 PM
Hello!

Try the following approach using CustomConfig:



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

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

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var value = new InsertOrderedDictionary<string, object>();
value.Add("Radio1", "1");
RadioGroup1.CustomConfig.Add(new ConfigItem("value", JSON.Serialize(value), ParameterMode.Raw));
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:FormPanel runat="server">
<Items>
<ext:RadioGroup runat="server" Vertical="true" Width="300" ID="RadioGroup1" GroupName="Radio1">
<Items>
<ext:Radio ID="RadioActive" runat="server" BoxLabel="A" InputValue="0">
</ext:Radio>
<ext:Radio ID="RadioNext" runat="server" BoxLabel="B" InputValue="1">
</ext:Radio>
</Items>
<Listeners>
<Change Handler="console.log('Changed');" />
</Listeners>
</ext:RadioGroup>
</Items>
</ext:FormPanel>
</form>
</body>
</html>

Daniil
Jun 28, 2013, 4:18 AM
Hi,

Another approach is setting a Radio's Checked.

Radio r = this.RadioGroup1.Items.Cast<Radio>().First<Radio>(item => item.InputValue == "1");
r.Checked = true;

Regarding the SetValue method. It is better to use it during a DirectEvent/DirectMethod only.

kevinhwang
Jun 28, 2013, 3:13 PM
Hello!

Try the following approach using CustomConfig:



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

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

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var value = new InsertOrderedDictionary<string, object>();
value.Add("Radio1", "1");
RadioGroup1.CustomConfig.Add(new ConfigItem("value", JSON.Serialize(value), ParameterMode.Raw));
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:FormPanel runat="server">
<Items>
<ext:RadioGroup runat="server" Vertical="true" Width="300" ID="RadioGroup1" GroupName="Radio1">
<Items>
<ext:Radio ID="RadioActive" runat="server" BoxLabel="A" InputValue="0">
</ext:Radio>
<ext:Radio ID="RadioNext" runat="server" BoxLabel="B" InputValue="1">
</ext:Radio>
</Items>
<Listeners>
<Change Handler="console.log('Changed');" />
</Listeners>
</ext:RadioGroup>
</Items>
</ext:FormPanel>
</form>
</body>
</html>


Thanks Baidaly,

Your solution resolved my problem.

Kevin

kevinhwang
Jun 28, 2013, 3:14 PM
Hi,

Another approach is setting a Radio's Checked.

Radio r = this.RadioGroup1.Items.Cast<Radio>().First<Radio>(item => item.InputValue == "1");
r.Checked = true;

Regarding the SetValue method. It is better to use it during a DirectEvent/DirectMethod only.

Thanks Daniil,

I'll remember it.

Kevin

michaeld
Jul 01, 2013, 12:35 AM
Another approach is setting a Radio's Checked.

Radio r = this.RadioGroup1.Items.Cast<Radio>().First<Radio>(item => item.InputValue == "1");
r.Checked = true;

Regarding the SetValue method. It is better to use it during a DirectEvent/DirectMethod only.

I'm just curious, is there reasoning behind the decision to make SetValue a postback script call only?

It seems to me that it would just as possible to test for X.IsAjaxRequest==false in the control's SetValue function and make it possible to set the value in Page_Load differently than if X.IsAjaxRequest==true where it would do this.Call("setValue"); If not ajaxrequest in the case of a radiogroup, it would set the checked value of the specified control.

I guess I do not see why the various member methods cannot be versatile enough to handle both initial load and postback conditions and achieve the same user-intended result. I realize this is a slight paradigm shift and could apply to many controls that call Call(string name, params object[] args), but I know this has been one of the rough-edges surrounding ext.net library usage and hundreds of questions in the forums. A server-side library is slightly more apt to take advantage of the multiple facets of the client-side interface, where the client-side alone would not. If someone actually wants an additional event fired on load where intuition would not typically hold, then they can call Call directly themselves, but if someone wants to setValue during load to initialize a value that is not intuitively available to be set another way, allow them their many ways to get to the same solution.

Anyway, this is just intuitive to me (and apparently many of your forum users as well) so that's why I'm posing this question.

Daniil
Jul 02, 2013, 3:48 PM
Re: RadioGroup Value

Created an Issue "CheckboxGroup/RadioGroup Value property".
https://github.com/extnet/Ext.NET/issues/290


I'm just curious, is there reasoning behind the decision to make SetValue a postback script call only?

It seems to me that it would just as possible to test for X.IsAjaxRequest==false in the control's SetValue function and make it possible to set the value in Page_Load differently than if X.IsAjaxRequest==true where it would do this.Call("setValue"); If not ajaxrequest in the case of a radiogroup, it would set the checked value of the specified control.

I guess I do not see why the various member methods cannot be versatile enough to handle both initial load and postback conditions and achieve the same user-intended result. I realize this is a slight paradigm shift and could apply to many controls that call Call(string name, params object[] args), but I know this has been one of the rough-edges surrounding ext.net library usage and hundreds of questions in the forums. A server-side library is slightly more apt to take advantage of the multiple facets of the client-side interface, where the client-side alone would not. If someone actually wants an additional event fired on load where intuition would not typically hold, then they can call Call directly themselves, but if someone wants to setValue during load to initialize a value that is not intuitively available to be set another way, allow them their many ways to get to the same solution.

Anyway, this is just intuitive to me (and apparently many of your forum users as well) so that's why I'm posing this question.

Yes, it would be nice to have, but in some cases we cannot rely on X.IsAjaxRequest. For example, in a case with submitting a FormPanel to a controller action and returning a FormResult. X.IsAjaxRequest is false during a FormPanel submit, but JavaScript on method calls (for proxy controls got by X.GetCmp) should be generated anyway. It is just something we support. So, at some point we decided to apply the convention that the methods like SetValue, i.e. the ones which generates JavaScript, should be only used for already rendered to client controls. Otherwise, its properties should be used. Maybe, it is a bit disputable convention, but your suggestion could be considered as disputable as well and, I think, it could cause another problems similar to a FormPanel submit I was talking about.

Also such a convention is very familiar for ExtJS developers. JavaScript language forces ExtJS to use config options for initial state, then use methods on the fly. I understand that C# is not JavaScript, though, I am just talking about conventions. We just had to choose the one.

michaeld
Jul 04, 2013, 4:59 AM
I regarded the method to the madness and the decisions you've made, more so since upgrading to 2.0. It really made sense. I'm posing going further with the intuition.

But alright, since we're going half way, let's not forget Combox selection in this conversation. It's equally as problematic in the forums. Consider all controls. Helpers really help get us where we're going, especially the VB guys who need simple!


Personally, I wish there were better convention on the C# side with the naming of methods that will actually call javascript versus ones that actually do stuff on the server-side in C# to the control for initial rendering. Like for instance, using lowercase for setValue instead of SetValue would have easily conveyed to the coder "oh btw" this is a javascript call that matches the extjs call with the exact same name and you shouldn't use it to set values on the server-side if you expect not to trigger an event. ;)

I realize this may be to late in the game for such a big code change as small as a lower case first-char convention, but I still think it's totally valid argument to consider for a next major rev? Let's break the pattern of confusion and get extnet on the map as the easiest clientside ui for prototyping as well as make sense on the extjs side.

Daniil
Jul 12, 2013, 12:01 PM
But alright, since we're going half way, let's not forget Combox selection in this conversation. It's equally as problematic in the forums. Consider all controls.


Agree, it is a very common problem on the forums.



Helpers really help get us where we're going, especially the VB guys who need simple!


Please clarify why especially for VB?



Personally, I wish there were better convention on the C# side with the naming of methods that will actually call javascript versus ones that actually do stuff on the server-side in C# to the control for initial rendering. Like for instance, using lowercase for setValue instead of SetValue would have easily conveyed to the coder "oh btw" this is a javascript call that matches the extjs call with the exact same name and you shouldn't use it to set values on the server-side if you expect not to trigger an event. ;)

I realize this may be to late in the game for such a big code change as small as a lower case first-char convention, but I still think it's totally valid argument to consider for a next major rev? Let's break the pattern of confusion and get extnet on the map as the easiest clientside ui for prototyping as well as make sense on the extjs side.

I doubt it is going to happen, but it is definitely interesting suggestion. We will consider. Thank you.