Ligerui表格基本操作(一)

最新推荐文章于 2024-10-09 09:18:42 发布

置顶 ping2575

最新推荐文章于 2024-10-09 09:18:42 发布

阅读量998

点赞数

文章标签： .net C# asp.net jquery ligerui

本文链接：https://blog.csdn.net/u012962099/article/details/49530761

版权

1.创建工程，导入lib包

<head>
<title></title>
<script src="lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<link href="lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<script src="lib/ligerUI/js/core/base.js" type="text/javascript"></script>
<script src="lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>
<script src="JS/myData.js" type="text/javascript"></script>
<script src="lib/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
<script type="text/javascript">

$(function () {
$("#t1").ligerGrid({
columns: [{name:"c1",display:"姓名"},
{ name: "c2", display: "性别",align:"left"},
{ name: "c3", display: "出生日期",width:200,minwidth:100 }
],
width:600,
data: row,
usePager:true,
pageSizeOptions:[5,8,15,20],
pageSize:5
})

})

</script>
</head>
<body>
<div id="t1"></div>
</body>

</html>

JS内容

var row = { Rows: [{ "c1": "刘德华", "c2": "男", "c3": "1981-01-01" },
{ "c1": "张学友", "c2": "男", "c3": "1971-09-18" },
{ "c1": "张信哲", "c2": "男", "c3": "1967-04-28" },
{ "c1": "李宇春", "c2": "女", "c3": "1991-02-18" },
{ "c1": "张也", "c2": "女", "c3": "1975-07-01" },
{ "c1": "张宇", "c2": "男", "c3": "1961-11-23" },
{ "c1": "林俊杰", "c2": "男", "c3": "1985-05-13" },
{ "c1": "谢霆锋", "c2": "男", "c3": "1935-05-13" },
{ "c1": "张惠妹", "c2": "女", "c3": "1965-05-13" },
{ "c1": "潘玮柏", "c2": "男", "c3": "1955-05-13" },
{ "c1": "胡彦斌", "c2": "男", "c3": "1976-08-23" }
]
}

效果如下