欧美亚洲综合图区在线|天天射天天干国产成卜|99久久免费国产精精品|国产的欧美一区二区三区|日韩中文字幕无码不卡专区|亚麻成人aV极品一区二区|国产成人AV区一区二区三|成人免费一区二区三区视频网站

當前位置:首頁 > 網(wǎng)站建設(shè) > 正文內(nèi)容

layui管理系統(tǒng)模板教程(layui模板怎么用)

網(wǎng)站建設(shè)2年前 (2023-01-23)1379

本篇文章給大家談?wù)刲ayui管理系統(tǒng)模板教程,以及l(fā)ayui模板怎么用對應(yīng)的知識點,希望對各位有所幫助,不要忘了收藏本站喔。

本文目錄一覽:

layui前端分頁不要每次調(diào)后端

layUI實現(xiàn)前端分頁和后端分頁

本文實例為大家分享了layUI實現(xiàn)前端分頁和后端分頁效果,供大家參考,具體內(nèi)容如下

layui后端分頁:

function pagination(curr,gwayId,mlity,ePart) {

$(".manage_ys_list").html('加載中...');

let dd={

conditions: {

gatewayId:gwayId,

searchText:"",

pageSize:15,

pageIndex:curr-1

},

identity:{

"userName":userName1,

"sessionId":sessionId1,

"token":token2

}

}

$.ajax({

type:"POST",

dataType: 'json',

url:UserListPaged,

data:dd,

headers:{ 'X-Requested-With': 'XMLHttpRequest' },

success:function(data){

let total=data.data.recordCount;

let pageCount=data.data.pageCount;

let pageSize=data.data.pageSize;

if(data.data.recordCount=0){

let dataHtml = '';

for(var i=0;idata.data.result.length;i++){

dataHtml += 'trtd'+data.data.result[i].gatewayId+'/tdtd'+data.data.result[i].userId+

'/tdtd'+data.data.result[i].realName+'/tdtd'+data.data.result[i].sex+'/tdtd'+data.data.result[i].workUnit+

'/tdtd'+data.data.result[i].phoneNo+'/tdtd'+data.data.result[i].isAdmin+

'/tdtda title="" class="btn btn-sm btn-info text-white manage_ys_xg" gatewayId="'+

data.data.result[i].gatewayId+'" userId="'+data.data.result[i].userId+

'" realName="'+data.data.result[i].realName+'" sex="'+data.data.result[i].sex+

'" age="'+data.data.result[i].age+'" birthday="'+data.data.result[i].birthday+

'" workUnit="'+data.data.result[i].workUnit+'" phoneNo="'+data.data.result[i].phoneNo+

'" isAdmin="'+data.data.result[i].isAdmin+'"修改/aa href="#" rel="external nofollow" title="" class="btn btn-warning text-white btn-sm man_ys_shanc" gatewayId="'+

data.data.result[i].gatewayId+'" userId="'+data.data.result[i].userId+'"刪除/a/td/tr'

}

$(".manage_ys_list").html(dataHtml);

}else{

$(".manage_ys_list").html('li暫無數(shù)據(jù)/li');

}

//顯示分頁

layui.use(['laypage', 'layer'], function(){

var laypage = layui.laypage

,layer = layui.layer;

laypage.render({

elem: 'page' //注意,這里的 test1 是 ID,不用加 # 號

,count: total//數(shù)據(jù)總數(shù),從服務(wù)端得到

,limit: 15//每頁顯示條數(shù)

,curr: curr || 1 //當前頁

layui實現(xiàn)table加載的示例代碼

js實現(xiàn):

layui.use(['table','form'],

function()

{

$

=

layui.jquery;

table

=

layui.table;

tableIns

=

initTable();

});

//加載列表

function

initTable(){

//

執(zhí)行渲染

tableIns

=

table.render({

id:

'idTest',

elem

:

'#deviceTable',

//

指定原始表格元素選擇器(推薦id選擇器)

size:

'lg',

height

:

'full-20',

//

容器高度

url

:

'/csCloud-admin/deviceController/getDeviceList.do',

where:

{

'orgId':$("#orgId").val(),

'coldNum':$("#coldNum").val(),

'devType':$("#devType").val(),

'isUsed':$("#isUsedId").val()

},

method

:

'post',

cols

:

[

[

//

標題欄

{

field

:

'rownum',

title

:

'序號',

width

:

100,

sort

:

true

},

{

field

:

'devNum',

title

:

'設(shè)備編號',

width

:

200

},

{

field

:

'devAlias',

title

:

'設(shè)備別名',

width

:

100

},

{

field

:

'devTypeVal',

title

:

'設(shè)備類型',

width

:

100

},

{

field

:

'devModel',

title

:

'設(shè)備型號',

width

:

100

},

{

field

:

'stateVal',

title

:

'設(shè)備狀態(tài)',

width

:

100

},

{

field

:

'coldNum',

title

:

'冷庫編號',

width

:

100

},

{

field

:

'orgName',

title

:

'所屬機構(gòu)',

width

:

300

},

{

field

:

'isUsedValue',

title

:

'狀態(tài)',

width

:

100

},

{

fixed

:

'right',

width

:

300,

align:'center',

toolbar

:

'#barDemo'

}

]

],

//

設(shè)置表頭

page

:

true,

limits

:

[

10,30,

60,

90,

150,

300

],

limit

:

10

});

return

tableIns;

}

jsp實現(xiàn):

div

class="layui-fluid"

div

class="layui-row"

div

class="layui-col-lg12"

table

id="deviceTable"/table

/div

/div

/div

以上這篇layui實現(xiàn)table加載的示例代碼就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

您可能感興趣的文章:layui的table單擊行勾選checkbox功能方法layui實現(xiàn)點擊按鈕給table添加一行l(wèi)ayui結(jié)合form,table的全選、反選v1.0示例講解

layui 的table表頭 字體太多如何自動換行

layui 的table表頭字體太多自動換行代碼:

table style="TABLE-LAYOUT: fixed" border="1" cellspacing="0" cellpadding="0" width="200"

? tbody

? ? ? tr

? ? ? ? ? td style="WORD-WRAP: break-word" width="20"sssssssssssssssssssssssssssssssssssssssssssssss /td

? ? ? ? ? tdaaaaa/td

? ? ? /tr

? ? ? tr

? ? ? ? ? td style="WORD-WRAP: break-word" width="20"sssssssssssssssssssssssssssssssssssssssssssssss /td

? ? ? ? ? tdaaaaa/td

? ? ? /tr

? /tbody

/table

擴展資料

layui更多是面向于后端開發(fā)者,所以在組織形式上依然采用了幾年前的以瀏覽器為宿主的類 AMD 模塊管理方式,卻又并非受限于 CommonJS 的那些條條框框,它擁有自己的模式,更加輕量和簡單。

layui 定義為“經(jīng)典模塊化”,并非是刻意強調(diào)“模塊”理念本身,而是有意避開當下 JS 社區(qū)的主流方案,試圖以盡可能簡單的方式去詮釋高效!

它的所謂經(jīng)典,是在于對返璞歸真的執(zhí)念,它以當前瀏覽器普通認可的方式去組織模塊! layui 認為這種輕量的組織方式,仍然可以填補 WebPack 以外的許多場景。

所以它堅持采用經(jīng)典模塊化,也正是能讓人避開工具的復雜配置,重新回歸到原生態(tài)的 HTML/CSS/JavaScript本身。

layui管理系統(tǒng)模板教程的介紹就聊到這里吧,感謝你花時間閱讀本站內(nèi)容,更多關(guān)于layui模板怎么用、layui管理系統(tǒng)模板教程的信息別忘了在本站進行查找喔。

掃描二維碼推送至手機訪問。

版權(quán)聲明:本文由飛速云SEO網(wǎng)絡(luò)優(yōu)化推廣發(fā)布,如需轉(zhuǎn)載請注明出處。

本文鏈接:http://m.landcheck.net/post/5230.html

“l(fā)ayui管理系統(tǒng)模板教程(layui模板怎么用)” 的相關(guān)文章

免費下載ppt模板網(wǎng)站知乎(有ppt免費下載網(wǎng)站)

免費下載ppt模板網(wǎng)站知乎(有ppt免費下載網(wǎng)站)

今天給各位分享免費下載ppt模板網(wǎng)站知乎的知識,其中也會對有ppt免費下載網(wǎng)站進行解釋,如果能碰巧解決你現(xiàn)在面臨的問題,別忘了關(guān)注本站,現(xiàn)在開始吧!本文目錄一覽: 1、免費下載各種PPT文件的網(wǎng)站有哪些? 2、推薦幾個免費的ppt?ps?素材網(wǎng)站和學習網(wǎng)站? 設(shè)匯怎么樣? 3、有哪些好的PP...

大學自我介紹PPT模板(大學自我介紹ppt模板免費下載)

大學自我介紹PPT模板(大學自我介紹ppt模板免費下載)

今天給各位分享大學自我介紹PPT模板的知識,其中也會對大學自我介紹ppt模板免費下載進行解釋,如果能碰巧解決你現(xiàn)在面臨的問題,別忘了關(guān)注本站,現(xiàn)在開始吧!本文目錄一覽: 1、大學生優(yōu)秀個人簡歷模板5篇 2、大學生職業(yè)生涯規(guī)劃書的ppt怎么做? 3、3分鐘工作面試自我介紹(通用5篇) 大學生...

三年級上冊英語ppt課件免費下載譯林版(譯林版三年級上冊英語PPT)

三年級上冊英語ppt課件免費下載譯林版(譯林版三年級上冊英語PPT)

今天給各位分享三年級上冊英語ppt課件免費下載譯林版的知識,其中也會對譯林版三年級上冊英語PPT進行解釋,如果能碰巧解決你現(xiàn)在面臨的問題,別忘了關(guān)注本站,現(xiàn)在開始吧!本文目錄一覽: 1、誰有譯林版小學三年級上冊英語 第三單元第一課時 My friends 的說課稿 2、哪里有小學三年級上冊(三年...

su素材庫免費下載(su素材百度云)

su素材庫免費下載(su素材百度云)

今天給各位分享su素材庫免費下載的知識,其中也會對su素材百度云進行解釋,如果能碰巧解決你現(xiàn)在面臨的問題,別忘了關(guān)注本站,現(xiàn)在開始吧!本文目錄一覽: 1、能發(fā)個SU常用插件以及素材么,和建筑有關(guān)的,或者下載的鏈接也行,在下面,提問不讓留,,, 2、求一個素材網(wǎng)站,主要是平面設(shè)計素材,如PSD、C...

html個人主頁網(wǎng)頁設(shè)計代碼兩個頁面(設(shè)計一個html頁面)

html個人主頁網(wǎng)頁設(shè)計代碼兩個頁面(設(shè)計一個html頁面)

今天給各位分享html個人主頁網(wǎng)頁設(shè)計代碼兩個頁面的知識,其中也會對設(shè)計一個html頁面進行解釋,如果能碰巧解決你現(xiàn)在面臨的問題,別忘了關(guān)注本站,現(xiàn)在開始吧!本文目錄一覽: 1、用html制作一個個人網(wǎng)頁要求有五個鏈接,每頁都有css格式 2、學生個人網(wǎng)頁制作html代碼是什么? 3、我需要...

考研復試英語自我介紹模板中文(考研復試的英語自我介紹模板)

考研復試英語自我介紹模板中文(考研復試的英語自我介紹模板)

本篇文章給大家談?wù)効佳袕驮囉⒄Z自我介紹模板中文,以及考研復試的英語自我介紹模板對應(yīng)的知識點,希望對各位有所幫助,不要忘了收藏本站喔。 本文目錄一覽: 1、考研復試英語自我介紹 2、求研究生復試的英語自我介紹 3、考研復試英語面試英語自我介紹經(jīng)典模板帶中文翻譯資料 4、研究生復試 英語自我...