jQuery EasyUI是一组基于jQuery UI的插件集合,而jQuery EasyUI的目标就是帮助网络开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解的只有一些简单的html标签。
jQuery EasyUI为我们提供了大多数UI控件的使用,如:手风琴,组合框、菜单、对话框、选项卡、树,validatebox、窗口等等。
下面通过代码看下easyui datagird编辑行删除行功能,具体代码如下所示:
init()函数{
var editRow=定义;
var oldMoney=定义;
$ (" # dg) .datagrid ({
url:“. ./权利/fexLedgerManager.do& # 63;方法=queryApplyData& parentId=" + parentId,
fitColumns:假的,//自适应宽度,占满,不能和冻结列同时设置成正确的
条纹:真的,//斑马线效果
singleSelect:假的,//是否单选
分页:假的,
身高:140,
列:[[
{字段:“id”,标题:“主键”,宽度:“10”,对齐:“中心”,隐藏:真正的},
{字段:“applyNo”,标题:“申报单号”,宽度:250年,对齐:“中心”,编辑:{类型:“validatebox”,选项:{要求:真}}},
{字段:“exeMoneyString”,标题:“执行金额”,宽度:200年,对齐:“中心”,编辑:{类型:“moneybox”,选项:{精度:2,要求:真}}},
{字段:“汇率”,标题:“执行汇率(%)”,宽度:‘210’,对齐:“中心”,编辑:{类型:“numberbox”,选项:{精度:5,要求:真}}},
{字段:“submitDate”,标题:“提交日期”,宽度:190年,对齐:“中心”,编辑:{类型:“datebox”,选项:{要求:真}}},
{字段:“executeDate”,标题:“执行日期”,宽度:190年,对齐:“中心”,编辑:{类型:“datebox”,选项:{要求:真}}}
]],
工具栏:[{
文本:“添加”,iconCls:“icon-add”,处理程序:函数(){
如果(editRow !=未定义){
$ (" # dg”)。datagrid (endEdit, editRow);
}
如果(editRow==定义){
var submitDate=$ (" # submitDate”) .val ();
$ (" # dg”)。datagrid (insertRow, {
指数:0,
行:{submitDate: submitDate}
}）;
$ (" # dg”)。datagrid (beginEdit, 0);
editRow=0;
}
}
},/*”——“{
文本:“撤销”,iconCls:“icon-redo”,处理程序:函数(){
editRow=定义;
$ (" # dg) .datagrid (“rejectChanges”);
$ (" # dg) .datagrid (“unselectAll”);
}
*/薄皚,{
文本:“删除”,iconCls:“icon-remove”,处理程序:函数(){
var行=$ (" # dg”) .datagrid (“getSelected”);
如果(行){
var指数=$ (" # dg”) .datagrid (“getRowIndex”,行);
$ (" # dg) .datagrid (deleteRow”即可,指数);
其他}{
$ (" # dg”)。datagrid (endEdit, 0);
$ (" # dg) .datagrid (deleteRow”即可,0);
editRow=定义;
}
}
},“-”,{
文本:“修改,iconCls:“icon-edit”,处理程序:函数(){
var行=$ (" # dg”) .datagrid (“getSelected”);
oldMoney=row.exeMoneyString;
如果(行!=null) {
如果(editRow !=未定义){
$ (" # dg”)。datagrid (endEdit, editRow);
}
如果(editRow==定义){
var指数=$ (" # dg ")。datagrid (getRowIndex,行);
$ (" # dg”)。datagrid (beginEdit,指数);
editRow=指数;
$ (" # dg) .datagrid (“unselectAll”);
}
其他}{
}
}
},“-”,{
文本:“保存”,iconCls:“icon-save”,处理程序:函数(){
var opeRow=editRow;
$ (" # dg”)。datagrid (endEdit, editRow);
var行=$ (" # dg”) .datagrid (“getChanges”);
如果(!行| | rows.length==0) {
alert("无修改数据,无需保存!”);
返回错误;
}
var allRows=$ (" # dg”) .datagrid (“getData”);
var executeMoney=$ (" # executeMoney”) .val ();
var和=0;
var钱=0;
每美元(allRows.rows、功能(我,行){
行。parentId=parentId;
金钱=formatMeony (row.exeMoneyString);
+=钱;
}）;
如果(sum> executeMoney) {
alert("执行金额超出台账登记执行金额!”);
如果(oldMoney) {
$ (" # dg”)。datagrid (updateRow, {
指数:opeRow,
行:{exeMoneyString: oldMoney}
}）;
}
$ (" # dg”)。datagrid (beginEdit, opeRow);
$ (" # dg) .datagrid (“unselectAll”);
返回错误;
}//新增
var addRows=$ (" # dg”) .datagrid (“getChanges”、“插入”);//修改
var updaterow=$ (" # dg”) .datagrid (“getChanges”、“更新”);//删除
var delRows=$ (" # dg”) .datagrid (“getChanges”、“删除”);
var addOrUpdate=$ .merge (addRows updaterow);
var addOrUpdateStr=JSON.stringify (addOrUpdate);
var delRowsStr=JSON.stringify (delRows);
. ajax({美元
类型:“文章”,
url:“. ./权利/fexLedgerManager.do”,
数据:{
“方法”:$(" #方法").val (),
“addOrUpdateStr”: addOrUpdateStr,
“delRowsStr”: delRowsStr
},
缓存:假的,
数据类型:json,
成功:功能(数据){
如果(data.success) {
警报(data.msg);
init ();
其他}{
警报(data.msg);
}
}
}）;
}
}),
构成了rowData, onAfterEdit:功能(rowIndex,更改){
editRow=定义;
},
构成了rowData) onDblClickRow:功能(rowIndex, {
如果(editRow !=未定义){
$ (" # dg”)。datagrid (endEdit, editRow);
}
如果(editRow==定义){
$ (" # dg”)。datagrid (beginEdit, rowIndex);
editRow=rowIndex;
var行=$ (" # dg”) .datagrid (“getSelected”);
oldMoney=row.exeMoneyString;
}
},
构成了rowData) onClickRow:功能(rowIndex, {
如果(editRow !=未定义){
$ (" # dg”)。datagrid (endEdit, editRow);
}
}
}）;
}
函数formatMeony(价值){
var钱=价值;
var temp=money.split (", ");
结果var=" ";
var值=https://www.yisu.com/zixun/0;
var大?temp.length;
(var j=0;j
