AJAX无刷新分页练习

AJAX无刷新分页练习

NoRefreshPage.ashx 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using WebApplicationAJAX.NoRefreshTableAdapters;
using System.Data;
using System.Web.Script.Serialization;
namespace WebApplicationAJAX
{
    /// <summary>
    /// NoRefreshPage 的Ì?摘a要°a说¦Ì明¡Â
    /// </summary>
    public class NoRefreshPage : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

            string action = context.Request.QueryString["action"];
            if ("pageCount" == action)
            {
                int num = Convert.ToInt32(new T_PostMsgTableAdapter().ScalarQueryCout());
                int pageNum = (num + 9) / 10;
                context.Response.Write(pageNum.ToString());
            }
            else
            {
                if ("pageData" == action)
                {
                    int pageId = Convert.ToInt32(context.Request["pageId"]);
                    NoRefresh.T_PostMsgDataTable dt = new T_PostMsgTableAdapter().GetPageData(pageId, pageId+9);
                    List<Comment> list = new List<Comment>();
                    foreach (NoRefresh.T_PostMsgRow item in dt.Rows)
                    {
                        
                        Comment comm = new Comment();
                        comm.IpAddr = item.IpAddr;
                        comm.Msg = item.Msg;
                        comm.PostDate = item.PostDate.ToString();
                        list.Add(comm);
                        
                    }
                    JavaScriptSerializer js = new JavaScriptSerializer();
                    string pageData = js.Serialize(list);
                    context.Response.Write(pageData);
                }
                else
                {
                    context.Response.Write("木有传参数");
                }
            }
            
            //context.Response.Write("Hello World");
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
        public class Comment
        {
            public string Msg { get; set; }
            public string IpAddr { get; set; }
            public string PostDate { set; get; }
        }
        
    }
}
NoRefreshPage.htm
主要的JavaScript代码:
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {

            $.post("NoRefreshPage.ashx?action=pageData", { "pageId": 1 }, function (data, status) {
                
                if ("success" == status) {
                    
                    var list = $.parseJSON(data);

                    for (var i = 0; i < list.length; i++) {
                        var TablePageDatatr = $("<tr><td>" + list[i].IpAddr + "</td><td>" + list[i].PostDate + "</td><td>" + list[i].Msg + "</td></tr>");
                        //var ulData = $("<li>哈哈</li>");
                        //$("#ulData").append(ulData);
                        $("#TablePageData").append(TablePageDatatr);

                    }
                    var TablePageTrue = $("<tr><td>木有数据?应该有吧</td></tr>");
                    $("#TablePageData").append(TablePageTrue);

                }
                else {
                    var tableError = "<tr><td>错误了</td></tr>"
                    $("#TablePageData").append(TablePageDatatr);
                }

            });
        });
   </script>
   
   无刷新删除代码:
   主要的代码:
   <script type="text/javascript">
           $(function () {
               $("input[myId=WFXSC]").click(function () {
                   var id = $(this).attr("itemid");
                   //alert("点我了" + $(this).attr("itemid"));
                   $.post("DeleteData.ashx", { "id": id }, function (data, status) {
                       if ("success" == status) {
                           if ("ok" == data) {
                           
                               $("input[itemid=" + id + "]").parent().parent().remove();
                               $("input[itemid="+id+"]").val("无刷新删除成功");
   
                           }
                       }
                       else {
   
                       }
                   });
               });
   
           });
       </script>

 

你可能感兴趣的:(Ajax)