jQuery+Ajax+asp进行数据库交互01

原创 2017年10月05日 17:24:38

在之前写的ADO操作中,每次进行数据库操作时,都会对网页进行刷新。之后,在了解jQuery(javascript库)和Ajax(异步响应)后,可以不再刷新整个网页,完成页面的响应事件。

在前端代码中,使用jQuery的Ajax方法将数据传递到服务器后台中

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="WebApplication4.ADO_practice.Login" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="../Scripts/jquery-1.10.2.min.js"></script>
        <title>数据库验证</title>
<script type="text/javascript">

    $(document).ready(function () {     //当文档加载后要运行的函数
     $("#btnLogin").click(function () {
         var a = $("#inUsername").val();
         alert(a);
        $.ajax({
            type: "get",
            url: "Login.aspx",  //访问的地址
            data: { name2: $("#inUsername").val(), pwd2: $("#inPassword").val() },  //从前端input中得到的值,作为参数传递到后台
            success: function (data) {   //根据后台回调值,完成前端页面响应事件
                if (data == 1) {
                    alert(data+"\n"+"登录成功");
                }
                if (data==0){
                    alert(data+"\n"+"失败");
                }
            }
        })
    })
 })
</script>

</head>
<body>
    <div>
        用户名:<input id="inUsername" type="text" />
        密码:  <input id="inPassword" type="password" /> 
        <button id="btnLogin" >登录</button>
    </div>

</body>
</html>

在后台代码中,对传递的值进行进行处理,将结果写入http响应输入流中,也就是前端Ajax中的data值

using System;
using System.Collections.Generic;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;


namespace WebApplication4.ADO_practice
{
    public partial class Login : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string name = Request.QueryString["name2"];
            string pwd = Request.QueryString["pwd2"];

            if (!string.IsNullOrEmpty(name) && !string.IsNullOrEmpty(pwd))
            {
                if (SqlSelect02(name,pwd)==true)
                {
                    Response.Write("1");
                    Response.End();
                }
                if(SqlSelect02(name, pwd)==false)
                {
                    Response.Write("0");
                    Response.End();
                }
            }
        }

        protected bool SqlSelect02(string name,string pwd)
        {
            SqlConnection myConn = new SqlConnection("Data Source=WIN8;Initial Catalog=SqlDataTest01;Persist Security Info=True;User ID=sa;Password=123456");
            myConn.Open();

            string sqlStr = "select * from UserTable where UserName='" + name + "' and PassWord='" + pwd + "'";

            SqlCommand myCmd = new SqlCommand(sqlStr, myConn);

            object obj = myCmd.ExecuteScalar();  //执行查询,返回结果中的第一行的第一列,忽略其他结果
            if(obj != null)
            {             
                return true;
            }
            else
            {
                return false;
            }
        }       
    }
}

结果验证:
SQL数据库
这里写图片描述

页面结果:
这里写图片描述

jQuery ajax与php进行数据交互(数据格式问题)

近期涉及到 jquery 开发,因此对jQuery做了一些初步的学习,jquery功能相对比较强大些,尤其是对ajax支持,jquery ajax与服务器交互,这种搭配使得“局部刷新,异步更新”交互方...
  • dahuzix
  • dahuzix
  • 2013年06月03日 20:57
  • 1938

Xcelsius 使用XML做为数据源 ----利用ASP与数据库进行交互,即时刷新

Xcelsius 使用XML做为数据源 ----利用ASP与数据库进行交互,即时刷新     参考文档: Connecting Xcelsius Dashboards toExternal D...
  • zzphapy
  • zzphapy
  • 2014年08月20日 10:22
  • 516

【asp.net小札记】jquery+ajax绑定数据库显示table

原文来自:http://kb.cnblogs.com/page/74416/ 前台: $(function () { ...

使用HTTP处理程序和jQuery在ASP.NET Web应用程序中的进行数据库操作

使用HTTP处理程序和jQuery在ASP.NET Web应用程序中的进行数据库操作

jQuery的ajax()检验用户名;通过jQuery的load()/get()/post()方法实现;使用XMLHTTPRequest对象来进行AJAX的异步数据交互

AJAX概述 1.什么是Ajax? Ajax是由Jesse James Garrett创造的,是“Asynchronous JavaScript + XML的简写”。 2.Adapti...

ajax和servlet交互2013-08-01

  • 2013年08月01日 23:12
  • 23KB
  • 下载

flash菜单与asp.net进行交互.txt

  • 2008年12月31日 09:08
  • 7KB
  • 下载

ASP.NET MVC3入门教程之ajax交互

本文转载自:http://www.youarebug.com/forum.php?mod=viewthread&tid=100&extra=page%3D1 随着web技术的不断发展与进步,在web...

Struct2利用Ajax,JQuery交互Json

  • 2017年08月22日 01:10
  • 15.61MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jQuery+Ajax+asp进行数据库交互01
举报原因:
原因补充:

(最多只允许输入30个字)