[CLOSED] Client and Server side form validation best solution

  1. #1

    [CLOSED] Client and Server side form validation best solution

    Hi.
    I am a bit confused about how validation works, or the best way it has been thought to work as. I know is basic but I can't integrate all code suggestions found on forums and examples.
    I need client side validation and also serverside validation (just in case user turned off Javascript) just as Microsoft's ASP.NET Validation controls do.

    I saw the examples that show how to validate serverside in real time, with async remote calls, control by control, but I need a complete validation on submit event (client and server side). Returning from a failed server validation also with all warnings, icons and messages in controls such as if it had been validated client side

    I am firing a save method from a button inside a Form Panel with a DirectEvent.
    I can call IsValid client side from a <listener> in button, but I don't know how to suspend the direct event in case client validation fails.

    Here is a dummy form with what I am telling you.

    <ext:FormPanel ID="FormPanel1" runat="server" Height="400" Title="Form Panel" Padding="5" MonitorResize="true">
              <Items>
                <ext:TextField ID="txtFirstName" runat="server" Width="150" FieldLabel="Name: " AllowBlank="false" MsgTarget="Side"/>
                <ext:TextField ID="txtLastName" runat="server" Width="150" FieldLabel="LastName: " AllowBlank="false" MsgTarget="Side"/>
              </Items>
              <Buttons>
                <ext:Button ID="btnSave" runat="server" Text="Save">
                <Listeners>
                    <Click Handler="if (#{FormPanel1}.getForm().isValid()) {Ext.Msg.alert('HERE CANCEL SUBMIT', 'CANCELATION SHOULD BE HERE!');}else{Ext.Msg.show({icon: Ext.MessageBox.ERROR, msg: 'FormPanel is incorrect', buttons:Ext.Msg.OK});}" />
                </Listeners>
                   <DirectEvents>
                        <Click OnEvent="btnSave_Click" Success="parentAutoLoadControl.close();">
                            <EventMask ShowMask="true" Msg="Saving..." />
                            
                        </Click>
                   </DirectEvents>
                    
                </ext:Button>
                <ext:Button ID="btnCancel" runat="server" Text="Cancel">
                    <Listeners>
                    <Click Handler="parentAutoLoadControl.close();" />
                    
                   </Listeners>
                </ext:Button>
              </Buttons>
         </ext:FormPanel>
    btnSave_Click is a server side VB method that saves data.

          Protected Sub btnSave_Click(ByVal sender As Object, ByVal e As DirectEventArgs)
    
    'HERE SHOULD COME SERVER VALIDATION JUST IN CASE
    
    
           Dim mPerson As New Person
           mPerson .FirstName= txtFirstName.Text
            mPerson .LastName= txtLastName.Text
    
            mPerson .Save()
    
    'IN CASE VALIDATION FAILED, THE CONTROL SHOULD BE RETURNED TO THE CLIENT WITH ALL WARNINGS ACTIVATED
    
    
        End Sub
    I don't know if a DirectEvent isn't the right way to do this. Should I submit all the form from clientside? That way I would condition submition to the IsValid result.

    Also, how is the serverside IsValid method called? All warnings will appear if the window is re-rendered after a failed serverside IsValid call?

    Thanks
    Regards
    Fernando
    Last edited by geoffrey.mcgill; Feb 13, 2012 at 9:02 PM. Reason: [CLOSED]
  2. #2
    Hi,

    There is no bulk remote validation functionality in Ext.NET.

    I am firing a save method from a button inside a Form Panel with a DirectEvent.
    I can call IsValid client side from a <listener> in button, but I don't know how to suspend the direct event in case client validation fails.
    To prevent a DirectEvent, please return false from that listener or DirectEvent's Before handler.
    https://examples1.ext.net/#/Toolbar/StatusBar/Advanced/

    As well, you can disable/enable a Button when a FormPanel becomes invalid/valid, similar in here:
    https://examples1.ext.net/#/Form/Val...te_Validation/
  3. #3
    Thanks. I didn't know the Before attribute.

    So, I guess I' ll have to manage myself to bulk validate all server side just in case client validation fails (Javascript disabled).

    In that case, I have a DirectEvent' s Success attribute to close the window. How can I prevent that to happen? Is there any SupressSuccess like attribute that can be set from server side to prevent DirectEvent fire the Success line?

    And in that case, how should I manually set all warnings on wrong fields (that failed with first client validation before submition) to get activated and/or set any message from server side to the notifying icon? Example: 'Something went wrong validating your form. Please activate JavaScript and check all required fields and formats'.

    Thanks
    Regards
    Fernando
  4. #4
    Quote Originally Posted by FAS View Post
    In that case, I have a DirectEvent' s Success attribute to close the window. How can I prevent that to happen? Is there any SupressSuccess like attribute that can be set from server side to prevent DirectEvent fire the Success line?
    Well, you could set up Success flag to false.

    Example
    protected void TestDirectEventHandler(object sender, DirectEventArgs e)
    {
        e.Success = false;
    }
    As well you can use ExtraParamsResponse.

    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
        protected void TestDirectEventHandler(object sender, DirectEventArgs e)
        {
            e.ExtraParamsResponse.Add(new Ext.Net.Parameter("test", "Hello World!", ParameterMode.Value));
        }
    </script>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.NET Example</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Button runat="server" Text="Click me">
                <DirectEvents>
                    <Click 
                        OnEvent="TestDirectEventHandler" 
                        Success="alert(result.extraParamsResponse.test);" />
                </DirectEvents>
            </ext:Button>
        </form>
    </body>
    </html>
    Quote Originally Posted by FAS View Post
    And in that case, how should I manually set all warnings on wrong fields (that failed with first client validation before submition) to get activated and/or set any message from server side to the notifying icon? Example: 'Something went wrong validating your form. Please activate JavaScript and check all required fields and formats'.
    You can use the markInvalid method.
    http://docs.sencha.com/ext-js/3-4/#!...od-markInvalid
  5. #5
    Just a point I noticed:

    I need client side validation and also serverside validation (just in case user turned off Javascript) just as Microsoft's ASP.NET Validation controls do.
    JavaScript must be enabled for Ext.NET to function. Nothing will be rendered if JavaScript has been turned off in the browser. Server-side (or client-side) validation would be irrelevant under this scenario.
    Geoffrey McGill
    Founder
  6. #6
    Good point,Geoffrey. Anyway I belive that for security reasons permission check and data validation must be implemented always server side (controllers, business clases or just code behind) no matters they have been implemented client side or not. Someone could post from a fake raw form to that page or something. I always duplicate validation (client and server side). That's why Microsoft's validation controls, althought I hate them, offers an easy way to implement both. Anyway, on Javascript disabled scenario it won't work at all. You are right.

    Thanks Daniil. With all that information I think I can deal with a validation schema now.

    Regards
    Fernando
  7. #7
    Generally, by default all Ext.NET fields send its client values to server automatically and you can access them via respective control's server properties:

    1. TextField => Text
    2. NumberField => Number
    3. etc.

    So, it should not be a problem to validate them on server.
    Anyway I belive that for security reasons permission check and data validation must be implemented always server side (controllers, business clases or just code behind) no matters they have been implemented client side or not.
    Yes, the business model looks the best place to implement validation logic.
  8. #8
    Daniil, I am facing a problem getting text field value on DirectEvent method for a Update operation.
    I can't get actual field value from server side instance, thus that way I get the last value rendered to the form.

    When I render the form I complete all fields (server side controls) with actual database entity information on Form Load event.
    Let's say, value 'Spain'

    Me.txtName.Text = mCountry.Name
    When firing the DirectEvent for saving changes I do the oposite, filling the entity with client entered data (basic and straightforward). Let's say, value 'France'

    mCountry.Name = Me.txtName.Text

    But I get the old original value ('Spain').

    If I get the posted information, I get actual last modified value ('France')

    mCountry.Name = Request("txtName")
    Is there anyway to get on DirectEvent server side controls to be updated just as if it were a regular form Post operation?

    Thanks
    Regards
    Fernando
  9. #9
    Please start a separate forum thread for that issue to don't misc with the validation topic.

Similar Threads

  1. Replies: 4
    Last Post: Apr 30, 2012, 4:49 PM
  2. Replies: 3
    Last Post: Jul 11, 2011, 9:43 AM
  3. [CLOSED] Change toggle state form server or client side
    By caha76 in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 19, 2011, 8:46 PM
  4. Replies: 4
    Last Post: Mar 19, 2010, 11:35 AM
  5. Client & Server Side Control Validation
    By r_honey in forum 1.x Help
    Replies: 3
    Last Post: Dec 27, 2009, 5:16 AM

Tags for this Thread

Posting Permissions