ext 代码生成器


Posted in Javascript onAugust 07, 2009

本文件为:ext_editgrid_products.js,用来显示,编辑,删除products表的数据。

var productsgrid; 
var productsstore; 
var productslimit = 25; //每页显示条数 
var productsListPostUrl = "/management/procrequest/Proc_products.ashx?action=getlist"; 
var productsModifyPostUrl = "/management/procrequest/Proc_products.ashx?action=modify"; 
var productsDeletePostUrl = "/management/procrequest/Proc_products.ashx?action=del"; 
function initproductsGrid(containerid) { 
Ext.menu.RangeMenu.prototype.icons = { 
gt: 'images/greater_then.png', 
lt: 'images/less_then.png', 
eq: 'images/equals.png' 
}; 
Ext.grid.filter.StringFilter.prototype.icon = 'images/find.png'; 
Ext.QuickTips.init(); 
function formatDate(value) { 
return value ? value.dateFormat('M d, Y') : ''; 
}; 
var fm = Ext.form; 
var sm = new Ext.grid.CheckboxSelectionModel(); 
var cm = new Ext.grid.ColumnModel([ 
sm, 
{ 
id:'productId', 
header: '产品编号', 
dataIndex: 'productId', 
sortable: true, 
width:70, 
editor: new fm.NumberField({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '产品名称', 
dataIndex: 'productName', 
sortable: true, 
width:120, 
editor: new fm.TextField({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '金额', 
dataIndex: 'money', 
sortable: true, 
width:120, 
editor: new fm.NumberField({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '地址', 
dataIndex: 'address', 
sortable: true, 
width:120, 
editor: new fm.TextField({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '电话', 
dataIndex: 'tel', 
sortable: true, 
width:120, 
editor: new fm.TextField({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '备注', 
dataIndex: 'remark', 
sortable: false, 
width:550, 
editor: new fm.myHtmlEditor({ 
allowBlank: false, 
allowNegative: false 
}) 
}, 
{ 
header: '端口', 
dataIndex: 'port', 
sortable: true, 
width:70, 
editor: new fm.NumberField({ 
allowBlank: false, 
allowNegative: false 
}) 
} 
]); 
cm.defaultSortable = true; 
/* 
var Plant = Ext.data.Record.create([ 
]); 
*/ 
productsstore = new Ext.data.JsonStore({ 
root: 'list', 
totalProperty: 'totalCount', 
idProperty: 'productId', 
remoteSort: true, 
fields: [ 
{name: 'productId' },{name: 'productName' },{name: 'money' },{name: 'address' },{name: 'tel' },{name: 'remark' },{name: 'port' } 
], 
proxy: new Ext.data.ScriptTagProxy({ 
url: productsListPostUrl 
}) 
}); 
productsstore.setDefaultSort('productId', 'desc'); 
var filters = new Ext.grid.GridFilters({ 
filters: [ 
{ type: 'string', dataIndex: 'productId' }, { type: 'string', dataIndex: 'productName' }, { type: 'string', dataIndex: 'money' }, { type: 'string', dataIndex: 'address' }, { type: 'string', dataIndex: 'tel' }, { type: 'string', dataIndex: 'remark' }, { type: 'string', dataIndex: 'port' } 
    ] 
}); 
var pagingBar = new Ext.PagingToolbar({ 
pageSize: productslimit, 
store: productsstore, 
displayInfo: true, 
displayMsg: '第 {0} - {1} 条记录,总共 {2} 条记录', 
emptyMsg: "没有记录" 
}); 
productsgrid = new Ext.grid.EditorGridPanel({ 
store: productsstore, 
cm: cm, 
sm: sm, 
bodyStyle: 'width:100%', 
autoWidth: true, 
height: 620, 
renderTo: containerid, 
autoExpandColumn: 'productId', 
frame: true, 
clicksToEdit: 2, 
plugins: [filters], 
loadMask: true, 
enableTabScroll: true, 
tbar: [{ 
text: '添加', 
tooltip: '添加新记录', 
iconCls: 'add', 
handler:function(){ 
openTab("addproducts", "添加products", null, initAddproductsForm); 
} 
}, 
'-', { 
text: '编辑', 
tooltip: '编辑选中记录', 
iconCls: 'option', 
handler: function() { 
var selectedRow = productsgrid.getSelectionModel().getSelections(); 
if (selectedRow) { 
var obj = selectedRow[0]; 
if (!obj) 
return; 
var id = obj.get("productId"); 
openTab("editproducts", "编辑products", null, initAddproductsForm, id, obj); 
} 
} 
}, 
'-', { 
text: '删除', 
tooltip: '删除选中记录', 
iconCls: 'remove', 
handler: function() { 
var selectedRow = productsgrid.getSelectionModel().getSelections(); 
Ext.MessageBox.confirm('Confirm', '你确定要删除你所选定的' + selectedRow.length + "项吗?", function(btn) { 
if (btn == 'yes') { 
if (selectedRow) { 
for (var i = 0; i < selectedRow.length; i++) { 
var obj = selectedRow[i]; 
var id = obj.get("productId"); 
productsstore.remove(obj); 
$.ajax({ 
type: "POST", 
url: productsDeletePostUrl, 
dataType: "json", 
data: "recordid=" + id, 
success: function(msg) { 
if (msg[0] && msg[0].string != "success") 
productsstore.reload(); 
} 
}); 
} 
} 
} 
}); 
} 
}], 
bbar: pagingBar 
}); 
productsstore.load({ params: { start: 0, limit: productslimit} }); 
productsgrid.on("afteredit", afterEdit, productsgrid); 
function afterEdit(obj) { 
var r = obj.record; //获取被修改的行 
var fildname = obj.field; //获取被修改的列 
var id = r.get("productId"); 
var fildval = obj.value; 
$.ajax({ 
type: "POST", 
url: productsModifyPostUrl, 
dataType: "json", 
data: { action: 'modify', fildname: fildname, id: id, fildval: fildval }, 
complete: function() { 
}, 
success: function(msg) { 
} 
}); 
} 
}

本文件为ext_add_products.js,用来添加或者编辑products表。
var productsAddPostUrl = "/management/procrequest/Proc_products.ashx?action=add"; 
var productsUpdatePostUrl = "/management/procrequest/Proc_products.ashx?action=update"; 
function initAddproductsForm(containerid, idstr, rowObj) { 
if (!idstr) 
idstr = containerid; 
var productsForm = new Ext.FormPanel({ 
labelWidth: 100, // label settings here cascade unless overridden 
url: productsAddPostUrl, 
frame: true, 
bodyStyle: 'padding:5px 5px 0', 
autoWidth: true, 
defaults: { width: '350' }, 
defaultType: 'textfield', 
renderTo: containerid, 
items: [ 
{ 
xtype: 'hidden', 
name: 'productId', 
id: 'productId' + idstr, 
value: null == rowObj ? null : rowObj.get("productId"), 
readOnly: true 
} , { 
xtype: 'textfield', 
fieldLabel: '商品名称', 
height: 20, 
name: 'productName', 
allowBlank: false, 
value: null == rowObj ? null : rowObj.get("productName"), 
id: 'productName' + idstr 
} 
, { 
xtype: 'numberfield', 
fieldLabel: '价格', 
height: 20, 
name: 'money', 
allowBlank: false, 
value: null == rowObj ? null : rowObj.get("money"), 
id: 'money' + idstr 
} 
, { 
xtype: 'textfield', 
fieldLabel: '地址', 
height: 20, 
name: 'address', 
value: null == rowObj ? null : rowObj.get("address"), 
id: 'address' + idstr 
} 
, { 
xtype: 'textfield', 
fieldLabel: '电话', 
height: 20, 
name: 'tel', 
value: null == rowObj ? null : rowObj.get("tel"), 
id: 'tel' + idstr 
} 
, { 
xtype: 'myhtmleditor', 
fieldLabel: '备注', 
height: 400, width: 600, 
name: 'remark', 
value: null == rowObj ? null : rowObj.get("remark"), 
id: 'remark' + idstr 
} 
, { 
xtype: 'numberfield', 
fieldLabel: '端口', 
height: 20, 
name: 'port', 
value: null == rowObj ? null : rowObj.get("port"), 
id: 'port' + idstr 
} 
], 
buttons: [{ 
text: '保存', 
handler: function() { 
if (!productsForm.form.isValid()) 
return; 
productsForm.form.submit({ 
meghod: 'post', 
url: !isNaN(idstr) && parseInt(idstr) > 0 ? productsUpdatePostUrl : productsAddPostUrl, 
waitMsg: '正在保存,请稍候...', 
success: function() { 
Ext.MessageBox.show({ 
title: '保存结果', 
msg: '保存成功', 
buttons: Ext.MessageBox.OK, 
icon: Ext.MessageBox.INFO 
}); 
}, 
failure: function() { 
Ext.MessageBox.show({ 
title: '保存结果', 
msg: '保存失败', 
buttons: Ext.MessageBox.OK, 
icon: Ext.MessageBox.ERROR 
}); 
} 
}); 
} 
}] 
}); 
}
Javascript 相关文章推荐
javascript 函数使用说明
Apr 07 Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
Jul 16 Javascript
禁用Enter键表单自动提交实现代码
May 22 Javascript
js获取form表单所有数据的简单方法
Aug 18 Javascript
浅谈移动端之js touch事件 手势滑动事件
Nov 07 Javascript
关于Function中的bind()示例详解
Dec 02 Javascript
JavaScript判断输入是否为数字类型的方法总结
Sep 28 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
Dec 24 Javascript
Vue render函数实战之实现tabs选项卡组件
Apr 22 Javascript
js实现蒙版效果
Jan 11 Javascript
vue 出现data-v-xxx的原因及解决
Aug 04 Javascript
Vue-router编程式导航的两种实现代码
Mar 04 Vue.js
JavaScript 的方法重载效果
Aug 07 #Javascript
JQuery 小练习(实例代码)
Aug 07 #Javascript
js正确获取元素样式详解
Aug 07 #Javascript
JavaScript 乱码问题
Aug 06 #Javascript
jquery ui dialog里调用datepicker的问题
Aug 06 #Javascript
jquery select(列表)的操作(取值/赋值)
Aug 06 #Javascript
asp(javascript)全角半角转换代码 dbc2sbc
Aug 06 #Javascript
You might like
用 Composer构建自己的 PHP 框架之基础准备
2014/10/30 PHP
php curl抓取网页的介绍和推广及使用CURL抓取淘宝页面集成方法
2015/11/30 PHP
图片连续滚动代码[兼容IE/firefox]
2009/06/11 Javascript
javascript权威指南 学习笔记之变量作用域分享
2011/09/28 Javascript
精心挑选的15个jQuery下拉菜单制作教程
2012/06/15 Javascript
为EasyUI的Tab标签添加右键菜单的方法
2012/07/14 Javascript
[JSF]使用DataModel处理表行事件的实例代码
2013/08/05 Javascript
javaScript 计算两个日期的天数相差(示例代码)
2013/12/27 Javascript
javascript创建createXmlHttpRequest对象示例代码
2014/02/10 Javascript
使用javascript实现判断当前浏览器
2015/04/14 Javascript
JavaScript获取DOM元素的11种方法总结
2015/04/25 Javascript
Jquery和JS获取ul中li标签的实现方法
2016/06/02 Javascript
javascript之Boolean类型对象
2016/06/07 Javascript
Angular.js实现注册系统的实例详解
2016/12/18 Javascript
JS+Ajax实现百度智能搜索框
2017/08/04 Javascript
Python中用memcached来减少数据库查询次数的教程
2015/04/07 Python
理解Python中的With语句
2016/03/18 Python
python按时间排序目录下的文件实现方法
2018/10/17 Python
python 判断参数为Nonetype类型或空的实例
2018/10/30 Python
python操作文件的参数整理
2019/06/11 Python
Python Subprocess模块原理及实例
2019/08/26 Python
pycharm修改file type方式
2019/11/19 Python
从numpy数组中取出满足条件的元素示例
2019/11/26 Python
Windows系统下pycharm中的pip换源
2020/02/23 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
神经网络训练采用gpu设置的方式
2021/03/03 Python
浅析canvas元素的html尺寸和css尺寸对元素视觉的影响
2019/07/22 HTML / CSS
视光学专业毕业生推荐信
2013/10/28 职场文书
留学推荐信范文
2014/05/10 职场文书
绿色环保演讲稿
2014/05/10 职场文书
龙猫观后感
2015/06/09 职场文书
跳高加油稿
2015/07/21 职场文书
《富饶的西沙群岛》教学反思
2016/02/16 职场文书
委托书范本格式
2019/04/18 职场文书
2019假期福利管理制度!
2019/07/15 职场文书
详解JS ES6编码规范
2021/05/07 Javascript