layui新增一行后,滚动条移动到最新数据

layui新增一行后,滚动条移动到最新数据,第1张

layui新增一行后,滚动条移动到最新数据搭高 *** 作方法如下:

1、利用JS、jQuery *** 作DOM对象实现在数据表格table中态枝慎手动添加一个tr。

2、动态添加的一行与Layui数据表格渲染出来的每一行样式及功能一样,必须给tr设置和渲染出来的每一行一样的样式,利用帆敬jQuery去完成这个添加这样一个。

js实现:

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

function()

{

$

=

layui.jquery

table

=

layui.table

tableIns

=

initTable()

})

//加载列表

function

initTable(){

//

执行渲染

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

:

'设备编号',

width

:

200

},

{

field

:

'devAlias',

title

:

'设备别名',

width

:

100

},

{

field

:

'devTypeVal',

title

:

'设备类型',

width

:

100

},

{

field

:

'devModel',

title

:

'设备型号',

width

:

100

},

{

field

:

'stateVal',

title

:

'设备状态',

width

:

100

},

{

field

:

'coldNum',

title

:

'冷库编号',

width

:

100

},

{

field

:

'orgName',

title

:

'所属机构'中尺,

width

:

300

},

{

field

:

'isUsedValue',

title

:

'状态',

width

:

100

},

{

fixed

:

'right',

width

:

300,

align:'center',

toolbar

:

'#barDemo'

}

]

],

//

设置表头

page

:

true,

limits

:

[

10,30,

60,

90,

150,

300

],

limit

:

10

})

return

tableIns

}

jsp实现:

<div

class="layui-fluid">

<div

class="layui-row">

<div

class="layui-col-lg12">

<table

id="deviceTable"></table>

</div>

</div>

</div>

以上这篇layui实现table加载的示例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:layui的table单击行勾选checkbox功能方顷厅法layui实现点击按钮给table添加一行layui结合form,table的全选、反选v1.0示例讲解


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11977595.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-20
下一篇 2023-05-20

发表评论

登录后才能评论

评论列表(0条)

保存