Jquery中LigerUi的弹出编辑框方法!
来源:互联网 发布:北京人民大学网络教育 编辑:程序博客网 时间:2024/06/01 23:52
一、载入
<link href="../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" /> <script src="../lib/jquery/jquery-1.5.2.min.js" type="text/javascript"></script> <script src="../lib/ligerUI/js/ligerui.min.js" type="text/javascript"></script> <script src="../lib/ligerUI/js/plugins/ligerForm.js" type="text/javascript"></script> <script src="../lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script> <link href="../lib/css/common.css" rel="stylesheet" type="text/css" /> <script src="../lib/js/common.js" type="text/javascript"></script> <script src="../lib/js/LG.js" type="text/javascript"></script> <script src="../lib/jquery-validation/jquery.validate.min.js" type="text/javascript"></script> <script src="../lib/jquery-validation/jquery.metadata.js" type="text/javascript"></script> <script src="../lib/jquery-validation/messages_cn.js" type="text/javascript"></script> <script src="../lib/js/ligerui.expand.js" type="text/javascript"></script> <script src="../../lib/ligerUI/js/plugins/ligerDateEditor.js" type="text/javascript"></script>二、Html
<div id="Editdetail" style="display:none;"><form id="EditForm" method="post"></form> </div> <%--弹出编辑框DIV--%>
三、在Add中添加事件
//工具条事件 function toolbarBtnItemClick(item) { switch (item.id) { case "add": addbill({}, true, '添加记录', false); break; case "view": var selected = grid.getSelected(); if (!selected) { LG.tip('请选择行!'); return } addbill(selected, false, '查看记录', true); break; case "modify": var selected = grid.getSelected(); if (!selected) { LG.tip('请选择行!'); return } addbill(selected, false, '修改记录', false); break; case "delete": jQuery.ligerDialog.confirm('确定删除吗?', function (confirm) { if (confirm) f_delete(); }); break; } }
四、在函数下面,添加弹出框样式代码
var detailWin = null, currentData = null, currentIsAddNew, currentIsView; function addbill(data, isAddNew, t, isview) { currentData = data; currentIsAddNew = isAddNew; currentIsView = isview; if (detailWin) { detailWin.set('title', t); detailWin.show(); } else { // 放入弹出窗口样式内容 } if (!isAddNew) { // public int LrId { get; set; } $("#ProtId2").val(currentData.ProductName); $("#ProId1").val(currentData.ProductId); $("#ForId2").val(currentData.FormatName); $("#Foad1").val(currentData.FormatId); $("#Ded2").val(currentData.DegreeName); $("#Degrd1").val(currentData.DegreeId); $("#Appl").val(currentData.AppendBill); $("#Bum").val(currentData.BoxNum); $("#Maate").val(currentData.MadeDate); $("#BottleNum").val(currentData.BottleNum); $("#Bumpany2").val(currentData.BuyCompanyName); $("#BuyCoy1").val(currentData.BuyCompanyId); $("#VayId2").val(currentData.VarietyName); $("#VarId1").val(currentData.VarietyId); $("#Handate").val(currentData.HandDate); $("#Fact2").val(currentData.FactoryName); $("#Fact1").val(currentData.FactoryId); $("#Froce2").val(currentData.FromPlaceName); $("#Froce1").val(currentData.FromPlaceId); } }
四、弹出窗口样式中的内容
var mainform = $("#EditForm"); mainform.ligerForm({ inputWidth: 150, fields: [ { name: "ProId1", type: "hidden" }, // 隐藏字段,为弹出选择编号保存值 { display: "仓库", name: "Daihao1", newline: true, labelWidth: 100, width: 150, space: 30, type: "text", validate: { required: true, digits: true} }, { display: "商品名称", name: "ProId", comboboxName: "ProId2", newline: false, labelWidth: 100, width: 150, space: 30, type: "select", option: {} }, // 弹出选择框 { display: "单位", name: "DegreeId", comboboxName: "DegreeId2", newline: false, labelWidth: 100, width: 150, space: 30, type: "select", options: { valueFieldID: "DegreeId1", treeLeafOnly: false, tree: { url: "../handle/se1.ashx?ajaxaction=Getgree", checkbox: false}} }, { display: "生产日期", name: "MadeDate1", newline: true, labelWidth: 100, width: 150, space: 30, type: "date", validate: { required: true} }, { display: "备注", name: "mark", newline: false, labelWidth: 100, width: 150, space: 30, type: "text", validate: { required: true, digits: true} } ], toJSON: JSON2.stringify }); $.metadata.setType("attr", "validate"); LG.validate(mainform, { debug: true }); $("#HandDate").val(currentdate); $("#BoNum").val("0"); $.ligerui.get("ProId2").set('onBeforeOpen', f_selectCoct) $.ligerui.get("Faory2").set('onBeforeOpen', f_selectFary_1) $.ligerui.get("Buyany2").set('onBeforeOpen', f_selectFary_2) $.ligerui.get("Froce2").set('onBeforeOpen', f_selectFroace) detailWin = $.ligerDialog.open({ target: $("#Editdetail"), width: 595, height: 460, top: 80, title: "添加保存修改窗口", //240 buttons: [ { text: '保存', onclick: function () { save(); } }, { text: '取消', onclick: function () { detailWin.hide(); } } ] });
五、保存事件
- Jquery中LigerUi的弹出编辑框方法!
- LigerUi绑定文本框为【选择框】和【弹出框】的方法!
- LigerUI中LigerDialog.open的简易方法
- ligerui编辑
- Jquery中LigerUi插件的获取Grid中的行数据!
- jQuery LigerUI 插件中ligerTree的使用介绍
- Js(JavaScript)或LigerUi中,弹出是或否的选择框示例!(confirm用法示例)
- Jquery编辑框弹出复选框
- 使用JQuery实现Web弹出编辑框
- Jquery编辑框弹出选择DIV
- Jquery LigerUI-表格的使用
- LigerUI中Grid的onAfterEdit事件(结束编辑后事件)
- jquery ligerUI
- LigerUI中accordion的若干问题
- Jquery中LigerUi框架的GRID控件,汇总的使用实例!
- jquery弹出提示框,背景变暗不能编辑
- jquery ligerui下拉框赋值问题
- LigerUi弹出编辑窗口中日期默认当前日期设设置!
- 席慕容《画展》
- OpenGL学习- Triangle
- HDU2549:壮志难酬
- Java获取Oracle存储过程返回的自定义嵌套表
- qtopia/embed编译
- Jquery中LigerUi的弹出编辑框方法!
- Broken Necklace
- JAVA 反射总结
- Vim 实用技术,第 1 部分: 实用技巧
- centos安装apache2.4.2
- Oracle中Hint深入理解
- Vim 实用技术,第 2 部分: 常用插件
- 达人教你如何选择嵌入式操作系统
- 为什么要学习 Linux 环境下的编程