[OPEN] [#290] RadioGroup SetValue function without event fire during page load.

  1. #1

    [OPEN] [#290] RadioGroup SetValue function without event fire during page load.

    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
    Last edited by Daniil; Jul 02, 2013 at 3:48 PM. Reason: [OPEN] [#290]
  2. #2
    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>
  3. #3
    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.
  4. #4
    Quote Originally Posted by Baidaly View Post
    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
  5. #5
    Quote Originally Posted by Daniil View Post
    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
    Last edited by kevinhwang; Jun 28, 2013 at 3:50 PM.
  6. #6
    Quote Originally Posted by Daniil View Post
    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.
    Last edited by michaeld; Jul 01, 2013 at 12:43 AM.
  7. #7
    Re: RadioGroup Value

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

    Quote Originally Posted by michaeld View Post
    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.
  8. #8
    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.
  9. #9
    Quote Originally Posted by michaeld View Post
    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.

    Quote Originally Posted by michaeld View Post
    Helpers really help get us where we're going, especially the VB guys who need simple!
    Please clarify why especially for VB?

    Quote Originally Posted by michaeld View Post
    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.

Similar Threads

  1. Replies: 9
    Last Post: Jun 27, 2012, 2:17 PM
  2. Replies: 5
    Last Post: Jun 25, 2012, 6:19 PM
  3. Replies: 4
    Last Post: Jan 10, 2012, 10:21 AM
  4. Replies: 9
    Last Post: Nov 22, 2010, 4:06 AM
  5. [CLOSED] Load RadioGroup Item from database on Combo Select event
    By webclouder in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 16, 2010, 8:30 PM

Posting Permissions