三层+临时表存储过程+巧用json+贱招图片加载-->无刷新分页

1、加载数据 显示加载图片

2、返回json数据以及分页字符串

3、无刷新分页

 

4、反射+泛型-->简单通用demo

   之前有人质疑头脑风暴之 反射+泛型 构建 普通通用功能此文

 

5、前台

  

View Code
 <script type="text/javascript">
    $(function (){
       LoadData();
    });
    function  LoadData(param)
    {
      $.getJSON("ajax/UserInfoList.ashx",param,function(data){
        $(".utr").remove();
        $("#tabUser").append(data.userJson);
        $("#divPager").html(data.pagerJson);
        PageLink(); 
      })
      $("#divPager").html("<img src='images/loading.gif'/>");
    }
    function PageLink()
    {
      $(".pageLink").click(function(){
        var params=$(this).attr("href");
        params=params.substring(1,params.length); 
        LoadData(params);
        return false;//阻止其跳转 
      });
    } 
    </script>

</head>
<body style="font-family:Lucida Console;">
    <div id="divUserList">
      <table id="tabUser" >
        <thead><th>Id</th><th>UserName</th><th>操作</th></thead>
      </table>
    </div>
    <div id="divPager" class="pager">
    
    </div>
</body>

6、后台

View Code
  int totalCount = 0;
            
            int pageSize = context.Request["pageSize"] == null ? 3 : int.Parse(context.Request["pageSize"]);
            int pageIndex= context.Request["pageIndex"] == null ? 1 : int.Parse(context.Request["pageIndex"]);

            var data = userService.LoadPageEntities(pageSize, pageIndex, out totalCount);
            StringBuilder sb = new StringBuilder();
            foreach (var item in data)
            {
                sb.Append(string.Format("<tr class='utr'><td>{0}</td><td>{1}</td><td><a href='?delId={2}'>删除</a></td></tr>",item.Id,item.UserName,item.Id));
            }

            var pageHtml = new TuziPager().GeneratePageHtml(pageIndex, pageSize, totalCount);
            var jsonDataSerializer = new { userJson = sb.ToString(), pagerJson = pageHtml };
           
            JavaScriptSerializer javaScriptSerializer = new JavaScriptSerializer();

            string json = javaScriptSerializer.Serialize(jsonDataSerializer);
            if (string.IsNullOrEmpty(context.Request["pageIndex"]) && string.IsNullOrEmpty(context.Request["pageSize"]))
            {
                Thread.Sleep(2000);
            }

            context.Response.Write(json);

7、用到的存储过程和表

CREATE TABLE [dbo].[userinfo](
	[id] [int] IDENTITY(1,1) NOT NULL,
	[username] [nvarchar](50) COLLATE Chinese_PRC_CI_AS NULL,
 CONSTRAINT [PK_userinfo] PRIMARY KEY CLUSTERED 
(
	[id] ASC
)WITH (PAD_INDEX  = OFF, IGNORE_DUP_KEY = OFF) ON [PRIMARY]
) ON [PRIMARY]

/****** 存储过程   脚本日期: 01/21/2013 17:14:29 ******/
alter PROC PROC_page
	@pageSize int,
	@pageIndex int,
	@totalCount int output
AS
   SELECT * INTO  #Tmp FROM
   (
     SELECT id,username FROM userinfo 
   ) t 
DECLARE @sqlPage nvarchar(500);
SET @sqlPage='select * from '
             +'(select id,username,ROW_NUMBER() OVER(ORDER BY id) num FROM #Tmp) t'
             +' WHERE t.num between ('+str((@pageIndex-1)*@pageSize+1)+') AND ('+str(@pageIndex*@pageSize)+')'
             
EXEC (@sqlPage)
PRINT  @sqlPage 
SELECT @totalCount=count(1) FROM  #Tmp;
DROP TABLE #tmp

DECLARE @count int 
EXEC PROC_page 3,2,@count output 

结语:下午闲的无聊,就写这些代码,希望和同我一样的码农共进步,往多多指教

posted @ 2013-01-21 20:24  哈哈2222  阅读(2940)  评论(7编辑  收藏  举报