利用ajax技术验证数据是否存在的一个简单例子

最新推荐文章于 2021-08-06 11:16:45 发布

y63964632

最新推荐文章于 2021-08-06 11:16:45 发布

阅读量1.1k

点赞数

分类专栏： ASP.NET ASP.NET AJAX入门文章标签： ajax webservice server 数据库 asp.net button

ASP.NET AJAX入门同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

ASP.NET

11 篇文章 0 订阅

订阅专栏

以前做添加数据的时候，是利用存储过程在数据库中首先做判断，如果存在，返回一个值来验证数据已经存在

现在注册一般论坛都可以直接验证，可以说ajax给我们带来了很大的便利，尤其是用户体验上，最近也在学习ajax技术。

项目中添加数据的时候需要对数据库的数据进行检查，顺便查了下资料，写了个简单的例子，记录下来，可以让和我一样入门级别的师弟们做个简单的参考：

由于对ajax的本质还没有深入了解，所以这里用了asp.net ajax的scriptManger和webservice(我一般都是由应用开始学的，先用控件，回头用熟悉了后追究其原理，还望大虾们多多指教学习方法)

下面说下例子的实现原理：

水平有限，写的有错的地方还望多多指教：

当文本框TextBox失去焦点的时候，onblur事件中触发的js方法中异步调用webservice中的验证方法，返回数据是否存在

直接看例子吧：

aspx页面：

 
  <%@ Page Language="C#" AutoEventWireup="true" CodeFile="BuMenTest.aspx.cs" Inherits="BuMenTest" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Services>
         <!--注册一个webservice-->
        <asp:ServiceReference Path="CheckBuMenService.asmx" />
        </Services>
        <Scripts>
         <!--注册一个js文件也可以在<head>标签内使用<script type="text/javascript" src="script/JScript.js"> 效果一样，scriptmanager提供这个方法主要是用来注册ajax提供的一些js库的-->
        <asp:ScriptReference Path="script/JScript.js" />
        </Scripts>
        </asp:ScriptManager>
        <asp:TextBox ID="txtBuMen" runat="server"></asp:TextBox>
        <asp:Label ID="lblMessage" runat="server"></asp:Label>
        <asp:Button ID="Button1" runat="server" Text="Button" />
    </form>
</body>
</html>
 
 

js文件：

 
  function CheckBuMen(){
   //方法中直接调用webservice中的方法，或许对js的陌生吧，很不理解这样的赋值方法，   把CheckBuMenService.HasBuMen(document.getElementById('txtBuMen').value)得到的值赋值给jsj函数Complete直接写成下面的方式；
    requestService = CheckBuMenService.HasBuMen(document.getElementById('txtBuMen').value, Complete);
    //下面的return false的作用还在理解中
   //发了个帖子问了下 得知，如果不满足条件，不执行后台代码~
    return false; 
}
function Complete(result){
    if(result){
        //下面注释掉的是可以在页面中放一个Label(我习惯用asp.net的服务器控件)ID=lblMessage
        //document.getElementById('lblMessager').innerHTML='提示：该部门已经存在';
        alert("提示:该部门已经存在");
    }
   else{
        //document.getElementById('lblMessager').innerHTML='提示:该部门不存在';
         alert("提示:该部门不存在");
    }
}
 
 

与页面相关的cs文件：

 
  sing System;
using System.Data;
using System.Configuration;
using System.Collections;
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 BuMenTest : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        txtBuMen.Attributes.Add("onblur", "javascript:return CheckBuMen()");
    }
}
 
 

webservice相关的cs文件：

 
  using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
/// <summary>
/// JingNoValidator 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//这句一定要加上，不然js访问不到
[System.Web.Script.Services.ScriptService]
public class CheckBuMenService : System.Web.Services.WebService
{
    public JingNoValidator()
    {
        //如果使用设计的组件，请取消注释以下行 
        //InitializeComponent(); 
    }
    #region 验证部门是否存在
    public bool HasBuMen(string BuMen)
    {
        return BuMen(BuMen);
    }
    //把验证过程隐藏了，不知道算不算对源代码的一种保护？？
    //这点回头请高手指点
    private bool BuMen(string BuMen)
    {
        string sql = string.Format("SELECT ID FROM BuMen WHERE [Name]='{0}'",BuMen);
        //SqlHelper是我们项目中的一个操作数据库的一个类
        //这里可以自己写一个对数据库的连接以及验证的方法
        //using(System.Data.SqlClient.SqlConnection conn=new System.Data.SqlClient.SqlConnection(connString)){//TODO}
        return SqlHelper.Exists(sql);
    }
    #endregion
}
 
 

很简单的例子，希望对初学者有帮助，有疑问我可以把自己掌握的说说，毕竟我也才开始接触。

结果就不指出了，如果文不能框输入的数据数据库中存在，则alert出存在，反之不存在~

y63964632

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
利用ajax技术验证数据是否存在的一个简单例子

以前做添加数据的时候，是利用存储过程在数据库中首先做判断，如果存在，返回一个值来验证数据已经存在现在注册一般论坛都可以直接验证，可以说ajax给我们带来了很大的便利，尤其是用户体验上，最近也在学习ajax技术。项目中添加数据的时候需要对数据库的数据进行检查，顺便查了下资料，写了个简单的例子，记录下来，可以让和我一样入门级别的师弟们做个简单的参考：由于对ajax的本质还没有深
复制链接

扫一扫