如何以CustomValidator搭配jQuery AJAX进行Server端验证(转)
许多网站提供使用者自行透过系统介面加入会员,为了避免使用者名称重复,常会提供使用者名称检查是否存在的机制。本文将介绍如何以CustomValidator搭配jQuery AJAX来呼叫Server端网页进而模拟验证使用者名称是否可用。
以下程式码范例为用来检查使用者名称是否存在的主要页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxCustomValid.aspx.cs" Inherits="WebApplication2.AjaxCustomValid" %><! 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 >< script src ="JS/jquery.min.js" type ="text/javascript" ></ script ><script type= "text/javascript" >function Valid(sender, args) {$.ajax({type: 'post' ,url: 'CustomValid.aspx' ,data: 'name=' + $( '#txtName' ).val(),success: function (result) {$( '#hidResult' ).val(result);},error: function () { $( '#hidResult' ).val( 'Fail' ); }})if ($( '#hidResult' ).val() == 'Pass' )args.IsValid = true ;elseargs.IsValid = false ;}; </ script ></ head >< body >< form id ="form1" runat ="server" >< div >使用者名称:< asp:TextBox ID ="txtName" runat ="server" ></ asp:TextBox >< br />< asp:HiddenField ID ="hidResult" runat ="server" />< asp:RequiredFieldValidator ID ="rfvName" runat ="server" ErrorMessage ="请输入使用者名称" Display ="None"ControlToValidate ="txtName" ></ asp:RequiredFieldValidator >< asp:CustomValidator ID ="cvName" Display ="None" runat ="server" ClientValidationFunction ="Valid" ErrorMessage ="该使用者名称已经存在!!!" ControlToValidate ="txtName" ></ asp:CustomValidator >< asp:Button ID ="Button1" runat ="server" Text ="Cehck!" onclick ="Button1_Click" />< asp:ValidationSummary ID ="vs" runat ="server" ShowMessageBox ="true" ShowSummary ="false" /></ div ></ form ></ body ></ html >
- 下列程式码为上述ASPX网页的CodeBehind类别的内容:
1: using System;
2: using System.Collections.Generic;
3: using System.Linq;
4: using System.Web;
5: using System.Web.UI;
6: using System.Web.UI.WebControls;
7:
8: namespace WebApplication2
9: {
10: public partial class AjaxCustomValid : System.Web.UI.Page
11: {
12: protected void Page_Load( object sender, EventArgs e)
13: {
14: Response.Write( string .Format( "系统时间:{0}<br/>" , DateTime.Now.ToString()));
15: }
16:
17: protected void Button1_Click( object sender, EventArgs e)
18: {
19: if (Page.IsValid)
20: Response.Write( string .Format( "使用者名称【{0}】可使用" , txtName.Text));
21: }
22: }
23: }
【程式码说明】
在Page Load事件中,显示目前的系统时间,用来确认是否验证使用者名称是否存在的动作的确为非同步呼叫,接着于Button Click事件中若Page.IsValid为真,则显示使用者所输入的名称。
- 下列程式码为用来验证使用者名称是否存在的页面,特别注意的是,我将所有HTML TAG都移除,让回传验证结果给前端时比较方便处理,不过建议要做这种没有UI的网页,还是使用泛型处理常式会比较好。
1: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CustomValid.aspx.cs" Inherits="WebApplication2.CustomValid" %>
下列程式码范例示范模拟验证使用者名称是否存在。
1: using System;
2: using System.Collections.Generic;
3: using System.Linq;
4: using System.Web;
5: using System.Web.UI;
6: using System.Web.UI.WebControls;
7:
8: namespace WebApplication2
9: {
10: public partial class CustomValid : System.Web.UI.Page
11: {
12: protected void Page_Load( object sender, EventArgs e)
13: {
14: string name = Request.Form[ "name" ];
15: //这边各位可以依照自己的商业逻辑来撰写,例如资料库存取或是其他运算
16: if ( string .IsNullOrEmpty(name))
17: Response.Write( "Fail" );
18: else
19: {
20: if (name.ToUpper() == "TERRY" )
21: Response.Write( "Fail" );
22: else
23: Response.Write( "Pass" );
24: }
25: }
26: }
27: } 注:ajax要设置成同步 async: false。这是因为ajax异步执行完设置args.IsValid时ms注册的检查这个属性是否为true的代码已经执行过了,所以ajax再设置args.IsValid就没什么作用了,不会再次触发ms注册检查args.IsValid事件。
转载于:https://www.cnblogs.com/cnBlogs-Apple/archive/2013/05/25/3099241.html
如何以CustomValidator搭配jQuery AJAX进行Server端验证(转)相关推荐
- ajax用户注册验证视频,jquery+ajax实现注册实时验证实例详解
本文实例讲述了jquery+ajax实现注册实时验证.分享给大家供大家参考,具体如下: 当我们注册一个用户时,会实时提示该用户的信息是否可用,这就是ajax的应用,很久以前就看过这个实现了,今天又看了 ...
- JQuery Ajax后台无刷新验证用户名重复,前台验证两次密码一致,后台创建并验证 验证码
写在前面 写web 的人,我想最先要解决的就是注册登录的界面了,一个小小的界面却包含着各种基本的知识,让我这个新手摸了一天. 效果图 知识 1.bootstrap渲染表单 2.JQuery ajax验 ...
- ajax点击更改div,jquery ajax双击div可直接修改div中的内容
jquery ajax双击div可直接修改div中的内容 发布于 2017-04-03 17:26:16 | 127 次阅读 | 评论: 0 | 来源: 网友投递 jQuery javascript框 ...
- ajax拿table里的th值,Jquery Ajax 异步设置Table中某列的值
可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...
- jquery ajax返回Internal server error 500错误解决方案
jquery ajax返回Internal server error 500错误解决方案 参考文章: (1)jquery ajax返回Internal server error 500错误解决方案 ( ...
- 【转】Jquery -Ajax 入门练习 Jquery.Ajax 调用后台函数,获取DataTable Json,Asp.net
直接上图=============最后拷贝源码(图片清楚) ====================================================================== ...
- Jquery Ajax时 error处理 之 parsererror
Jquery Ajax时 error处理 之 parsererror 01 $.ajax({ 02 type: "POST", 03 con ...
- 对jQuery和Ajax使用基本身份验证
我正在尝试通过浏览器创建基本身份验证,但我真的无法到达那里. 如果此脚本不在此处,则浏览器身份验证将接管,但是我想告诉浏览器用户即将进行身份验证. 地址应类似于: http://username:pa ...
- Jquery Ajax调用aspx页面方法
原文:Jquery Ajax调用aspx页面方法 在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通 ...
- jQuery Ajax详解
jQuery Ajax 全解析 本文地址: jQuery Ajax 全解析 本文作者:QLeelulu 转载请标明出处! jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并 ...
最新文章
- iOS 9应用开发教程之创建iOS 9项目与模拟器介绍
- React Native开发错误警告处理总结(已解决 !持续更新)
- windows 2008 server R2 版本概览
- DevExpress的分页Tab控件XtraTabControl控件的使用
- 计算机视觉与深度学习 | K-means聚类算法在计算机视觉中的应用之图像分割
- Docker入门总结
- android lint工作机制,Android架构
- java填充线缺口,在geom_freqpoly线下填充区域的最简单方法是什么?
- vue 新版本 webpack 代理 跨域设置
- cd linux给u盘安装程序,使用U盘安装CDlinux
- python中括号的作用_Python3--中括号[]与冒号:在列表中的作用
- 那些年删过的库,跑过的路,你从中找到解决方法了吗?
- ospf配置方法及相关问题
- mpi和openmp混合编程的优点_混合云:拥抱云计算的未来!
- 空间如何超越极小而存在
- 大数据产业发展状况及企业数据资产化运营核心
- 飙泪怀旧:那些经典的老软件、老网站
- AIX系统怎么更换服务器硬盘(mirrorvg)
- 车架号识别系统-VIN码识别查询
- 集成 FileDownloader 总结