ligerui（ligerui grid表格编辑）

本文目录

ligerui grid表格编辑
如何解决ligerUI布局时Center中的Tab高度大小
用ligerUI往数据库添加数据
Jquery显示和隐藏元素或设为只读(含Ligerui的控件禁用,实例说明介绍)
ligerui如何获取分页表格的所有数据
ligerUI中ligerDialog和ligerWindow的区别
如何获取LigerUI中父节点
关于ligerUI下拉列表两级联动的问题
ligerui如何实现服务器分页

ligerui grid表格编辑

您好，这样的：
1、在后台解析JSON-lib解析json串时，提前数据前通过JSONObject对象的containsKey方法先判断是否含有要提取的数据，在此就不多加赘述。
　　2、修改前台，在表格新增行时，为每一行添加默认数据。代码如下：
function addParts(){
var rowData={
pName:““,
pBrand:“1“,
pModel:““,
nums:“0“,
price:““,
numsPrice:““,
remarks:““
};
g.addEditRow(rowData);
}
ligerGrid除了提供editor编辑器之外还提供了totalSummary属性，可辅助我们对表格中某列进行统计，如统计某列数据的总和、行数、最大值、最小值、平均值等等，我们可以通过type属性进行指定，代码及效果如下：
{display:“数量“,name:“nums“,type:“int“,isAllowHide:false,align:“left“,width:80,
editor:{type:“spinner“},
totalSummary:{
type:’sum,count,max,min,avg’
}
}

如何解决ligerUI布局时Center中的Tab高度大小

1.0 引用的js,css
《link href=“/Content/scripts/ligerUI/skins/Aqua/css/ligerui-all.css“ rel=“stylesheet“ /》
《link href=“/Content/scripts/ligerUI/skins/ligerui-icons.css“ rel=“stylesheet“ /》
《script src=“~/Scripts/jquery-1.8.2.js“》《/script》
《script src=“/Content/scripts/ligerUI/js/ligerui.all.js“》《/script》
2.0 用js代码设置ligerUI布局和Tab高度
《script》
var tab;
$(function () {
$(“#layout1“).ligerLayout({ leftWidth: 200, topHeight: 80 });
$(“#accordion1“).ligerAccordion({ height: 300 });
//重要的代码,设置新增加的tab的高度等于center div的高度.
var height = $(“.l-layout-center“).height();
tab = $(“#tab1“).ligerTab({ height: height });
});
//可以动态增加一个tab标签页,但是元素有哪些
function addTab(url, text, tabid) {
tab.addTabItem({ url: url, text: text, tabid: tabid });
}
《/script》
3.0 简单的设置样式
《style type=“text/css“》
body { padding: 10px; margin: 0; }
#layout1 { width: 100%; margin: 40px; height: 400px; margin: 0; padding: 0; }
#accordion1 { height: 270px; }
h4 { margin: 20px; }
#accordion1 ul li { font-size: 14px; margin-left: 15px; }
a { color: black; text-decoration: none; }
a:hover { color: #ff6a00; }
《/style》
4.0 body中的内容
《body style=“padding:10px“》
《div id=“layout1“》
《div position=“left“ title=“功能列表“》
《div id=“accordion1“》
《div title=“项目管理“》
《ul》
《li》《a href=“javascript:void(0)“ onclick=“addTab( ’
《!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN“ “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“》
《html xmlns=“http://www.w3.org/1999/xhtml“》
《head》
《title》布局实力篇之自动适应窗口高度《/title》
《link href=“../lib/ligerUI/skins/Aqua/css/ligerui-all.css“ rel=“stylesheet“ type=“text/css“ /》
《!--《link href=“../lib/ligerUI/skins/Gray/css/all.css“ rel=“stylesheet“ type=“text/css“ /》--》我用的另一套皮肤
《!--我添加了自定义的样式--》
《link href=“../style/site.css“ rel=“stylesheet“ type=“text/css“ /》
《script src=“../lib/jquery/jquery-1.3.2.min.js“ type=“text/javascript“》《/script》
《script src=“../lib/ligerUI/js/core/base.js“ type=“text/javascript“》《/script》
《script src=“../lib/ligerUI/js/plugins/ligerLayout.js“ type=“text/javascript“》《/script》
《script type=“text/javascript“》
$(function () {
$(“#container“).ligerLayout({ leftWidth: 200 }); //这一句可是关键啊
});
《/script》
《/head》
《body》
《div id=“top“》
其实俺和他们不是一起的，俺是独立的一部分
《/div》
《div id=“container“》
《div position=“left“》这里也要注意啊
《/div》
《div position=“center“ title=“标题“》加个标题更好玩
《/div》
《/div》
《/body》
《/html》
样式文件
* { margin: 0px; padding: 0px; }
body { padding: 5px; margin: 0; padding-bottom: 15px; }
#top { height: 80px; margin-bottom: 3px; background-color:Lime }
总结：
只需要将容器转换为一个ligerlayout对象就行了
别忘了 position 属性啊

用ligerUI往数据库添加数据

获取表单数据：
var form = liger.get(“form1“);
var data = form.getData();
alert(liger.toJSON(data));
设置表单数据：
var form = liger.get(“form1“);
form.setData({
Title: ’标题1111’,
addDate: new Date(),
Country : ’ZG’
});
ashx 应该写成和form 表单中元素name对应的各个参数，类似
public string Receive(string Title, DateTime addDate, string Country)
{
}
前台提交表单可以用jquery.form.js 这个插件，ajax 异步提交表单
https://github.com/malsup/form/archive/master.zip
jquery.form 使用例子：
$(’#form_wirteLog’).ajaxSubmit({
url: “aa.ashx“,
dataType: ’json’,
success: function (data) {
if (data != null && data.Status == 0) {
showmsg(CommonMsg.Sccuess);
if ($(“#form_wirteLog [name=ID]“).val() == ““) {
}
} else {
showmsg(data.Message, 1);
}
},
error: function (xhr, status, error) {
}
});
-rid

Jquery显示和隐藏元素或设为只读(含Ligerui的控件禁用,实例说明介绍)

一、隐藏和显示元素
复制代码
代码如下:
$(’#button_save_12’).css(’display’,
’none’);
//
隐藏按钮
$(’#button_save_12’).css(’display’,
’display’);
//
显示按钮
//
或者采取
复制代码
代码如下:
$(’#button_save_12’).hide();
$(’#button_save_12’).show();
二、设为禁用,只读
复制代码
代码如下:
$(’#button_save_12’).attr(“disabled“,
“disabled“);
//
禁用
$(’#button_save_12’).attr(“disabled“,
“disabled“);
//
取消禁用
三、Ligerui设为禁用
复制代码
代码如下:
$(“#button_save_12“).ligerComboBox({
width:
’118’,
disabled:
true
});
//
禁用
false
是启用
-ui

ligerui如何获取分页表格的所有数据

LigerUI的分页方式有两种：local和server。
如果数据量不是很大，就直接采用local分页，一次性的把数据全部发送到前台来，之后LigerUI自身的grid会自动分页。说一下total，在后台传送jsonString时传送定义好的total（总条数），你可以定义多少都可以，但是到前台它会自动将总条数赋值给total，这是local下的方式。
而如果数据量很大，一次性加载直接不显示数据或反应很慢的，就需要用server分页了，当用server分页时，每次请求都会比local时多发送两个参数：page和pagesize，不需要自己去发送，只需要在后台获取就行，
int page=Integer.parseInt(request.getParameter(“page“));
int pagesize=Integer.parseInt(request.getParameter(“pagesize“));
int total;
这时你可以把page和pagesize写进你的sql语句：
sql=“.........“;
sql+=“ limit “+(page*pagesize-pagesize)+“,“+pagesize;
这样查出的结果放入jsonString中，这里要注意total了，total需要自己定义，需要自己重新查一下结果的总条数后赋值给total传到页面，其他的LigerUI会帮你搞定！
-rid

ligerUI中ligerDialog和ligerWindow的区别

从API来看，它们之间视乎没有根本性的区别，下面看对比图，

我这里只列出了API文档中参数的对比图，两个类其他的API也与图中情况差不多，Dialog的API比较多，但几乎都涵盖了Window中的API，可以自行访问下面的网址查看：

如何获取LigerUI中父节点

点击的节点为node
var node1=$(’treeid’).tree(’getParent’,node.target);
var node2=$(’treeid’).tree(’getParent’,node1.target);
获取node2的id就可以了
-ui

关于ligerUI下拉列表两级联动的问题

ligerui如何实现服务器分页

ligerui
自身就支持分页，只要服务器端拿分页的信息就可以，如分页大小、第几页
http://www.ligerui.com/api/document/Grid/parms.htm

电脑数码网

Nice to meet you, too!

ligerui rid ui