首页 web前端 js教程 ext 代码生成器_YUI.Ext相关

ext 代码生成器_YUI.Ext相关

May 16, 2016 pm 06:48 PM
ext 代码生成器

本文件为: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 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
});
}

});

}
}]
});

}
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

仓库:如何复兴队友
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

深入探讨Linux ext2文件系统的物理存储结构 深入探讨Linux ext2文件系统的物理存储结构 Mar 14, 2024 pm 09:06 PM

Linuxext2文件系统是一种在大部分Linux操作系统上使用的文件系统,它采用了一种高效的磁盘存储结构来管理文件和目录的存储。在深入探讨Linuxext2文件系统的物理存储结构之前,我们首先需要了解一些基本概念。在ext2文件系统中,数据存储在数据块(block)中,数据块是文件系统中最小的可分配单位。每个数据块有固定的大小,通常为1KB、2KB或4

PHP开发中如何使用代码自动生成工具 PHP开发中如何使用代码自动生成工具 Jun 27, 2023 pm 02:30 PM

随着Web开发的快速发展,PHP已经成为了Web开发的主要编程语言之一。许多Web开发人员使用PHP编写他们的应用程序,因为它具有易于学习,易于编写,跨平台等优点。然而,对于大型的PHP项目来说,手写所有的代码是十分耗时和费力的。毕竟,我们想要以更高效的方式完成项目,并快速地开发出满足客户要求的应用。因此,我们可以使用PHP自动代码生成工具来加速开发过程,帮

分析Linux ext2文件系统的物理组织方式 分析Linux ext2文件系统的物理组织方式 Mar 15, 2024 am 09:24 AM

Linuxext2文件系统是Linux操作系统中常用的文件系统之一,具有较好的性能和稳定性。本文将会详细分析ext2文件系统的物理组织方式,并提供一些具体的代码示例来帮助读者更好地理解。一、ext2文件系统概述ext2文件系统是Linux系统上最早期的第二代扩展文件系统,它在文件系统的性能、可靠性和稳定性上做了一定的改进。它主要由超级块、组描

ThinkPHP6代码生成器:快速生成CRUD代码 ThinkPHP6代码生成器:快速生成CRUD代码 Aug 25, 2023 pm 10:24 PM

ThinkPHP6代码生成器:快速生成CRUD代码前言:在开发过程中,我们经常会遇到需要创建增删改查(CRUD)的功能。这种重复的劳动既浪费时间,又容易出错。为了提高开发效率和减少错误,我们可以使用一款强大的代码生成器来自动生成CRUD代码。本文将介绍一款基于ThinkPHP6框架的代码生成器,帮助开发者快速生成CRUD代码。概述:繁琐的编码工作可以通过代码

如何使用Python正则表达式进行代码生成器开发 如何使用Python正则表达式进行代码生成器开发 Jun 22, 2023 pm 04:44 PM

Python正则表达式是一个强大的工具,它可以用于代码生成器的开发。代码生成器是一个自动化工具,它能够根据特定的规则和条件生成代码或者其他文本。这种工具可以节省大量的时间和精力,因为它们可以帮助程序员自动化重复性的任务。下面我们将介绍如何使用Python正则表达式进行代码生成器开发。理解Python正则表达式Python正则表达式是一种模式匹配的工具,可以用

Linux系统中ext3和ext4有什么不同? Linux系统中ext3和ext4有什么不同? Feb 19, 2024 am 11:48 AM

  文件系统是文件存放在磁盘等存储设备上的组织方法。Linux系统能支持多种目前流行的文件系统,其中包含:EXT2、EXT3、EXT4、FAT、FAT32等。那么Linux系统中ext3和ext4有什么不同?以下是详细的内容介绍。  Linux系统中ext3和ext4有什么不同?  1、更大的文件系统和更大的文件  ext3:16TB文件系统和最大2TB文件;  ext4:1EB文件系统和最大16TB文件。  2、无限数量的子目录  ext3:32000个子目录;  ext4:无限数量的子目录。

CentOS搭建web服务器的文件系统选择及优化建议 CentOS搭建web服务器的文件系统选择及优化建议 Aug 05, 2023 pm 03:35 PM

CentOS搭建web服务器的文件系统选择及优化建议简介:在搭建web服务器时,选择合适的文件系统并进行优化是极为重要的。本文将介绍在CentOS上搭建web服务器时常用的文件系统,并提供相应的优化建议。一、文件系统选择XFS文件系统XFS是一种先进的、高性能的日志文件系统。它具有快速高效的文件系统恢复能力,针对大容量存储的I/O操作性能表现出色。XFS对大

Yii框架中的Gii代码生成器:快速创建代码 Yii框架中的Gii代码生成器:快速创建代码 Jun 21, 2023 am 09:44 AM

Yii框架是一种开源的PHP框架,它提供了丰富的功能和特性,旨在提高开发者的工作效率和代码质量。其中一个值得一提的功能是Gii代码生成器,它可以帮助开发者快速创建代码并减少手工编写冗长、重复的代码的时间和精力,本篇文章就为大家介绍一下Yii框架中的Gii代码生成器。什么是Gii代码生成器Gii(GenerateIntegratedInterface)在Y

See all articles