BootStrap-table 在传统Asp.NET(webform)中基于ashx(一般处理程序)的调用

BootStrap-table 在传统Asp.NET(webform)中基于ashx(一般处理程序)的调用

       就目前的形式来看Asp.NET webform的模式已经显得过时了,可是在许多高校教学中,和一些外包项目中还大量充斥着旧代码的使用,在传统拖控件的时代显然,gridview控件已经不能满足大家的实际使用,近期在网上看到一篇写的非常优秀的文章,使用BootStrap-table取代了GridView,而大多数时候Bootstraptable需要与webapi或.net ,mvc配合,这样如非必要可以减少重构代码的难度,特与大家分享

原文链接:https://blog.csdn.net/qq237183141/article/details/78337512

 

使用效果:

BootStrap-table 在传统Asp.NET(webform)中基于ashx(一般处理程序)的调用_第1张图片

1.前端html调用代码

bootstraptable 的css文件和js文件引用了网络上的cdn

还需要引入bootstrap文件,可自行到官网下载,或者引用官网的cdn加速后的网络文件

css:

 

js:


 


    
    
    
    


    

2.通过js初始化表格

初始化表格就是可以通过bootstraptable预留的接口,通过调整一些json参数调整显示的效果

url中填写你ashx的文件路径 例 url: "classManage.ashx",在下一步创建中我将创建一个同文件夹下的classManage.ashx文件

3.创建一个一般处理程序(.ashx) 

需要包括的头文件

using System;
using System.Web;
using System.Data.SqlClient;
using System.Data;
using System.Collections.Generic;
using System.Web.Script.Serialization;

核心代码:

注意!!!第一行的数据库连接类是我自己创建的 还有后面的一行数据访问的类是我自己写的!!!你们需要根据自己需求创建数据访问类 !!!我在需要修改的地方做了标注

 SelectDB selectDB = new SelectDB();
//此处要注意这个类是我自己创建的数据库连接类需要替换成自己的!!!!!!!!


    private int pageSize = 10;//一页显示的数据
    private int pageNumber = 1;//页码
    private string sortName = "";//排序字段
    private string sortOrder = "1";//asc or desc
    private string searchText = "";//关键字

    public void ProcessRequest(HttpContext context)
    {
        if (!string.IsNullOrEmpty(context.Request["pageSize"]))
            pageSize = Convert.ToInt32(context.Request["pageSize"]);

        if (!string.IsNullOrEmpty(context.Request["pageNumber"]))
            pageNumber = Convert.ToInt32(context.Request["pageNumber"]);

        if (!string.IsNullOrEmpty(context.Request["sortName"]))
            sortName = (context.Request["sortName"]);

        if (!string.IsNullOrEmpty(context.Request["sortOrder"]))
        {
            sortOrder = (context.Request["sortOrder"]);
            if (sortOrder == "asc")
                sortOrder = "1";
            else if (sortOrder == "desc")
                sortOrder = "0";
        }
        string strWhere = "";
        if (!string.IsNullOrEmpty(context.Request["searchText"]))
        {
            searchText = (context.Request["searchText"]);
            strWhere += string.Format(" (user_no like '%{0}%' or user_name like '%{0}%')", searchText);
        }

        string json = LoadTableByPagination("teacher", "*", pageNumber, pageSize,Convert.ToInt32(sortOrder), strWhere, "teacherID");
        context.Response.Write(json);
        context.Response.End();

    }

    /// 
    /// 调用分页储存过程,返回table的json数据
    /// 
    /// 数据库表名
    /// 查询的字段
    /// 当前页码
    /// 一页显示的数据
    /// 0降序,1升序
    /// 查询条件
    /// 排序字段
    /// 
    string LoadTableByPagination(string table,string fields,int pageNumber,int pageSize,int orderSort,string strWhere,string orderName )
    {
        string json = "";
        SqlParameter[] parameters = {new SqlParameter("@TABLE",SqlDbType.VarChar,50),
                new SqlParameter("@FEILDS",SqlDbType.VarChar,1000),
                new SqlParameter("@PAGE_INDEX",SqlDbType.Int,4),
                new SqlParameter("@PAGE_SIZE",SqlDbType.Int,4),
                 new SqlParameter("@ORDERTYPE",SqlDbType.Bit),
                  new SqlParameter("@ANDWHERE",SqlDbType.VarChar,1000),
                  new SqlParameter("@ORDERFEILD",SqlDbType.VarChar,100)
            };
        parameters[0].Value = table;//表格
        parameters[1].Value = fields;//字段
        parameters[2].Value = pageNumber;
        parameters[3].Value = pageSize;
        parameters[4].Value = orderSort;//0是降序,1是升序
        parameters[5].Value = strWhere;//条件
        parameters[6].Value = orderName;//排序字段
        DataSet dataSet = selectDB.RunProcDataSet("[PAGINATION]", parameters);
        //此处要注意这个类是我自己创建的数据库连接类需要替换成自己的!!!!!!!!
        if (dataSet != null)
        {
            DataTable dt = dataSet.Tables[0];
            //后台返回的json数据必须包含total,和rows属性,否则前台没数据
            if (dataSet.Tables[1] != null && dataSet.Tables[1].Rows.Count > 0)
                json += "{\"total\":" + dataSet.Tables[1].Rows[0]["total"] + ",";
            if (dt != null & dt.Rows.Count > 0)
                json += "\"rows\":" + DataTableToJson(dt) + "}";
        }
        return json;
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

    #region Json&DataTable
    ///  
    /// DataTable转为json 
    ///  
    /// DataTable 
    /// json数据 
    public static string DataTableToJson(DataTable dt)
    {
        List> list = new List>();
        foreach (DataRow dr in dt.Rows)
        {
            Dictionary result = new Dictionary();
            foreach (DataColumn dc in dt.Columns)
            {
                result.Add(dc.ColumnName, dr[dc]);
            }
            list.Add(result);
        }
        int recursionLimit = 100;
        JavaScriptSerializer serialize = new JavaScriptSerializer();
        serialize.RecursionLimit = recursionLimit;
        serialize.MaxJsonLength = Int32.MaxValue;
        return serialize.Serialize(list);
    }
    #endregion Json&DataTable

4.存储过程:

以下为存储过程的创建过程,原文中写的非常好我就不做修改了

/*数据分页*/
CREATE PROCEDURE [dbo].[PAGINATION] 
@TABLE varchar(50),--数据库表名
@FEILDS  VARCHAR(1000),--要显示的字段
@PAGE_INDEX INT,--当前页码
@PAGE_SIZE INT,--页面大小
@ORDERTYPE BIT,--当为0时 则为 desc 当为1 时 asc
@ANDWHERE VARCHAR(1000)='',--where语句 不用加where
@ORDERFEILD VARCHAR(100) --排序的字段
as
DECLARE @EXECSQL VARCHAR(2000)
DECLARE @ORDERSTR VARCHAR(100)
DECLARE @ORDERBY VARCHAR(100)
BEGIN
    set NOCOUNT on
    IF @ORDERTYPE = 1 
        BEGIN
            SET @ORDERSTR = ' > ( SELECT MAX(['+@ORDERFEILD+'])'
            SET @ORDERBY = 'ORDER BY '+@ORDERFEILD+' ASC'
        END
    ELSE 
        BEGIN
            SET @ORDERSTR = ' < ( SELECT MIN(['+@ORDERFEILD+'])'
            SET @ORDERBY = 'ORDER BY '+@ORDERFEILD+' DESC'
        END

    IF @PAGE_INDEX = 1 --当页码是第一页时直接运行,提高速度
        BEGIN
            IF @ANDWHERE=''
                SET @EXECSQL = 'SELECT TOP '+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM ['+@TABLE+'] '+@ORDERBY
            ELSE
                SET @EXECSQL = 'SELECT TOP '+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM ['+@TABLE+'] WHERE '+@ANDWHERE+' '+ @ORDERBY
        END
    ELSE
        BEGIN
            IF @ANDWHERE=''
                BEGIN      --以子查询结果当做新表时 要给表名别名才能用
                    SET @EXECSQL = 'SELECT TOP'+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM ['+@TABLE+'] WHERE '+@ORDERFEILD+
                                @ORDERSTR+' FROM (SELECT TOP '+STR(@PAGE_SIZE*(@PAGE_INDEX-1))+' '+@ORDERFEILD+
                                ' FROM ['+@TABLE+'] '+@ORDERBY+') AS TEMP) '+ @ORDERBY
                END
            ELSE
                BEGIN
                    SET @EXECSQL = 'SELECT TOP'+STR(@PAGE_SIZE)+' '+@FEILDS+' FROM ['+@TABLE+'] WHERE '+@ORDERFEILD+
                                @ORDERSTR+' FROM (SELECT TOP '+ STR(@PAGE_SIZE*(@PAGE_INDEX-1))+' '+@ORDERFEILD+
                                ' FROM ['+@TABLE+'] WHERE '+@ANDWHERE+' '+@ORDERBY+') AS TEMP) AND '+@ANDWHERE+' '+ @ORDERBY
                END
        END
--获取table的总行数
 IF @ANDWHERE=''
        set @EXECSQL=@EXECSQL+'; select count(*) as total from ['+@TABLE+'] '
else
        set @EXECSQL=@EXECSQL+'; select count(*) as total from ['+@TABLE+'] WHERE '+@ANDWHERE
EXEC (@EXECSQL)--这里要加括号
END
GO

(下篇)bootstrap-table的修改与添加链接: https://blog.csdn.net/weixin_42550800/article/details/86767494

你可能感兴趣的:(网站开发)