bootstrap Table 服務端處理分頁 後臺是.net

来源:http://www.cnblogs.com/tzzf/archive/2017/10/18/7688715.html
-Advertisement-
Play Games

要考慮函數可被可重覆使用(調用),需要將可變化的變為參數封裝起來 table載入成功寫的函數,是因為我自己需要才寫的。把table里的數據放在全局變數後,查詢詳細信息就不用再做ajax。這個'load-success.bs.table'api我還有個問題,當這個table被多次load-succes ...


要考慮函數可被可重覆使用(調用),需要將可變化的變為參數封裝起來

function HQCreatTables(ob) {
    var option = {
        method: 'get',
        dataType: "json",
        striped: true,//設置為 true 會有隔行變色效果  
        undefinedText: "空",//當數據為 undefined 時顯示的字元  
        pagination: true, //分頁  
        // paginationLoop:true,//設置為 true 啟用分頁條無限迴圈的功能。  
        showToggle: false,//是否顯示 切換試圖(table/card)按鈕  
        showColumns: false,//是否顯示 內容列下拉框  
        pageNumber: 1,//如果設置了分頁,首頁頁碼  
        // showPaginationSwitch:true,//是否顯示 數據條數選擇框  
        pageSize: 10,//如果設置了分頁,頁面數據條數  
        pageList: [10, 20, 40],  //如果設置了分頁,設置可供選擇的頁面數據條數。設置為All 則顯示所有記錄。  
        paginationPreText: '?',//指定分頁條中上一頁按鈕的圖標或文字,這裡是<  
        paginationNextText: '?',//指定分頁條中下一頁按鈕的圖標或文字,這裡是>  
        // singleSelect: false,//設置True 將禁止多選  
        search: false, //顯示搜索框  
        data_local: "zh-US",//表格漢化  
        sidePagination: "server", //服務端處理分頁  
        queryParams: function (params) {//自定義參數,這裡的參數是傳給後臺的,我這是是分頁用的 
            return {//這裡的params是table提供的  
                cp: params.offset,//從資料庫第幾條記錄開始  
                ps: params.limit//找多少條  
            };
        }
    }
    if (ob.url) {
        option.url = ob.url;
    }
    if (ob.columns) {
        option.columns = ob.columns;
    }
    $(ob.id).bootstrapTable('destroy');
    $(ob.id).bootstrapTable(option);
    if (ob.data) {
        $(ob.id).bootstrapTable('load', ob.data);
    }
    $(ob.id).on('load-success.bs.table', function (data) {//table載入成功後的監聽函數  
        var $table = $(ob.id);
        var allTableData = JSON.stringify($table.bootstrapTable('getData'));//獲取表格的所有內容行
        var obj = JSON.parse(allTableData);
        console.log(obj)
        Xstate.TableArr = obj;
    });
}

table載入成功寫的函數,是因為我自己需要才寫的。把table里的數據放在全局變數後,查詢詳細信息就不用再做ajax。
這個'load-success.bs.table'api我還有個問題,當這個table被多次load-success,這個函數就會被運行相同多次,對頁面顯示功能無影響。但自己還並不明白之前的table被$(ob.id).bootstrapTable('destroy')銷毀了,為什麼還會被記入。
函數被調用的時候寫入自己的參數,colums是第一行表頭。

var tab = { id: '#Table', url: '/HealthRecords/Selects', columns: columns }
HQCreatTables(tab);

.net的後臺傳的json也一定要有page值,rows是你的顯示data,total:所有顯示數據的條數。

[HttpGet]
        //GET: HealthRecords
        public JsonResult Selects(HealthRecordView m, int cp = -4, int ps = -5, string start = null, string end = null)
        {
            string sa = Session["hid"].ToString();
            m.hid = sa;
            string sqls = " SELECT * from A where hid='" + m.hid + "'  ";
            string sqlss = " SELECT count(*) from A where hid='" + m.hid + "' ";
            if (!string.IsNullOrWhiteSpace(m.Name))
            {
                sqls += " and Name like '%" + m.Name + "%'";
                sqlss += " and Name like '%" + m.Name + "%'";
            }
            if (!string.IsNullOrWhiteSpace(start) && !string.IsNullOrWhiteSpace(end))
            {
                sqls += " and r_time > '" + start + "' and r_time <'" + end + "'";
                sqlss += " and r_time > '" + start + "' and r_time <'" + end + "'";
            }
            sqls += " order by r_time desc ";
            if (cp != -4&& ps != -5)
            {
                sqls += "  limit  "+ cp + "," + ps + " ";
            }
            
            var arr = db.Database.SqlQuery<HealthRecordView>(sqls).ToArray();
            int RoleNames = db.Database.SqlQuery<int>(sqlss).FirstOrDefault();
            return Json(new { page = cp, rows = arr, total = RoleNames }, JsonRequestBehavior.AllowGet);
        }

如上,一次生成不要傳對後臺數據不要限制更多條件的table已經生成了
如何當你有查詢條件的時候,應該怎麼做?

當你看都到圖片的時候,你就明白了,只需要在調用函數的時候,在url里增加你的查詢條件。

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 博客里有很多大神寫過很多帖子,也都是五花八門什麼內容都有了。但是對於剛入手Java的人來說,有些帖子未必太深奧,很難去消化。所以這裡有個建議,那就是關註我,我們一起好好研究一下Java的源碼。Java的源碼研究投了,那就一通百通了,任你闖蕩Java的世界了。 Java源碼系列,看完所有的貼後,我希望 ...
  • 近段時間漸覺自己愚弱,感覺各方面都有些透支。索性去腦補一下設計模式。講真,之前對此也是一知半解,未曾有太多研究,此番也是做簡單瞭解,參考園裡大神做些紀要。於是乎,我又一次發覺其實在日常擼碼中已經隱隱約約用到了各種設計模式(你覺得夢想很遠,其實你已經在路上了)。比如,資料庫連接池用到了單例模式;比如, ...
  • 面向對象的基本特征 1.封裝性 封裝性就是把對象的屬性和服務結合成一個獨立的相同單位,並儘可能隱蔽對象的內部細節,包含兩個含義: ◇ 把對象的全部屬性和全部服務結合在一起,形成一個不可分割的獨立單位(即對象)。 ◇ 信息隱蔽,即儘可能隱蔽對象的內部細節,對外形成一個邊界〔或者說形成一道屏障〕,只保留 ...
  • 什麼是中介者模式? 在現實生活中,有很多中介者模式的身影,例如QQ游戲平臺,聊天室、QQ群、簡訊平臺和房產中介。不論是QQ游戲還是QQ群,它們都是充當一個中間平臺,QQ用戶可以登錄這個中間平臺與其他QQ用戶進行交流,如果沒有這些中間平臺,我們如果想與朋友進行聊天的話,可能就需要當面才可以了。電話、短 ...
  • 繼承:當前對象沒有的屬性和方法,別人有,拿來給自己用,就是繼承 1 混入式繼承 2.原型繼承 a) 給原型對象添加新成員(通過對象的動態特性),不是嚴格意義上的繼承 ,,,,實例對象繼承了原型 b) 直接替換原型對象 c) 利用混入的方式給原型對象添加成員 3.經典繼承 js var 對象1 = O ...
  • 運算符用於執行程式代碼運算,會針對一個及以上操作數項目來進行運算。2+3,其操作數是2和3,而運算符則是“+”。上一篇我們說過變數用來存儲數據,而同一個變數中的數據在不同的時刻可以不同,在程式的運行過程中,我們根據需要將數據進行相應規則的運算以得到預期的結果,運算符則是其中運算的規則。 運算符在js ...
  • 移動端用zepto做的頁面,突然發現on綁定的click事件並沒有觸發,代碼如下: 我把此寫法改成非事件委托的方式,發現該click事件就能觸發 最後$(document)換成$('body')或者$('ul')試試,實驗結果是: $(document) 不行 $(‘body') 不行 $(‘ul' ...
  • 本文是Javascript高級程式設計 第1章的筆記,主要介紹了: Javascript和ECMAScript的關係; 宿主環境; DOM和API的相關概念 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...