TextBox设置OnTextChanged后验证控件失效问题的解决

2022-01-27 00:46:42

做前台功能设计的时候，遇到以下需求：
文本框显示数据库中原来的文本，鼠标点击文本框即变为编辑状态，编辑结束时执行内容存储的后台事件。
显示文本时的样式和与编辑状态时的样式风格也要求有不同。

实验中遇到以下问题：初次页面展现时，如果文本框输入不正确，触发了验证控件。改变文本框的输入正确后，焦点离开事件顺利执行。当再次将文本框的值输入异常时，验证控件没有显示异常，后台事件依然进行了。显然与逻辑不符合了，用验证控件的目的就是如果前台页面验证不满足的情况下，肯定不允许执行后台事件的。

辛苦一番之后，问题解决：
验证控件需设置以下2个属性，让其不做客户端脚本处理，直接调后台事件，但又要显示错误信息
EnableClientScript="False"
Display="Dynamic"

同时在后台TextChanged事件中也应检查页面验证的情况

protected void TextBox1_TextChanged(object sender, EventArgs e)

{

if (Page.IsValid)
TextBox设置OnTextChanged后验证控件失效问题的解决

{

[YourCode]
TextBox设置OnTextChanged后验证控件失效问题的解决

}

为了让使用效果更加友好，把这些控件又放在了UpdatePanel中。不闪的才是最好的。

测试项目
ASP.NET代码：（TextBox的样式变更，放在了皮肤文件中）

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<title>Untitled Page</title>

</head>

<body>

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<div>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<tr>

<asp:TextBox ID="TextBox1" runat="server" SkinID="txtchange" OnTextChanged="TextBox1_TextChanged"

CausesValidation="True" AutoPostBack="True">你好啊！</asp:TextBox>

</td>

<tr>

<asp:TextBox ID="TextBox2" runat="server" OnTextChanged="TextBox1_TextChanged" SkinID="txtchange"

CausesValidation="True" AutoPostBack="True">heekui</asp:TextBox></td>

<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="TextBox2"

EnableClientScript="False" Display="Dynamic" ErrorMessage="必须输入" Width="155px" Font-Size="Small"></asp:RequiredFieldValidator></td>

</tr>

<tr>

</td>

</tr>

<tr>

点击黄色区域，可进行编辑</td>

</tr>

</table>

</ContentTemplate>

</asp:UpdatePanel>

</div>

</form>

</body>

</html>

文本框皮肤文件：

<asp:TextBox SkinId="txtchange" onblur="this.style.backgroundColor='#FFFACD';this.style.border='solid 0px';" onfocus="this.style.backgroundColor='#FFFFFF';this.style.border='solid 1px';" runat="server" BackColor="#FFFACD" BorderStyle="Solid" BorderWidth="0px" />

后台代码：

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page

{

protected void Page_PreInit(object sender, EventArgs e)
TextBox设置OnTextChanged后验证控件失效问题的解决

{

this.Theme = "default";
TextBox设置OnTextChanged后验证控件失效问题的解决

}

protected void Page_Load(object sender, EventArgs e)
TextBox设置OnTextChanged后验证控件失效问题的解决

{

}

protected void TextBox1_TextChanged(object sender, EventArgs e)
TextBox设置OnTextChanged后验证控件失效问题的解决

{

if (Page.IsValid)
TextBox设置OnTextChanged后验证控件失效问题的解决

{

string strOut = this.TextBox1.Text + " " + this.TextBox2.Text;
TextBox设置OnTextChanged后验证控件失效问题的解决

this.Label1.Text = strOut;
TextBox设置OnTextChanged后验证控件失效问题的解决

}

示例工程下载：
/Files/heekui/TxtChange.rar

码农公寓

相关文章