首页 > 代码库 > ajax版学生管理

ajax版学生管理

aspx:

技术分享
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ajax.aspx.cs" Inherits="ajax" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src=http://www.mamicode.com/"JS/jquery-1.7.2.min.js"></script>
    <link href=http://www.mamicode.com/"CSS/StyleSheet.css" rel="stylesheet" />
    <script src=http://www.mamicode.com/"DatePicker/WdatePicker.js"></script>
</head>
<body>
    <form id="form1" runat="server">
        <input type="button" value=http://www.mamicode.com/"刷新" id="aa11" />
        <input type="button" value=http://www.mamicode.com/"添加" id="TJ" />
        <%--登录弹窗--%>
        <%--修改弹窗--%>
        <div id="tc" class="tc">
            <div id="tc-top" class="tc-top">
                学生信息修改
            </div>
            <div id="tc-main" class="tc-main">

                <div class="divc">
                    <div class="divcc1">编号:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tids" runat="server" ReadOnly="True"></asp:TextBox>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">姓名:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tname" runat="server"></asp:TextBox>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">性别:</div>
                    <div class="divcc2">
                        <asp:RadioButtonList ID="tsex" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow">
                            <asp:ListItem Text="" Value=http://www.mamicode.com/"true"></asp:ListItem>
                            <asp:ListItem Text="" Value=http://www.mamicode.com/"false"></asp:ListItem>
                        </asp:RadioButtonList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">生日:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tbirthday" runat="server"></asp:TextBox>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">民族:</div>
                    <div class="divcc2">
                        <asp:DropDownList ID="DropDownList1" runat="server"></asp:DropDownList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">班级:</div>
                    <div class="divcc2">
                        <asp:DropDownList ID="DropDownList2" runat="server"></asp:DropDownList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">成绩:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tscore" runat="server"></asp:TextBox>
                    </div>
                </div>
            </div>
            <div id="tc-bottom" class="tc-bottom">
                <div onclick="tcbtn1();" id="tc-btn1" class="tc-btn1">
                    修改
                </div>
            </div>
        </div>
        <div id="tc-zz" class="tc-zz">
        </div>
        <%--添加弹窗--%>
        <div id="tc1" class="tc">
            <div id="tc-top1" class="tc-top">
                学生信息添加
            </div>
            <div id="tc-main1" class="tc-main">
                <div class="divc">
                    <div class="divcc1">姓名:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tname1" runat="server"></asp:TextBox>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">性别:</div>
                    <div class="divcc2">
                        <asp:RadioButtonList ID="tsex1" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow">
                            <asp:ListItem Text="" Value=http://www.mamicode.com/"true" Selected="True"></asp:ListItem>
                            <asp:ListItem Text="" Value=http://www.mamicode.com/"false"></asp:ListItem>
                        </asp:RadioButtonList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">生日:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tbirthday1" runat="server"></asp:TextBox>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">民族:</div>
                    <div class="divcc2">
                        <asp:DropDownList ID="DropDownList11" runat="server"></asp:DropDownList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">班级:</div>
                    <div class="divcc2">
                        <asp:DropDownList ID="DropDownList22" runat="server"></asp:DropDownList>
                    </div>
                </div>
                <div class="divc">
                    <div class="divcc1">成绩:</div>
                    <div class="divcc2">
                        <asp:TextBox ID="tscore1" runat="server"></asp:TextBox>
                    </div>
                </div>
            </div>
            <div id="Div4" class="tc-bottom">
                <div onclick="tcbtn2();" id="tcbtn2" class="tc-btn1">
                    添加
                </div>
            </div>
        </div>
        <div id="tc-zz1" class="tc-zz">
        </div>
        <div>
            <%-- 展示内容--%>
            <table style="width: 1000px; position: relative; margin: 0 auto; background-color: green; text-align: center;">
                <thead>
                    <tr style="color: white;">
                        <td>编号</td>
                        <td>姓名</td>
                        <td>性别</td>
                        <td>生日</td>
                        <td>民族</td>
                        <td>班级</td>
                        <td>成绩</td>
                        <td>操作</td>
                    </tr>
                </thead>
                <tbody id="tt"></tbody>
            </table>

        </div>
    </form>
</body>
</html>
<script type="text/ecmascript">
    //生日
    document.getElementById("tbirthday").onfocus = function () {
        WdatePicker({ readOnly: true, maxDate: %y-%M-%d });
    }
    document.getElementById("tbirthday1").onfocus = function () {
        WdatePicker({ readOnly: true, maxDate: %y-%M-%d });
    }
    //修改
    $("#XG").live("click", function () {

        var a = $(this).attr("class");
        $.ajax({
            url: "updata1.ashx",
            data: { "ids": a },
            type: "post",
            dataType: "json",
            success: function (m) {
                $("#tids").val(m[0].ids);
                $("#tname").val(m[0].name);
                if (m[0].sex == True)
                    $("#tsex").children("input:eq(0)").get(0).checked = true;
                else
                    $("#tsex").children("input:eq(1)").get(0).checked = true;
                $("#tbirthday").val(m[0].birthday);
                $("#DropDownList1").val(m[0].nation);
                $("#DropDownList2").val(m[0].class);
                $("#tscore").val(m[0].score);
            },
            error: function () { alert("数据错误!"); }
        });
        $("#tc").animate({ top: 100 }, 500);
        $("#tc-zz").css("display", "block");
    });
    function tcbtn1() {
        $.ajax({
            url: "updata2.ashx",
            data: { "ids": $("#tids").val(), "name": $("#tname").val(), "sex": $("#tsex").children("input:eq(0)").get(0).checked, "birthday": $("#tbirthday").val(), "nation": $("#DropDownList1").val(), "class": $("#DropDownList2").val(), "score": $("#tscore").val() },
            type: "post",
            dataType: "json",
            success: function (m) {
                $("#tt").text("");
                for (var a = 0; a < m.length; a++) {
                    var ee = " <tr style=\"background-color: white;\">";
                    ee += "<td id=\"tr" + a + "\">" + m[a].ids + "</td>";
                    ee += "<td>" + m[a].name + "</td>";
                    ee += "<td>" + m[a].sex + "</td>";
                    ee += "<td>" + m[a].birthday + "</td>";
                    ee += "<td>" + m[a].nation + "</td>";
                    ee += "<td>" + m[a].class + "</td>";
                    ee += "<td>" + m[a].score + "</td>";
                    ee += "<td>";
                    var cc = m[a].ids;
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"修改\" id=\"XG\"/>";
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"删除\" id=\"SC\"/>";
                    ee += "</td>";
                    ee += " </tr>}";
                    $("#tt").append(ee);
                }
            },
            error: function () { alert("数据错误!"); }
        });
        $("#tc").animate({ top: "110" }, 200).animate({ top: "-500" }, 500, function () {
            $("#tc-zz").css("display", "none");
        });
    }
    //刷新
    $("#aa11").click(function () {
        $.ajax({
            url: "Handler.ashx",
            data: {},
            type: "post",
            dataType: "json",
            success: function (m) {
                $("#tt").text("");
                for (var a = 0; a < m.length; a++) {
                    var ee = " <tr style=\"background-color: white;\">";
                    ee += "<td id=\"tr" + a + "\">" + m[a].ids + "</td>";
                    ee += "<td>" + m[a].name + "</td>";
                    ee += "<td>" + m[a].sex + "</td>";
                    ee += "<td>" + m[a].birthday + "</td>";
                    ee += "<td>" + m[a].nation + "</td>";
                    ee += "<td>" + m[a].class + "</td>";
                    ee += "<td>" + m[a].score + "</td>";
                    ee += "<td>";
                    var cc = m[a].ids;
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"修改\" id=\"XG\"/>";
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"删除\" id=\"SC\"/>";
                    ee += "</td>";
                    ee += " </tr>}";
                    $("#tt").append(ee);
                }
            },
            error: function () { alert("数据错误!"); }
        });
    });
    //删除
    $("#SC").live("click", function () {
        var a = $(this).attr("class");
        $.ajax({
            url: "delete.ashx",
            data: { "ids": a },
            type: "post",
            dataType: "json",
            success: function (m) {
                $("#tt").text("");
                for (var a = 0; a < m.length; a++) {
                    var ee = " <tr style=\"background-color: white;\">";
                    ee += "<td id=\"tr" + a + "\">" + m[a].ids + "</td>";
                    ee += "<td>" + m[a].name + "</td>";
                    ee += "<td>" + m[a].sex + "</td>";
                    ee += "<td>" + m[a].birthday + "</td>";
                    ee += "<td>" + m[a].nation + "</td>";
                    ee += "<td>" + m[a].class + "</td>";
                    ee += "<td>" + m[a].score + "</td>";
                    ee += "<td>";
                    var cc = m[a].ids;
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"修改\" id=\"XG\"/>";
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"删除\" id=\"SC\"/>";
                    ee += "</td>";
                    ee += " </tr>}";
                    $("#tt").append(ee);
                }
            },
            error: function () { alert("数据错误!"); }
        });
    });
    //添加
    $("#TJ").live("click", function () {
        $("#tc1").animate({ top: 100 }, 500);
        $("#tc-zz1").css("display", "block");
    });
    function tcbtn2() {
        $.ajax({
            url: "insert.ashx",
            data: { "ids": $("#tids1").val(), "name": $("#tname1").val(), "sex": $("#tsex1").children("input:eq(0)").get(0).checked, "birthday": $("#tbirthday1").val(), "nation": $("#DropDownList11").val(), "class": $("#DropDownList22").val(), "score": $("#tscore1").val() },
            type: "post",
            dataType: "json",
            success: function (m) {
                $("#tt").text("");
                for (var a = 0; a < m.length; a++) {
                    var ee = " <tr style=\"background-color: white;\">";
                    ee += "<td id=\"tr" + a + "\">" + m[a].ids + "</td>";
                    ee += "<td>" + m[a].name + "</td>";
                    ee += "<td>" + m[a].sex + "</td>";
                    ee += "<td>" + m[a].birthday + "</td>";
                    ee += "<td>" + m[a].nation + "</td>";
                    ee += "<td>" + m[a].class + "</td>";
                    ee += "<td>" + m[a].score + "</td>";
                    ee += "<td>";
                    var cc = m[a].ids;
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"修改\" id=\"XG\"/>";
                    ee += "<input type=\"button\" class=\"" + cc + "\" value=http://www.mamicode.com/"删除\" id=\"SC\"/>";
                    ee += "</td>";
                    ee += " </tr>}";
                    $("#tt").append(ee);
                }
            },
            error: function () { alert("数据错误!"); }
        });
        $("#tc1").animate({ top: "110" }, 200).animate({ top: "-500" }, 500, function () {
            $("#tc-zz1").css("display", "none");
        });
    }
    //
</script>
View Code

css:

技术分享
.tc {
    position: fixed;
    width: 400px;
    left: 50%;
    margin-left: -200px;
    top: -600px;
    border: 1px solid navy;
    box-shadow: 0 0 10px black;
    z-index: 1001;
    background-color: white;
}

.tc-top {
    width: 100%;
    height: 30px;
    background-color: navy;
    color: white;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
}

.tc-main {
    padding: 20px;
    text-align: center;
}

.tc-bottom {
    position: relative;
    width: 100%;
    height: 40px;
}

.tc-btn1 {
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -50px;
    width: 100px;
    height: 30px;
    background-color: navy;
    color: white;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
}

.tc-zz {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.3;
    display: none;
    z-index: 1000;
}

.divc {
    height: 50px;
    width: 100%;
}

.divcc1 {
    text-align: right;
    height: 50px;
    width: 30%;
    float: left;
}

.divcc2 {
    text-align: left;
    height: 50px;
    width: 70%;
    float: left;
}
View Code

ashx:

1刷新:

技术分享
 public void ProcessRequest(HttpContext context)
    {
        StringBuilder sb = new StringBuilder();
        sb.Append("[");
        using (StudentsDataClassesDataContext con = new StudentsDataClassesDataContext())
        {
            List<Stu> ss = con.Stu.ToList();
            int a = ss.Count;
            int cc = 0;
            foreach (Stu s in ss)
            {
                if (s == null) continue;
                cc++;
                if (cc < a)
                { sb.Append("{\"ids\":\"" + s.Ids + "\",\"name\":\"" + s.Name + "\",\"sex\":\"" + s.Sexx + "\",\"birthday\":\"" + s.Birth + "\",\"nation\":\"" + s.NName + "\",\"class\":\"" + s.CName + "\",\"score\":\"" + s.Score + "\"},"); }
                if (cc == a)
                { sb.Append("{\"ids\":\"" + s.Ids + "\",\"name\":\"" + s.Name + "\",\"sex\":\"" + s.Sexx + "\",\"birthday\":\"" + s.Birth + "\",\"nation\":\"" + s.NName + "\",\"class\":\"" + s.CName + "\",\"score\":\"" + s.Score + "\"}"); }
            }

        }
        sb.Append("]");
        context.Response.Write(sb);
        context.Response.End();
    }
View Code

2.修改1:

技术分享
tringBuilder sb = new StringBuilder();
        sb.Append("[");
        using (StudentsDataClassesDataContext con = new StudentsDataClassesDataContext())
        {
            string s1 = context.Request["ids"];
            Stu sa = con.Stu.Where(r => r.Ids.ToString() == s1).FirstOrDefault();
            if (sa != null)
                sb.Append("{\"ids\":\"" + sa.Ids + "\",\"name\":\"" + sa.Name + "\",\"sex\":\"" + sa.Sex + "\",\"birthday\":\"" + Convert.ToDateTime(sa.Birthday).ToString("yyyy-MM-dd") + "\",\"nation\":\"" + sa.NationCode + "\",\"class\":\"" + sa.ClassCode + "\",\"score\":\"" + sa.Score + "\"}");
        }
        sb.Append("]");
        context.Response.Write(sb);
        context.Response.End();
View Code

修改2:

技术分享
StringBuilder sb = new StringBuilder();
        sb.Append("[");
        string a = context.Request["ids"];
        string b = context.Request["name"];
        string c = context.Request["sex"];
        string d = context.Request["birthday"];
        string e = context.Request["nation"];
        string f = context.Request["class"];
        string g = context.Request["score"];
        using (StudentsDataClassesDataContext con = new StudentsDataClassesDataContext())
        {
            Stu s = con.Stu.Where(r => r.Ids.ToString() == a).FirstOrDefault();
            if (s != null)
            {
                s.Name = b;
                s.Sex = Convert.ToBoolean(c);
                s.Birthday = Convert.ToDateTime(d);
                s.NationCode = e;
                s.ClassCode = f;
                s.Score = Convert.ToInt32(g);
                con.SubmitChanges();
            }
            List<Stu> ss = con.Stu.ToList();
            int a1 = ss.Count;
            int cc = 0;
            foreach (Stu s1 in ss)
            {
                cc++;
                if (cc < a1)
                { sb.Append("{\"ids\":\"" + s1.Ids + "\",\"name\":\"" + s1.Name + "\",\"sex\":\"" + s1.Sexx + "\",\"birthday\":\"" + s1.Birth + "\",\"nation\":\"" + s1.NName + "\",\"class\":\"" + s1.CName + "\",\"score\":\"" + s1.Score + "\"},"); }
                if (cc == a1)
                { sb.Append("{\"ids\":\"" + s1.Ids + "\",\"name\":\"" + s1.Name + "\",\"sex\":\"" + s1.Sexx + "\",\"birthday\":\"" + s1.Birth + "\",\"nation\":\"" + s1.NName + "\",\"class\":\"" + s1.CName + "\",\"score\":\"" + s1.Score + "\"}"); }
            }
            sb.Append("]");
            context.Response.Write(sb);
            context.Response.End();
        }
View Code

3.添加:

技术分享
 StringBuilder sb = new StringBuilder();
        sb.Append("[");
        string b = context.Request["name"];
        string c = context.Request["sex"];
        string d = context.Request["birthday"];
        string e = context.Request["nation"];
        string f = context.Request["class"];
        string g = context.Request["score"];
        using (StudentsDataClassesDataContext con = new StudentsDataClassesDataContext())
        {
            Stu s = new Stu();
            s.Name = b;
            s.Sex = Convert.ToBoolean(c);
            s.Birthday = Convert.ToDateTime(d);
            s.NationCode = e;
            s.ClassCode = f;
            s.Score = Convert.ToInt32(g);
            con.Stu.InsertOnSubmit(s);
            con.SubmitChanges();
            List<Stu> ss = con.Stu.ToList();
            int a1 = ss.Count;
            int cc = 0;
            foreach (Stu s1 in ss)
            {
                cc++;
                if (cc < a1)
                { sb.Append("{\"ids\":\"" + s1.Ids + "\",\"name\":\"" + s1.Name + "\",\"sex\":\"" + s1.Sexx + "\",\"birthday\":\"" + s1.Birth + "\",\"nation\":\"" + s1.NName + "\",\"class\":\"" + s1.CName + "\",\"score\":\"" + s1.Score + "\"},"); }
                if (cc == a1)
                { sb.Append("{\"ids\":\"" + s1.Ids + "\",\"name\":\"" + s1.Name + "\",\"sex\":\"" + s1.Sexx + "\",\"birthday\":\"" + s1.Birth + "\",\"nation\":\"" + s1.NName + "\",\"class\":\"" + s1.CName + "\",\"score\":\"" + s1.Score + "\"}"); }
            }
            sb.Append("]");
            context.Response.Write(sb);
            context.Response.End();
        }
View Code

4.删除:

技术分享
 StringBuilder sb = new StringBuilder();
        sb.Append("[");
        using (StudentsDataClassesDataContext con = new StudentsDataClassesDataContext())
        {
            string s1 = context.Request["ids"];
            Stu sa = con.Stu.Where(r => r.Ids.ToString() == s1).FirstOrDefault();
            con.Stu.DeleteOnSubmit(sa);
            con.SubmitChanges();
            List<Stu> ss = con.Stu.ToList();
            int a = ss.Count;
            int cc = 0;
            foreach (Stu s in ss)
            {
                cc++;
                if (cc < a)
                { sb.Append("{\"ids\":\"" + s.Ids + "\",\"name\":\"" + s.Name + "\",\"sex\":\"" + s.Sexx + "\",\"birthday\":\"" + s.Birth + "\",\"nation\":\"" + s.NName + "\",\"class\":\"" + s.CName + "\",\"score\":\"" + s.Score + "\"},"); }
                if (cc == a)
                { sb.Append("{\"ids\":\"" + s.Ids + "\",\"name\":\"" + s.Name + "\",\"sex\":\"" + s.Sexx + "\",\"birthday\":\"" + s.Birth + "\",\"nation\":\"" + s.NName + "\",\"class\":\"" + s.CName + "\",\"score\":\"" + s.Score + "\"}"); }
            }
        }
        sb.Append("]");
        context.Response.Write(sb);
        context.Response.End();
View Code

 

ajax版学生管理