zoukankan      html  css  js  c++  java

  • 023-异步新闻分页增删改查

    完成新闻分类表crud(page)

    -》列表提示：$.parseJSON('')可以将字符串转成json对象
    -》注意：使用$.getJSON()会有缓存，所以需要处理一下url，如加入随机数或时间

    TypeList.html

     1 <!DOCTYPE html>
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title></title>
 6     <script src="js/jquery-1.7.1.min.js"></script>
 7     <script>
 8         pCurrentIndex = 1;
 9         $(function () {
10             LoadList(1);
11         });
12 
13         function LoadList(pIndex) {
14             pCurrentIndex = pIndex;
15             $.getJSON(
16                 'TypeList.ashx',
17                 {
18                     pIndex: pIndex
19                 },
20                 function (data) {
21                     //{List:[{Id:,Title:}...],PageBar:...}
22                     var list = $('#list');
23                     list.empty();
24                     $.each(data.List, function (index, item) {
25                         list.append('<tr>' +
26                             '<td>' + item.Id + '</td>' +
27                             '<td>' + item.Title + '</td>' +
28                             '<td><a href="TypeEdit.aspx?id=' + item.Id + '">修改</a></td>' +
29                             '<td><a href="javascript:RemoveConfirm(' + item.Id + ')">删除</a></td>' +
30                             '</tr>');
31                     });
32                     list.append('<tr>' +
33                         '<td colspan="4" align="center">' + data.PageBar + '</td>' +
34                         '</tr>');
35                     //执行以下代码时，可以获取超链接，进行分页改写
36                     $('.pagebar').each(function () {
37                         var pIndex1 = $(this).attr('href');
38                         $(this).attr('href', 'javascript:LoadList(' + pIndex1 + ')');
39                     });
40                 }
41             );
42         }
43 
44         function RemoveConfirm(id) {
45             if (confirm('确定要删除吗？')) {
46                 $.post(
47                     'TypeDelete.ashx',
48                     {
49                         id: id
50                     },
51                     function (msg) {
52                         if (msg == 1) {
53                             LoadList(pCurrentIndex);
54                         } else {
55                             alert('删除失败');
56                         }
57                     }
58                 );
59             }
60         }
61     </script>
62 </head>
63 <body>
64     <a href="TypeAdd.html">添加</a>
65     <hr />
66     <table border="1">
67         <tr>
68             <th width="80">编号</th>
69             <th width="100">标题</th>
70             <th width="100">修改</th>
71             <th width="100">删除</th>
72         </tr>
73         <tbody id="list"></tbody>
74     </table>
75 </body>
76 </html>

    TypeList.ashx

      1     public class TypeList : IHttpHandler
  2     {
  3 
  4         public void ProcessRequest(HttpContext context)
  5         {
  6             context.Response.ContentType = "text/plain";
  7 
  8             #region 构造分页字符串
  9 
 10             int pageIndex = 1, pageSize = 2;
 11             if (!string.IsNullOrEmpty(context.Request["pIndex"]))
 12             {
 13                 pageIndex = int.Parse(context.Request["pIndex"]);
 14             }
 15             string pagerBar = GetPagerBar(ref pageIndex, pageSize);
 16             #endregion
 17 
 18             #region 得到当前页数据
 19             //构造目标集合
 20             List<ListItem> list = new List<ListItem>();
 21 
 22             //查询得到数据
 23             string sql = "select * from TypeInfoList where rowIndex between @rowStart and @rowEnd";
 24             SqlParameter[] ps =
 25             {
 26                 new SqlParameter("@rowStart",(pageIndex-1)*pageSize+1),
 27                 new SqlParameter("@rowEnd",pageIndex*pageSize)
 28             };
 29             DataTable dt = SqlHelper.GetList(sql, ps);
 30 
 31             //将数据存到目标集合
 32             foreach (DataRow row in dt.Rows)
 33             {
 34                 list.Add(new ListItem()
 35                 {
 36                     Id = Convert.ToInt32(row["TypeId"]),
 37                     Title = row["TypeTitle"].ToString()
 38                 });
 39             }
 40 
 41             #endregion
 42 
 43             //序列化
 44             //{List:[],PageBar:...}
 45             //匿名对象
 46             var result1 = new
 47             {
 48                 List = list,
 49                 PageBar = pagerBar
 50             };
 51 
 52             JavaScriptSerializer js = new JavaScriptSerializer();
 53             string result = js.Serialize(result1);
 54 
 55             context.Response.Write(result);
 56         }
 57 
 58         private string GetPagerBar(ref int pageIndex, int pageSize)
 59         {
 60             StringBuilder sb = new StringBuilder();
 61 
 62             if (pageIndex < 1)
 63             {
 64                 pageIndex = 1;
 65             }
 66 
 67             if (pageIndex == 1)
 68             {
 69                 sb.Append("首页 上一页 ");
 70             }
 71             else
 72             {
 73                 sb.Append("<a href='1' class='pagebar'>首页</a> ");
 74                 sb.Append("<a href='" + (pageIndex - 1) + "'  class='pagebar'>上一页</a> ");
 75             }
 76 
 77             string sql = "select count(*) from typeinfo";
 78             int rowsCount = Convert.ToInt32(SqlHelper.ExecuteScalar(sql));
 79             int pageCount = Convert.ToInt32(Math.Ceiling(rowsCount * 1.0 / pageSize));
 80 
 81             if (pageIndex > pageCount)
 82             {
 83                 pageIndex = pageCount;
 84             }
 85 
 86             if (pageIndex == pageCount)
 87             {
 88                 sb.Append("下一页 末页");
 89             }
 90             else
 91             {
 92                 sb.Append("<a href='" + (pageIndex + 1) + "' class='pagebar'>下一页</a> ");
 93                 sb.Append("<a href='" + pageCount + "' class='pagebar'>末页</a> ");
 94             }
 95             return sb.ToString();
 96         }
 97 
 98         public bool IsReusable
 99         {
100             get
101             {
102                 return false;
103             }
104         }
105     }
106 
107     public class ListItem
108     {
109         public int Id { get; set; }
110         public string Title { get; set; }
111     }

    TypeAdd.html

     1 <!DOCTYPE html>
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title></title>
 6     <script src="js/jquery-1.7.1.min.js"></script>
 7     <script>
 8         $(function () {
 9             $('#btnAdd').click(function () {
10                 $.post(
11                     'TypeAdd.ashx',
12                     $('#form1').serializeArray(),
13                     function (msg) {
14                         if (msg == 1) {
15                             location.href = 'TypeList.html';
16                         } else {
17                             alert('添加失败');
18                         }
19                     }
20                 );
21             });
22         });
23     </script>
24 </head>
25 <body>
26     <form id="form1">
27         标题：<input type="text" name="title" />
28         <br />
29         <input type="button" id="btnAdd" value="添加" />
30     </form>
31 </body>
32 </html>

    TypeAdd.ashx

     1     public class TypeAdd : IHttpHandler
 2     {
 3 
 4         public void ProcessRequest(HttpContext context)
 5         {
 6             context.Response.ContentType = "text/plain";
 7 
 8             string title = context.Request["title"];
 9 
10             string sql = "insert into typeinfo values(@title)";
11             SqlParameter p = new SqlParameter("@title", title);
12             int result = SqlHelper.ExecuteNonQuery(sql, p);
13 
14             context.Response.Write(result);
15         }
16 
17         public bool IsReusable
18         {
19             get
20             {
21                 return false;
22             }
23         }
24     }

    TypeDelete.ashx

     1     public class TypeDelete : IHttpHandler
 2     {
 3 
 4         public void ProcessRequest(HttpContext context)
 5         {
 6             context.Response.ContentType = "text/plain";
 7 
 8             string id = context.Request["id"];
 9 
10             string sql = "delete from typeinfo where typeid=@id";
11             SqlParameter p = new SqlParameter("@id", id);
12             int result = SqlHelper.ExecuteNonQuery(sql, p);
13 
14             context.Response.Write(result);
15         }
16 
17         public bool IsReusable
18         {
19             get
20             {
21                 return false;
22             }
23         }
24     }

    TypeEdit.aspx

     1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TypeEdit.aspx.cs" Inherits="t2_TypeInfo.TypeEdit" %>
 2 
 3 <!DOCTYPE html>
 4 
 5 <html xmlns="http://www.w3.org/1999/xhtml">
 6 <head runat="server">
 7     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 8     <title></title>
 9     <script src="js/jquery-1.7.1.min.js"></script>
10     <script>
11         $(function () {
12             $('#btnEdit').click(function () {
13                 $.post(
14                     'TypeEdit.aspx',
15                     $('#form1').serializeArray(),
16                     function (msg) {
17                         if (msg == 1) {
18                             location.href = "TypeList.html";
19                         } else {
20                             alert('修改失败');
21                         }
22                     }
23                 );
24             });
25         });
26     </script>
27 </head>
28 <body>
29     <form id="form1" runat="server">
30         编号：<%=Ti.TypeId %>
31         <input type="hidden" name="id" value="<%=Ti.TypeId %>" />
32         <br />
33         标题：<input type="text" name="title" value="<%=Ti.TypeTitle %>" />
34         <br />
35         <input type="button" id="btnEdit" value="修改" />
36     </form>
37 </body>
38 </html>

    TypeEdit.aspx.cs

     1     public partial class TypeEdit : System.Web.UI.Page
 2     {
 3         protected TypeInfo Ti { get; set; }
 4         protected void Page_Load(object sender, EventArgs e)
 5         {
 6             string id = Request["id"];
 7             string title = Request["title"];
 8 
 9             if (string.IsNullOrEmpty(title))
10             {
11                 //当没有请求标题时，说明要进行修改展示
12                 string sql = "select * from typeinfo where typeid=@id";
13                 SqlParameter p = new SqlParameter("@id", id);
14                 DataTable dt = SqlHelper.GetList(sql, p);
15                 DataRow row = dt.Rows[0];
16                 Ti = new TypeInfo()
17                 {
18                     TypeId = Convert.ToInt32(row["typeid"]),
19                     TypeTitle = row["typeTitle"].ToString()
20                 };
21             }
22             else
23             {
24                 Ti = new TypeInfo()
25                 {
26                     TypeId = 0,
27                     TypeTitle = "dlb"
28                 };
29                 //请求标题，说明要进行修改处理操作
30                 string sql = "update typeinfo set typetitle=@title where typeid=@id";
31                 SqlParameter[] ps =
32                 {
33                     new SqlParameter("@id", id),
34                     new SqlParameter("@title", title)
35                 };
36 
37                 int result = SqlHelper.ExecuteNonQuery(sql, ps);
38                 Context.Response.Write(result);
39                 Context.Response.End();//执行此方法，表示输出到此为止，之后的操作都不再执行
40             }
41         }
42     }

    SqlHelper.cs

     1     public static class SqlHelper
 2     {
 3         private static string connStr =
 4             System.Configuration.ConfigurationManager.ConnectionStrings["conn"].ConnectionString;
 5 
 6         public static DataTable GetList(string sql, params SqlParameter[] ps)
 7         {
 8             using (SqlConnection conn = new SqlConnection(connStr))
 9             {
10                 SqlDataAdapter sda = new SqlDataAdapter(sql, conn);
11                 sda.SelectCommand.Parameters.AddRange(ps);
12 
13                 DataTable dt = new DataTable();
14                 sda.Fill(dt);
15 
16                 return dt;
17             }
18         }
19 
20         public static int ExecuteNonQuery(string sql, params SqlParameter[] ps)
21         {
22             using (SqlConnection conn = new SqlConnection(connStr))
23             {
24                 SqlCommand cmd = new SqlCommand(sql, conn);
25                 cmd.Parameters.AddRange(ps);
26 
27                 conn.Open();
28                 return cmd.ExecuteNonQuery();
29             }
30         }
31 
32         public static object ExecuteScalar(string sql, params SqlParameter[] ps)
33         {
34             using (SqlConnection conn = new SqlConnection(connStr))
35             {
36                 SqlCommand cmd = new SqlCommand(sql, conn);
37                 cmd.Parameters.AddRange(ps);
38 
39                 conn.Open();
40                 return cmd.ExecuteScalar();
41             }
42         }
43 
44     }

    TypeInfo.cs

    1     public class TypeInfo
2     {
3         public int TypeId { get; set; }
4         public string TypeTitle { get; set; }
5     }

    Web.config

     1 <?xml version="1.0" encoding="utf-8"?>
 2 
 3 <!--
 4   有关如何配置 ASP.NET 应用程序的详细信息，请访问
 5   http://go.microsoft.com/fwlink/?LinkId=169433
 6   -->
 7 
 8 <configuration>
 9   <system.web>
10     <compilation debug="true" targetFramework="4.5" />
11     <httpRuntime targetFramework="4.5" />
12   </system.web>
13   <connectionStrings>
14     <add name="conn" connectionString="server=.;database=web1;uid=sa;pwd=123"/>
15   </connectionStrings>
16 </configuration>
  • 相关阅读:
    class 关键字
    自适应Web主页
    前端跨域解决
    HTML5新增特性
    HTTP知识点【总结篇】
    针对Web应用的【攻击模式篇】
    HTTPS和HTTP
    HTTP状态码之【整理篇】
    SpringCloud配制eureka
    maven连接国内仓库
  • 原文地址：https://www.cnblogs.com/ninghongkun/p/6353801.html
Copyright © 2011-2022 走看看