cpp2017(慕白兄)的专栏

f zID：cpp2017

共11099次访问，排名9710(1)好友21人，关注者222人
好的工具是成功的一半

cpp2017的文章

原创 12 篇

翻译 0 篇

转载 0 篇

评论 24 篇

cpp2017(慕白兄)的公告

由于很多网友经常提到一些问题,所以在此将这些问题整理一下.这里并没有什么很深的技术,只是一些常见且基础的问题,尽量以最简单易懂和浅显的实例,让新学者受到些启发，希望能对他们有帮助，如有不对之处，请不吝批评指正。

最近评论

jeffcn2：有一个问题，这样在服务器上不是产生了很多Excel文件，还有就是要控制输出的工作表的样式要如何控制（如：我想从A2开始输出，并设置标题为粗体居中？），请达人指点

ucemouse：我在调用File.Copy(,,true)是,提示:文件正在被另一进程使用,其实就是它自己的进程在使用,两个文件是放在同一个目录中的.请求帮助

lex1982：很有创意,我喜欢

xp1056：这个是不是要求.net版本2005以上？我在03里面用的，没体现出效果来。
比如：SetFocusOnError="True"提示验证控件的该属性找不到

xudongyh：http://blog.csdn.net/xudongyh/archive/2008/04/04/2248700.aspx

文章分类

收藏

相册

文件

存档

软件项目交易

订阅我的博客

打造自己的asp.net验证控件收藏

新一篇: asp.net导出数据到Excel的几种方法(1/3) | 旧一篇: web自定义控件示例，一个自动分页的datagrid例子

ASP.NET自带的验证控件具有使用方便，开发快捷等优点。开发人员不必使用js就可以方便地对页面各项控件进行输入验证。但是它也有些不足之处，如：界面单调，只能通过红色字体显示（当然自定义验证控件除外）；只能放在某一固定位置；需要占用一定的版面空间，如果错误消息比较长，会严重影响布局，即使将显示方式设为dynamic，当它显示错误消息时会撑大页面，影响美观，因此，我们有必要对它稍改进一下。

我们研究一下ASP.NET的js代码(下载页面中WebResource.axd?d=SD1NUwMQGhYXe3jLq5kyhRg80avbG6v4rFgfT8pf7Lg1&t=633409665581718750指向的文件）发现用来显示错误消息的是ValidatorUpdateDisplay这个函数来完成的，关键的一句，是 val.style.visibility = val.isvalid ? "hidden" : "visible";　如果我们想用alert方式显示的话，只需将这句改成alert(val.innerHTML)就可以了，但我们想做得更好看一点，做成类似于QQ聊天窗口的效果，效果可看下图：

要实现这个效果，需要以下几个图片。

以下是源码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="myvalid.aspx.cs" Inherits="Test.myvalid" %>

<style>

.MsgC

{

border-top:solid 1px #C6C3C6;

height:6px;

background-color:#FFFBEF;

font-size:1px;

}

.MsgL

{

BACKGROUND: url(images/vMsgL.gif) no-repeat left top;

width:7px;

height:6px;

}

.MsgR

{

BACKGROUND: url(images/vMsgR.gif) no-repeat ;

width:24px;

height:6px;

}

.MsgBL

{

BACKGROUND: url(images/vMsgBL.gif) no-repeat left top;

width:7px;

height:6px;

}

.MsgBC

{

BACKGROUND: url(images/vMsgBC.gif) repeat-x;

height:19px;

}

.MsgBR

{

BACKGROUND: url(images/vMsgBR.gif) no-repeat left top;

width:24px;

height:19px;

}

</style>

</head>

<div style="font-weight:bold;height:60px"> 打造自己的验证控件：</div>

姓名：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" Display="dynamic" ControlToValidate="TextBox1"

ErrorMessage="请输入姓名！" SetFocusOnError="True"></asp:RequiredFieldValidator><br />

证件号：<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

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

ErrorMessage="请输入证件号!" SetFocusOnError="True"></asp:RequiredFieldValidator>

<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" Display="dynamic" ControlToValidate="TextBox2"

ErrorMessage="证件号格式不符！" ValidationExpression="d{17}[d|X]|d{15}"></asp:RegularExpressionValidator><br />

<asp:Button ID="Button1" runat="server" Text="确定" />

</form>

</body>

</html>

function ValidatorUpdateDisplay(val) {

if (typeof(val.display) == "string") {

if (val.display == "None") {

return;

}

if (val.display == "Dynamic") {

//val.style.display = val.isvalid ? "none" : "inline";

// return;

}

if ((navigator.userAgent.indexOf("Mac") > -1) &&

(navigator.userAgent.indexOf("MSIE") > -1)) {

val.style.display = "inline";

}

ShowZfValidMsg(val);

// val.style.visibility = val.isvalid ? "hidden" : "visible";

}

function Page_ClientValidate(validationGroup) {

Page_InvalidControlToBeFocused = null;

if (typeof(Page_Validators) == "undefined") {

return true;

}

var i;

for (i = 0; i < Page_Validators.length; i++) {

ValidatorValidate(Page_Validators[i], validationGroup, null);

//Added By zhaofeng

if(!Page_Validators[i].isvalid)// only show one errmsg

{

Page_IsValid = false;

Page_BlockSubmit = !Page_IsValid;

return false;

}

//Added End

}

ValidatorUpdateIsValid();

ValidationSummaryOnSubmit(validationGroup);

Page_BlockSubmit = !Page_IsValid;

return Page_IsValid;

}

function ShowZfValidMsg(val)

{

//window.status = val.isvalid;

var tbId = "tbValidMsg";//+val.controltovalidate;

var tb = document.getElementById(tbId);

if(val.isvalid && tb == null) return;

if(tb == null)

{

tb = document.createElement("table");

tb.border= 0 ;

tb.id = tbId;

tb.cellSpacing = 0 ;

tb.cellPadding = 0 ;

var tr = tb.insertRow(0);

var cell = tr.insertCell(0);

cell.className = "MsgL";

cell = tr.insertCell(1);

cell.className = "MsgC";

cell.innerHTML = " ";

cell = tr.insertCell(2);

cell.className = "MsgR";

//the second row

tr = tb.insertRow(1);

cell = tr.insertCell(0);

cell.bgColor = "#FFFBEF";

cell.style.cssText= "border-left:solid 1px #C6C3C6";

cell.innerHTML = " "

cell = tr.insertCell(1);

cell.bgColor = "#FFFBEF";

cell.height = 40;

cell.innerHTML = "<div style='float:left;padding-top:1px'><img src='images/yellowalert.gif' /></div>"+

"<span style='color:black;font-size:12px;height:40px;width:100px;padding-top:10px;padding-bottom:10px;padding-right:0px;padding-left:3px'></span>";

cell = tr.insertCell(2);

cell.bgColor = "#FFFBEF";

cell.style.cssText= "border-right:solid 1px #C6C3C6";

cell.innerHTML = " "

//the third row

tr = tb.insertRow(2);

cell = tr.insertCell(0);

cell.className = "MsgBL";

cell = tr.insertCell(1);

cell.innerHTML = " ";

cell.className = "MsgBC";

cell = tr.insertCell(2);

cell.className = "MsgBR";

document.body.appendChild(tb);

tb.style.cssText= "position:absolute;zIndex:500";

}

tb.rows[1].cells[1].childNodes[1].innerHTML = val.innerHTML;

tb.style.display = val.isvalid?"none":"";

var obj = document.getElementById(val.controltovalidate);

if(obj !=null)

{

var ary = GetElePos(obj);

var l = ary[0]+obj.offsetWidth-tb.offsetWidth;

if(l<0) l= 0 ;

var t = ary[1]-tb.offsetHeight+15;

if(t<0) t = 0 ;

tb.style.left = l

tb.style.top = t;

}

return ;

}

function GetElePos(e)

{

var t=e.offsetTop;

var l=e.offsetLeft;

while(e=e.offsetParent){

t+=e.offsetTop;

l+=e.offsetLeft;

}

return [l, t];

}

</script>

如果想在整个系统中应用这个效果的话，只需将页面尾部的javascript脚本封装到一个js文件中，放在需要应用的页面的尾部，无需再添加任何代码。

发表于 @ 2008年04月01日 10:40:00|评论(loading...)|编辑

新一篇: asp.net导出数据到Excel的几种方法(1/3) | 旧一篇: web自定义控件示例，一个自动分页的datagrid例子

#andyleec 发表于2008-04-01 17:21:21 IP: 124.236.212.*: 太强了,真是万分感谢啊,非常炫

#haolaiwu 发表于2008-04-01 23:19:53 IP: 125.109.249.*: 效果不错，多谢
另外，提示的时候，下面的文本框被上面的提示框挡住了，重新输入的时候不方便，不知道怎么改进好

#cpp2017 发表于2008-04-01 23:24:19 IP: 58.61.73.*: 如果档住了,改一下这段代码就可

var l = ary[0]+obj.offsetWidth-tb.offsetWidth;
if(l<0) l= 0 ;
var t = ary[1]-tb.offsetHeight+15;
if(t<0) t = 0 ;
tb.style.left = l
tb.style.top = t;
比如将t 改小一些就可以

#only_endure 发表于2008-04-02 08:34:29 IP: 222.45.90.*: 收藏了，正学习自定义控件。

#haidy_lau 发表于2008-04-02 18:02:24 IP: 218.241.139.*: 试了一下,效果已经能够实现
不过,想问一下,当我再次单击每二个文本框再次填写身份证号的时候,能不能让这个提示消失(或者点击空白处时让提示消失)?
javascript不太熟,谢谢先!!

#cpp2017 发表于2008-04-02 18:17:19 IP: 121.35.72.*: 回haidy_lau
如果数据验证通过,会消失的.就如同系统默认的控件一下.

#selfhigh 发表于2008-04-02 18:58:41 IP: 124.78.221.*: 不知道其它的语言,比如PHP可不可以调用啊?谢谢!

#cpp2017 发表于2008-04-02 19:30:20 IP: 121.35.72.*: 其他语言不能直接调用,需要改造。

#haidy_lau 发表于2008-04-03 09:46:07 IP: 218.241.139.*: 对于下面这段代码不是很明白
function Page_ClientValidate(validationGroup) ...{
Page_InvalidControlToBeFocused = null;
if (typeof(Page_Validators) == "undefined") ...{
return true;
}
var i;
for (i = 0; i < Page_Validators.length; i++) ...{

ValidatorValidate(Page_Validators[i], validationGroup, null);
//Added By zhaofeng
if(!Page_Validators[i].isvalid)// only show one errmsg
...{
Page_IsValid = false;
Page_BlockSubmit = !Page_IsValid;
return false;
}
//Added End
}

ValidatorUpdateIsValid();

ValidationSummaryOnSubmit(validationGroup);
Page_BlockSubmit = !Page_IsValid;
return Page_IsValid;
}

我感觉这个应该是改造默认验证控件的代码,不过,这段代码在具体含义和作用有点不太懂,您可否简单提示一下呢?谢谢~~~

#cpp2017 发表于2008-04-03 10:37:21 IP: 218.18.61.*: 这段代码的主要功能是循环页面中的所有验证控件,一个一个去验证,如果不通过,则返回false,此时页面不能提交.
它原来的代码是验证完所有的控件,我改成了碰到一个不通过就返回,因为不想显示太多的提示信息.

#xp1056 发表于2008-04-07 10:30:53 IP: 218.58.71.*: 这个是不是要求.net版本2005以上？我在03里面用的，没体现出效果来。
比如：SetFocusOnError="True"提示验证控件的该属性找不到

#lex1982 发表于2008-04-26 10:00:00 IP: 60.177.196.*: 很有创意,我喜欢

发表评论

姓名：
主页：
校验码：看不清,换一张

当前用户设置只有注册用户才能发表评论。如果你没有登录，请点击登录