Определить, является ли форма Asp.Net допустимой с помощью javascript / jquery - PullRequest
Новая
       14

Определить, является ли форма Asp.Net допустимой с помощью javascript / jquery

5 голосов
/ 30 марта 2010

У меня есть форма, которая находится в updatePanel, и у меня есть промежуток со скрытым загрузочным изображением, которое я хочу показать, когда пользователь нажимает кнопку отправки, но сначала мне нужно проверить, является ли страница действительной на стороне клиента. Также я делаю загрузочный промежуток видимым с помощью jQuery. Вот мой код: 

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    function showLoading() {
        $('#loader').show();
    }
    </script>
</head>

<body>
<asp:ScriptManager ID="smMain" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="upForm" runat="server">
<ContentTemplate>
    <asp:MultiView ID="mvContact" runat="server" ActiveViewIndex="0">
        <asp:View ID="vDefault" runat="server">
            <asp:TextBox ID="tEMail" runat="server" CssClass="input" />
            <asp:RequiredFieldValidator ID="rfvEMail" runat="server" ControlToValidate="tEMail" ErrorMessage="* required" Display="Dynamic" />
            <asp:RegularExpressionValidator ID="revEMail" runat="server" ControlToValidate="tEMail" ErrorMessage="* invalid" Display="Dynamic" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" />
            <asp:ImageButton ID="btnSubmit" runat="server" ImageUrl="~/Assets/Images/btnSubmit.png" ToolTip="Submit Form" style="margin:5px 5px 0 -5px" onclick="btnSubmit_Click" OnClientClick="showLoading();" />
            <span id="loader"><img src="Assets/Images/loader.gif" title="Sending..." /></span>
        </asp:View>
        <asp:View ID="vResult" runat="server">
            <div class="result">
                <span id="lResult" runat="server">Your message is sent</span>
            </div>
        </asp:View>
    </asp:MultiView>
</ContentTemplate>
</asp:UpdatePanel>
</body></html>

Ответы [ 4 ]

13 голосов
/ 30 марта 2010

Хорошо, я нашел решение. Page_ClientValidate () добивается цели. 

function showLoading() {
    if (Page_ClientValidate()) { $("#loader").show(); }
        else { alert("Form is invalid!"); }
    }
3 голосов
/ 11 июля 2014

Я думаю, что было бы лучше использовать свойство Page_IsValid вместо метода Page_ClientValidate (). 

function showLoading() {
if (Page_IsValid) { $("#loader").show(); }
    else { alert("Form is invalid!"); }
}
1 голос
/ 24 сентября 2014

Если вы не хотите вызывать Page_ClientValidate (), вы можете использовать Page_IsValid, но установить время ожидания так, чтобы проверка выполнялась первой. 

OnClientClick="javascript:setTimeout(function() { if (Page_IsValid) document.getElementById('preloader').style.display='block';}, 1000);"

прелоадер скрыт посередине

<img src="/images/preloader.gif" id="preloader" style="display:none; position: fixed; top: 50%; left: 50%; margin-top: -50px; margin-left: -100px;" />

0 голосов
/ 20 сентября 2013

Спасибо, Хасан, ты сделал мой день :)

Я хочу поделиться своей проблемой и разрешением. У меня есть страница ASP.NEt с использованием MasterPage. При отправке формы я использовал эффект fadeOut, чтобы скрыть кнопки. Однако, если форма не заполнена, кнопки исчезли. Я просто добавляю условие о предложении Хасана к проблеме ОП. Вот мой окончательный код. 

//Fade out buttons when clicked but only if page validate
$('.button').click(function () {
    if (Page_ClientValidate()) { $('.button').fadeOut('slow'); }
});//End of Fade out buttons

Еще раз спасибо, Хасан:)

...