您的位置：首页 > Web前端

基于ajax的三层，实现数据库增删改查基础（五 前端界面其他功能的实现）

2017-08-03 18:22 716 查看
这么一点点写太麻烦了，直接上所有代码

我们的登录成功后的界面展示所有数据 html界面如下

<!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="lib/jquery-1.10.2.min.js"></script>

    

    <script type="text/javascript">

        

        $(function () {

            test1();

            window.setTimeout(function () { test(); }, 500);

            test();

        });

        //加载列表

        function test1()

        {

            $.post("tabledata.ashx", { "pageIndex": 1 }, function (data) {

                var dataNew = $.parseJSON(data);

                var length = dataNew.length;

                for (var i = 0; i < length; i++) {

                    $("<tr><td>" + dataNew[i].id + "</td>" + "<td>" + dataNew[i].username +

                        "</td>" + "<td>" + dataNew[i].userSex + "<a href='javascript:void(0)'  class='detail' nid='"

                        + dataNew[i].id + "'>删除</a>" + "<a href='webform1.aspx?id=" + dataNew[i].id +

                        "'  class='detailc' wid='" + dataNew[i].id + "'>修改</a>" + "</tr>").appendTo("#table1");

                }

            });

        }

        //删除单个值

        function test() {

            $(".detail").click(function () {

                var id = $(this).attr("nid");//获取对应Id值

                $.post("delete.ashx", { "id": id }, function (data) {

                    if (data != 0) {

                        alert("success");

                        location.reload(true);

                    }

                    else {

                        alert("fail");

                    }

                });

            });

        }

        

        

    </script>

</head>

<body>

    <a href="AddOne.html">ADDONE</a>

    <table id="table1">

        <tr>

            <th>userid</th>

            <th>username</th>

            <th>usersex</th>

        </tr>

    </table>

</body>

</html>
向界面传入所有table数据的一般处理程序代码如下

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using BLL;

using MODEL;

namespace UI

{

    /// <summary>

    /// tabledata 的摘要说明

    /// </summary>

    public class tabledata : IHttpHandler

    {

        public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            int pageIndex;

            if (!int.TryParse(context.Request.Form["pageIndex"], out pageIndex))

            {

                pageIndex = 1;

            }

            int pageSize = 5;

            BLL1 bll = new BLL1();

            int pageCount = bll
4000
.selectCount(pageSize);

            pageIndex = pageIndex < 1 ? 1 : pageIndex;

            pageIndex = pageIndex > pageCount ? pageCount : pageIndex;

            //List<userMes> li = new List<userMes>();

            //li= bll.showTable();

            List<userMes> li1 = new List<userMes>();

            li1 = bll.selectMes(1, 5);

            System.Web.Script.Serialization.JavaScriptSerializer henchang = new System.Web.Script.Serialization.JavaScriptSerializer();

            context.Response.Write(henchang.Serialize(li1));

        }

        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}

//删除的页面一般处理程序代码如下

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using BLL;

namespace UI

{

    /// <summary>

    /// delete 的摘要说明

    /// </summary>

    public class delete : IHttpHandler

    {

        public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            string id= context.Request.Form["id"];

            BLL1 B1 = new BLL1();

            int res=  B1.deleteOneB(Convert.ToInt32(id));

            context.Response.Write(res);

        }

        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}

//点击添加，跳转到另一个页面，AddOne.html

<!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="lib/jquery-1.10.2.min.js"></script>

    <script type="text/javascript">

        

        $(function () {

            $("#add").click(function () {

                var username = $("#username").val();

                var userpass = $("#userpass").val();

                $.post("ADDoneh.ashx", { "username": username, "userpass": userpass }, function success(data) {

                    if (data == 1) {

                        window.location.href="talbe.html";

                        alert("10");

                    }

                    else {

                        alert("11");

                    }

                });

            });

        });

       

    </script>

</head>

<body>

    <input type="text" id="username" />

    <input type="password" id="userpass" />

    <input type="button" value="添加" id="add"/>

 </body>

</html>

//对添加的一般处理程序如下

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using BLL;

namespace UI

{

    /// <summary>

    /// ADDoneh 的摘要说明

    /// </summary>

    public class ADDoneh : IHttpHandler

    {

        public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            string un= context.Request.Form["username"];

            string up = context.Request.Form["userpass"];

            BLL1 b = new BLL1();

            int res= b.addone(un, up);

            context.Response.Write(res);

        }

        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航