onChange事件后asp.net的ValidationSummary未显示 [英] asp.net ValidationSummary not shown after onChange event

查看:301
本文介绍了onChange事件后asp.net的ValidationSummary未显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个简单的WebForms有几个< ASP:校验> 和一个< ASP:的ValidationSummary> ...

当提交表单,一切正常,一个*旁边的文本框无效,显示和在ValidationSummary显示错误消息。

问题来当您通过任何pressing失去焦点的文本框的一个输入或点击。 (onChange事件)。
如果无效,从验证的*显示出来,但在ValidationSummary没有。

是显示在ValidationSummary仅在提交正常的行为?

看起来它是由设计,因为JS的功能,显示摘要(ValidationSummaryOnSubmit)只调用提交函数'Page_ClientValidate
但是,这是所有生成的JS左右​​....

 < D​​IV CLASS =包装>
    < H2>
        < ASP:标签ID =MainStatus=服务器的CssClass =successNotification>< / ASP:标签>
    < / H>
    <表ID =form1的=服务器>
    < ASP:的ValidationSummary ID =LoginUserValidationSummary=服务器的CssClass =failureNotification
        的ValidationGroup =LoginUserValidationGroup/>
    < ASP:标签ID =StatusError=服务器的CssClass =failureNotification>< / ASP:标签>
    !< - < ASP:面板ID =pnlMyForm=服务器DefaultButton =LoginButton> - >
        <字段集类=登陆=服务器ID =FormFieldset>
            <传奇>帐户信息与LT; /传说>
            &所述p为H.;
                < ASP:标签ID =UserNameLabel=服务器AssociatedControlID =用户名>用户名:​​其中; / ASP:标签>
                < ASP:文本框ID =用户名=服务器的CssClass =TEXTENTRY>< / ASP:文本框>
                < ASP:的RequiredFieldValidator ID =UserNameRequired=服务器的ControlToValidate =用户名
                    的CssClass =failureNotification显示=动态的ErrorMessage =用户名是必需的。工具提示=用户名是必需的。
                    的ValidationGroup =LoginUserValidationGroup> * LT; / ASP:&的RequiredFieldValidator GT;
            &所述; / P>
            < p n =CurrentPwd=服务器>
                < ASP:标签ID =CurrentPasswordLabel=服务器AssociatedControlID =CurrentPassword>当前密码:LT; / ASP:标签>
                < ASP:文本框ID =CurrentPassword=服务器的CssClass =passwordEntry的TextMode =密码>< / ASP:文本框>
                < ASP:的RequiredFieldValidator ID =ConfirmPasswordValid=服务器的ControlToValidate =CurrentPassword
                    的CssClass =failureNotification显示=动态的ErrorMessage =当前密码是必需的。工具提示=当前密码是必需的。
                    的ValidationGroup =LoginUserValidationGroup> * LT; / ASP:&的RequiredFieldValidator GT;
                < ASP:CompareValidator ID =ConfirmPasswordComp=服务器ControlToCompare =密码
                    的ControlToValidate =CurrentPassword的CssClass =failureNotification显示=动态
                    操作=NotEqual的ErrorMessage =当前密码和新密码必须是不同的。
                    的ValidationGroup =LoginUserValidationGroup> * LT; / ASP:CompareValidator>
            &所述; / P>
            < p = IDPDW=服务器>
                < ASP:标签ID =PasswordLabel=服务器AssociatedControlID =密码HEIGHT =21px>新建密码:LT; / ASP:标签>
                < ASP:文本框ID =密码=服务器的CssClass =passwordEntry的TextMode =密码>< / ASP:文本框>
                < ASP:显示的RequiredFieldValidator =动态ID =PasswordRequired=服务器的ControlToValidate =密码
                    的CssClass =failureNotification的ErrorMessage =新密码是必需的。工具提示=新密码是必需的。
                    的ValidationGroup =LoginUserValidationGroup> * LT; / ASP:&的RequiredFieldValidator GT;
            &所述; / P>
            < p n =ConfirmPwd=服务器>
                < ASP:标签ID =ConfirmPasswordLabel=服务器AssociatedControlID =ConfirmPassword>确认密码:LT; / ASP:标签>
                < ASP:文本框ID =ConfirmPassword=服务器的CssClass =passwordEntry的TextMode =密码>< / ASP:文本框>
                < ASP:的RequiredFieldValidator的ControlToValidate =ConfirmPassword的CssClass =failureNotification
                    显示=动态的ErrorMessage =确认密码是必需的。 ID =ConfirmPasswordRequired
                    =服务器工具提示=确认密码是必需的。的ValidationGroup =LoginUserValidationGroup> * LT; / ASP:&的RequiredFieldValidator GT;
                < ASP:CompareValidator ID =PasswordCompare=服务器ControlToCompare =密码
                    的ControlToValidate =ConfirmPassword的CssClass =failureNotification显示=动态
                    的ErrorMessage =密码不正确确认。请确保新密码并确认密码完全匹配。
                    的ValidationGroup =LoginUserValidationGroup>&安培;&NBSP LT; / ASP:CompareValidator>
            &所述; / P>
        < /字段集>
        < p =类正确>
            <输入ID =ResetButton=服务器TYPE =复位值=清场/>
            < ASP:按钮的ID =LoginButton=服务器文本=更新密码的OnClick =Button_Update_Pwd
                的ValidationGroup =LoginUserValidationGroup/>
            < ASP:按钮的ID =UsrButton=服务器文本=下一步的OnClick =Button_Check_User
                的ValidationGroup =LoginUserValidationGroup/>
        &所述; / P>
        !< - < / ASP:面板> - >
    < /表及GT;
< / DIV>


解决方案

这是我的解决方法:

通过滚动条位置的每一个表单域获得焦点,就像时间一起存储最后聚焦的表单字段:

 <输入ID =文本1类型=文本的onfocus =SetPageActiveElement(本); /><选择一个id =选择一的onfocus =SetPageActiveElement(本);>
    <选项>选项1 LT; /选项>
< /选择>

在模糊事件(的onchange的选择)使用调用Page_ClientValidate()和力验证摘要刷新其内容。也很清楚,以防万一在模糊中最后的焦点元素。所以,你最终不得不是这样的:

 <输入ID =文本1类型=文本的onfocus =SetPageActiveElement(本);的onblur =ClearVa​​lidationSummary(); /><选择ID =选择一的onfocus =SetPageActiveElement(本);的onchange =ClearVa​​lidationSummary();>
    <选项>选项1 LT; /选项>
< /选择>

这是我的JS功能:

  VAR activeElement;//这个函数保存它集中了最后一个元素并将其保存到一个变量以后使用它
//同样适用于垂直和水平滚动位置
功能SetPageActiveElement(元素){
    activeElement =元素;
}功能ClearVa​​lidationSummary(){
    VAR VSCROLL =(的document.all document.scrollTop:window.pageYOffset);
    VAR HSCROLL =(的document.all document.scrollLeft:window.pageXOffset);
    //强制验证页面刷新验证摘要
    Page_ClientValidate();    如果(activeElement!= NULL){
        //返回上一个垂直和水平滚动条位置
        window.scrollTo(HSCROLL,VSCROLL);        SetPageActiveElement(NULL);
    }
}

希望它可以帮助别人。

I have a simple WebForms with several <asp:Validators> and one <asp:ValidationSummary>...

When submitting the form, everything works fine, an '*' is shown next to the invalid textbox and the ValidationSummary shows the error messages.

The issue comes when you lose focus on one of the textbox by either pressing enter or a click. (onChange event). The '*' from the validator shows up if invalid but the ValidationSummary does not.

Is showing the ValidationSummary ONLY during a submit a normal behavior ?

It looks like it is by design since the js function that shows the summary (ValidationSummaryOnSubmit) is only called in the Submit function 'Page_ClientValidate' But this is all generated js so ....

<div class="wrapper">
    <h2>
        <asp:Label ID="MainStatus" runat="server" CssClass="successNotification"></asp:Label>
    </h2>
    <form id="form1" runat="server">
    <asp:ValidationSummary ID="LoginUserValidationSummary" runat="server" CssClass="failureNotification"
        ValidationGroup="LoginUserValidationGroup" />
    <asp:Label ID="StatusError" runat="server" CssClass="failureNotification"></asp:Label>
    <!-- <asp:Panel ID="pnlMyForm" runat="server" DefaultButton="LoginButton"> -->
        <fieldset class="login" runat="server" id="FormFieldset">
            <legend>Account Information</legend>
            <p>
                <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Username:</asp:Label>
                <asp:TextBox ID="UserName" runat="server" CssClass="textEntry"></asp:TextBox>
                <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
                    CssClass="failureNotification" Display="Dynamic" ErrorMessage="User Name is required." ToolTip="User Name is required."
                    ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
            </p>
            <p id="CurrentPwd" runat="server">
                <asp:Label ID="CurrentPasswordLabel" runat="server" AssociatedControlID="CurrentPassword">Current Password:</asp:Label>
                <asp:TextBox ID="CurrentPassword" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                <asp:RequiredFieldValidator ID="ConfirmPasswordValid" runat="server" ControlToValidate="CurrentPassword"
                    CssClass="failureNotification" Display="Dynamic" ErrorMessage="Current Password is required." ToolTip="Current password is required."
                    ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                <asp:CompareValidator ID="ConfirmPasswordComp" runat="server" ControlToCompare="Password"
                    ControlToValidate="CurrentPassword" CssClass="failureNotification" Display="Dynamic"
                    Operator="NotEqual" ErrorMessage="The current password and new password must be different."
                    ValidationGroup="LoginUserValidationGroup">*</asp:CompareValidator>
            </p>
            <p id="Pwd" runat="server">
                <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password" Height="21px">New Password:</asp:Label>
                <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                <asp:RequiredFieldValidator Display="Dynamic" ID="PasswordRequired" runat="server" ControlToValidate="Password"
                    CssClass="failureNotification" ErrorMessage="New Password is required." ToolTip="New Password is required."
                    ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
            </p>
            <p id="ConfirmPwd" runat="server">
                <asp:Label ID="ConfirmPasswordLabel" runat="server" AssociatedControlID="ConfirmPassword">Confirm Password:</asp:Label>
                <asp:TextBox ID="ConfirmPassword" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                <asp:RequiredFieldValidator ControlToValidate="ConfirmPassword" CssClass="failureNotification"
                    Display="Dynamic" ErrorMessage="Confirmation Password is required." ID="ConfirmPasswordRequired"
                    runat="server" ToolTip="Confirmation Password is required." ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                <asp:CompareValidator ID="PasswordCompare" runat="server" ControlToCompare="Password"
                    ControlToValidate="ConfirmPassword" CssClass="failureNotification" Display="Dynamic"
                    ErrorMessage="The password was not correctly confirmed. Please ensure that the new password and confirmed password match exactly."
                    ValidationGroup="LoginUserValidationGroup">&nbsp</asp:CompareValidator>
            </p>
        </fieldset>
        <p class="right">
            <input id="ResetButton" runat="server" type="reset" value="Clear fields" />
            <asp:Button ID="LoginButton" runat="server" Text="Update Password" OnClick="Button_Update_Pwd"
                ValidationGroup="LoginUserValidationGroup" />
            <asp:Button ID="UsrButton" runat="server" Text="Next" OnClick="Button_Check_User"
                ValidationGroup="LoginUserValidationGroup" />
        </p>
        <!-- </asp:Panel> -->
    </form>
</div>

解决方案

This is my workaround:

Store the last focused form field along with the scrollbar positions every time a form field gets focus, like:

<input id="Text1" type="text" onfocus="SetPageActiveElement(this);" />

<select id="Select1" onfocus="SetPageActiveElement(this);">
    <option>option 1</option>
</select>  

Use on blur event (onchange for selects) to call Page_ClientValidate() and force validation summary to refresh its contents. Also clear the last focused element on blur just in case. So you end up having something like:

<input id="Text1" type="text" onfocus="SetPageActiveElement(this);" onblur="ClearValidationSummary();" />

<select id="Select1" onfocus="SetPageActiveElement(this);" onchange="ClearValidationSummary();">
    <option>option 1</option>
</select>

These are my js functions:

var activeElement;

// This function saves the last element which got focus and saves it on a variable to use it later
// Same thing applies for vertical and horizontal scroll position
function SetPageActiveElement(element) {
    activeElement = element; 
}

function ClearValidationSummary() {
    var vscroll = (document.all ? document.scrollTop : window.pageYOffset);
    var hscroll = (document.all ? document.scrollLeft : window.pageXOffset);
    // Forces page validation to refresh validation summaries
    Page_ClientValidate();

    if (activeElement != null) {
        // Returns the last vertical and horizontal scroll bar position 
        window.scrollTo(hscroll, vscroll);

        SetPageActiveElement(null);
    }
}

Hope it helps somebody.

这篇关于onChange事件后asp.net的ValidationSummary未显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆