What's New?

[CLOSED] fire the DirectEvent ONLY when form is valid

  1. #1
    Jun 06, 2012, 7:12 PM

    [CLOSED] fire the DirectEvent ONLY when form is valid

    Hello,
    I am trying to save my form's vales only when the form is validated correctly. But the code I get from this link (https://examples1.ext.net/#/Form/FormPanel/Validation/) always fire the DirectEvent call regardless of the form's status.
    Is there anyway to make the DirectEvent fires only when the form is valid?

    Below is my code:
    
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="Web.Pages.test" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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></title>
    <style type="text/css">
        .icon-exclamation
        {
            padding-left: 25px !important;
            background: url(/icons/exclamation-png/ext.axd) no-repeat 3px 3px !important;
        }
        .icon-accept
        {
            padding-left: 25px !important;
            background: url(/icons/accept-png/ext.axd) no-repeat 3px 3px !important;
        }
    </style>

    <script runat="server">
        protected void BtnSaveClick(object sender, DirectEventArgs e)
        {
            X.Msg.Notify("The Server Time is: ", DateTime.Now.ToLongTimeString()).Show();
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager runat="server" />
    <ext:FormPanel ID="FormPanel1" runat="server" Title="FormPanel Validation (all fields required)"
        MonitorPoll="500" MonitorValid="true" Padding="5" Width="600" Height="250" ButtonAlign="Right"
        Layout="Column">
        <items>
                <ext:Panel runat="server" Border="false" Header="false" ColumnWidth=".5" Layout="Form" LabelAlign="Top">
                    <Defaults>
                        <ext:Parameter Name="AllowBlank" Value="false" Mode="Raw" />
                        <ext:Parameter Name="MsgTarget" Value="side" />
                    </Defaults>
                    <Items>
                        <ext:TextField ID="TextField1" runat="server" FieldLabel="First Name" AnchorHorizontal="92%" />
                        <ext:TextField runat="server" FieldLabel="Company" AnchorHorizontal="92%" />
                    </Items>
                </ext:Panel>
                <ext:Panel runat="server" Border="false" Layout="Form" ColumnWidth=".5" LabelAlign="Top">
                    <Defaults>
                        <ext:Parameter Name="AllowBlank" Value="false" Mode="Raw" />
                        <ext:Parameter Name="MsgTarget" Value="side" />
                    </Defaults>
                    <Items>
                        <ext:TextField runat="server" FieldLabel="Last Name" AnchorHorizontal="92%" />
                        <ext:TextField runat="server" FieldLabel="Email" Vtype="email" AnchorHorizontal="92%" />
                    </Items>
                </ext:Panel>
            </items>
        <buttons>
                <ext:Button runat="server" Text="Save">
                 <DirectEvents>
                                                <Click OnEvent="BtnSaveClick">
                                                    <EventMask ShowMask="true" Msg="Saving Run Details..." />
                                                    
                                                </Click>
                                            </DirectEvents>
                    <Listeners>
                        <Click Handler="if (#{FormPanel1}.getForm().isValid()) {Ext.Msg.alert('Submit', 'Saved!');}else{Ext.Msg.show({icon: Ext.MessageBox.ERROR, msg: 'FormPanel is incorrect', buttons:Ext.Msg.OK});}" />
                    </Listeners>
                </ext:Button>
                <ext:Button runat="server" Text="Cancel" />
            </buttons>
        <bottombar>
                <ext:StatusBar runat="server" Height="25" />
            </bottombar>
        <listeners>
                <ClientValidation Handler="this.getBottomToolbar().setStatus({text : valid ? 'Form is valid' : 'Form is invalid', iconCls: valid ? 'icon-accept' : 'icon-exclamation'});" />
            </listeners>
    </ext:FormPanel>
    </form>
</body>
</html>
    Last edited by Daniil; Jun 07, 2012 at 1:03 PM. Reason: [CLOSED]
  2. #2
    Jun 07, 2012, 4:28 AM
    Hi,

    You should return false from DirectEvent Before handler or the same event client listener.

    Example
    <%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void TestDirectEventHandler(object sender, DirectEventArgs e)
    {
        X.Msg.Alert("DirectEvent", "Hello from Server!").Show();
    }
</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="With Before handler">
            <DirectEvents>
                <Click OnEvent="TestDirectEventHandler" Before="return false;" />
            </DirectEvents>
        </ext:Button>

        <ext:Button runat="server" Text="With listener">
            <Listeners>
                <Click Handler="return false;" />
            </Listeners>
            <DirectEvents>
                <Click OnEvent="TestDirectEventHandler" />
            </DirectEvents>
        </ext:Button>
    </form>
</body>
</html>
    Returning true causes a DirectEvent to be fired.

    So, in your case you should return a FormPanel validation status.
  3. #3
    Jun 07, 2012, 1:00 PM
    Thank you very much for your help! This fixed my problem.


    Quote Originally Posted by Daniil View Post
    Hi,

    You should return false from DirectEvent Before handler or the same event client listener.

    Example
    <%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void TestDirectEventHandler(object sender, DirectEventArgs e)
    {
        X.Msg.Alert("DirectEvent", "Hello from Server!").Show();
    }
</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="With Before handler">
            <DirectEvents>
                <Click OnEvent="TestDirectEventHandler" Before="return false;" />
            </DirectEvents>
        </ext:Button>

        <ext:Button runat="server" Text="With listener">
            <Listeners>
                <Click Handler="return false;" />
            </Listeners>
            <DirectEvents>
                <Click OnEvent="TestDirectEventHandler" />
            </DirectEvents>
        </ext:Button>
    </form>
</body>
</html>
    Returning true causes a DirectEvent to be fired.

    So, in your case you should return a FormPanel validation status.

Similar Threads

  1. [CLOSED] Ext.net.DirectEvent.request don't fire my success function
    By emmanuel.sans.domenech in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 06, 2012, 10:32 AM
  2. [CLOSED] Disable Selection on TreePanel on form no valid
    By rbarr in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Dec 14, 2011, 9:35 AM
  3. [CLOSED] Fire directevent from javascript
    By jmcantrell in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 15, 2011, 5:05 PM
  4. [CLOSED] Form status bar without valid icon
    By 78fede78 in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 05, 2010, 4:40 PM
  5. Form validation doesn't fire
    By caha76 in forum 1.x Help
    Replies: 0
    Last Post: May 04, 2010, 12:15 PM

Tags for this Thread

Posting Permissions