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聚焦于第一个字段的代码
Oct 15 Javascript
5秒后跳转到另一个页面的js代码
Oct 12 Javascript
不想让浏览器运行javascript脚本的方法
Nov 20 Javascript
基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
May 12 Javascript
利用Angular.js限制textarea输入的字数
Oct 20 Javascript
简单理解vue中el、template、replace元素
Oct 27 Javascript
jquery做个日期选择适用于手机端示例
Jan 10 Javascript
JavaScript变量作用域_动力节点Java学院整理
Jun 27 Javascript
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
JS实现常见的查找、排序、去重算法示例
May 21 Javascript
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
Jun 19 Javascript
微信小程序组件生命周期的踩坑记录
Mar 03 Javascript
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
php中文本数据翻页(留言本翻页)
2006/10/09 PHP
深入解析PHP中逗号与点号的区别
2013/08/05 PHP
php文件服务实现虚拟挂载其他目录示例
2014/04/17 PHP
成为好程序员必须避免的5个坏习惯
2014/07/04 PHP
PHP获取文件夹大小函数用法实例
2015/07/01 PHP
Symfony2安装的方法(2种方法)
2016/02/04 PHP
PHP设计模式之装饰器(装饰者)模式(Decorator)入门与应用详解
2019/12/13 PHP
php的单例模式及应用场景详解
2021/02/27 PHP
THINKPHP-Apache服务器中使用Alias虚拟目录URL重写 隐藏index.php
2021/03/09 PHP
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
JavaScript(js)设置默认输入焦点(focus)
2012/12/28 Javascript
js获取当前路径的简单示例代码
2014/01/08 Javascript
超实用的JavaScript代码段 附使用方法
2016/05/22 Javascript
canvas知识总结
2017/01/25 Javascript
微信小程序开发之animation循环动画实现的让云朵飘效果
2017/07/14 Javascript
详解动画插件wow.js的使用方法
2017/09/13 Javascript
Vue2.0设置全局样式(less/sass和css)
2017/11/18 Javascript
Nodejs中crypto模块的安全知识讲解
2018/01/03 NodeJs
详解在网页上通过JS实现文本的语音朗读
2019/03/28 Javascript
vue-cli3使用 DllPlugin 实现预编译提升构建速度
2019/04/24 Javascript
python 不以科学计数法输出的方法
2018/07/16 Python
python实现几种归一化方法(Normalization Method)
2019/07/31 Python
Python多线程模块Threading用法示例小结
2019/11/09 Python
Pytorch 实现sobel算子的卷积操作详解
2020/01/10 Python
Python matplotlib 绘制双Y轴曲线图的示例代码
2020/06/12 Python
Python爬取某平台短视频的方法
2021/02/08 Python
Canvas实现贝赛尔曲线轨迹动画的示例代码
2019/04/25 HTML / CSS
美国一家全面的在线零售鞋类公司:SHOEBACCA
2017/01/06 全球购物
三只松鼠官方旗舰店:全网坚果销售第1
2017/11/25 全球购物
台湾良兴购物网:EcLife
2019/12/01 全球购物
adidas瑞典官方网站:购买阿迪达斯鞋子和运动服
2019/12/11 全球购物
小班下学期评语
2014/05/04 职场文书
小学校本培训方案
2014/06/06 职场文书
校庆标语集锦
2014/06/25 职场文书
angular4实现带搜索的下拉框
2022/03/25 Javascript
golang操作rocketmq的示例代码
2022/04/06 Golang