码迷,mamicode.com
首页 > Web开发 > 详细

JQuery Ajax 获取数据

时间:2016-10-08 01:54:58      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:

前台页面:   对一张进行查询,删除,添加

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="jquery.js"></script>
</head>
<body>
    <span id="s1"></span>
    <input type="button" id="gget" value="获取" />
    <div id="tb"></div>
</body>
</html>
<script>
   //获取表
    $("#gget").click(function () {
        //把id为tb的Html清除
        $("#tb").html("");
        $("#s1").append(<img src="img/Loading2.gif" />);
        //get方式传值
        $.get("table.ashx", function (data) {
            $("#s1").html("");
            //把获取的字符串添加到tb中
                var dv = "<div>" + data + "</div>";
                $("#tb").append(dv);
            });
    });
    //删除脚本
    function dd(id) {
        $("#tb").html("");
        $("#s1").append(<img src="img/Loading2.gif" />);
        //把你要删除的ID传过去做删除
        $.get("table.ashx", { "id": id }, function (data) {
               $("#s1").html("");
                var dv = "<div>" + data + "</div>";
                $("#tb").append(dv);
          });
        };
     //添加脚本
    function ff() {
        //如果按钮为添加
        if ($("#in").val() == "添加") {
            //判断账号不为空
            if ($("#name").val().trim()== "") {
                alert("账号不能为空");
                return;
            }     
            else {
                //判断密码不为空
                if ($("#pwd").val().trim() == "") {
                    alert("密码不能为空");
                    return;
                }
                    //密码账号不为空就做添加
                else {
                    var name = $("#name").val();
                    var pwd = $("#pwd").val();
                    var sex = $("#sex").attr("checked");  //获取性别
                    var admiID = $("#Admin").val();
                    $.get("table.ashx", { "name": name, "pwd": pwd, "sex": sex, "adminID": admiID }, function (data) {
                        $("#tb").html("");
                        var dv = "<div>" + data + "</div>";
                        $("#tb").append(dv);
                    });
                }              
            }
        }
        //如果按钮为编辑  
        if ($("#in").val() == "编辑") {
            //把按钮改为添加
            $("#in").val("添加");
            //激活控件
            $("#name,#pwd,#sex,#Admin").removeAttr("disabled");
        }
      
    }
</script>

        

后台页面:   一般处理程序

<%@ WebHandler Language="C#" Class="table" %>

using System;
using System.Web;
using DAL;
using System.Data;
using System.Data.SqlClient;

public class table : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        //如果ID不为空就是做删除
        if (context.Request.QueryString["id"]!=null)
        {
            int id = int.Parse(context.Request.QueryString["id"].ToString());
            int r = SQLHelper.ExecuteNonQuery("delete Users where ID=@0", CommandType.Text, id);
            if (r>0)
            {
                Common(context);
            }
        }
        else
        {
            //如果name不为空就做添加
            if (context.Request.QueryString["name"]!=null)
            {
                string name = context.Request.QueryString["name"].ToString();
                string pwd = context.Request.QueryString["pwd"].ToString();
                bool sex = bool.Parse(context.Request.QueryString["sex"].ToString());
                int adminID = int.Parse(context.Request.QueryString["adminID"].ToString());
                int i = SQLHelper.ExecuteNonQuery("insert into Users values(@0,@1,@2,@3)", CommandType.Text, name, pwd,adminID,sex );
                if (i>0)
                {
                    Common(context);
                }
            }
                //都为空就是获取表
            else
            {
                Common(context);
            }
          
        }
      
    }
    public void Common(HttpContext context)
    {
        SqlDataReader dr = SQLHelper.ExecuteReader("select * from Users", CommandType.Text);
        string newTable = "<table cellspacing=‘1‘ cellpadding=‘3‘ id=‘GridView1‘ style=‘background-color:White;border-color:White;border-width:2px;border-style:Ridge;‘><tr style=‘color:#E7E7FF;background-color:#4A3C8C;font-weight:bold;‘><th scope=‘col‘>ID</th><th scope=‘col‘>UserName</th><th scope=‘col‘>Password</th><th scope=‘col‘>Sex</th><th scope=‘col‘>AdminID</th><th scope=‘col‘>删除</th></tr>";
        //加载  数据行的字符串
    
while (dr.Read())    {    string sex = "checked=‘checked‘";   if (dr[4].ToString().ToLower() == "false") sex = "";   newTable += "<tr style=‘color:Black;background-color:#DEDFDE;‘><td>" + dr[0] + "</td><td>" + dr[1] + "</td><td>" + dr[2] + "</td><td><span class=‘aspNetDisabled‘><input type=‘checkbox‘" + sex + " disabled=‘disabled‘ /></span></td><td>" + dr[3] + "</td>" +    "<td><input type=‘button‘ onclick=‘javascript:dd(" + dr[0] + ")‘ value=‘删除‘ /></td></tr>"; //<a href=‘javascript:__doPostBack(&#39;GridView1&#39;,&#39;Delete$0&#39;)‘ style=‘color:Black;‘></a>   } dr.Close();
//加载 添加行的字符串 newTable
+= "<tr style=‘color:Black;background-color:#DEDFDE;‘><td></td><td> <input type=‘text‘ id=‘name‘"+ " disabled=‘disabled‘ /></td><td><input type=‘password‘ id=‘pwd‘ disabled=‘disabled‘ /></td><td><span "+ " class=‘aspNetDisabled‘><input type=‘checkbox‘ id=‘sex‘ disabled=‘disabled‘ /></span></td><td>"+ " <select id=‘Admin‘ disabled=‘disabled‘ >" + "<option value=‘1‘>Admin</option>"+ " <option value=‘2‘>Guest</option>"+ "<option selected value=‘3‘>User</option>" + "</select></td>" + "<td><input type=‘button‘ id=‘in‘ onclick=‘javascript:ff()‘ value=‘编辑‘ /></td></tr>"; newTable += "</table>";
//一张完整的表的字符串 context.Response.Write(newTable); }
public bool IsReusable { get { return false; } } }

 

JQuery Ajax 获取数据

标签:

原文地址:http://www.cnblogs.com/Sea1ee/p/5936975.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!