- 浏览: 42235 次
- 性别:
- 来自: 北京
最新评论
validator.js内容
var gridConfig = {};
var gridId = "statisticsGrid";
var xwidth = 290;
var fwidth = 160;
var _json= 1;
Ext.onReady(function(){
gridConfig.pagesize = pagesize;
gridConfig.gridId = gridId;
gridConfig.gridCmReaderConfig = [
{show:'uid',tag:'ROWNUM_',hidden:true},
{show:'验证员Id',tag:'VERIFIER_ID',hidden:true,xwidth:fwidth,position:'left',xtype:'hidden'},
{show:'机构名称',tag:'ORGANIZATION_NAME',hidden:true,xwidth:fwidth,position:'left',xtype:'hidden'},
{show:'验证员姓名',tag:'VERIFIER_NAME',hidden:false,xwidth:fwidth,position:'left',require:true},
{show:'验证员介绍',tag:'INTRODUCTION',hidden:true,xwidth:fwidth,position:'left',xtype:'hidden'},
{show:'图片地址',tag:'VERIFIER_PHOTO_URL',hidden:true,xwidth:fwidth,position:'left',xtype:'hidden'},
{show:'职称',tag:'VERIFIER_TITLE',hidden:false,xwidth:fwidth,position:'left'},
{show:'年龄/岁',tag:'VERIFIER_AGE',hidden:false,xwidth:fwidth,position:'left'},
{show:'学历',tag:'VERIFIER_DEGREE',hidden:false,xwidth:fwidth,position:'right'},
{show:'所属机构',tag:'CERTIFICATION_AUTHORITIES_ID',hidden:true,xwidth:fwidth,position:'right',xtype:'remoteSiteCombox',require:true},
{show:'发布状态',tag:'STATUS',hidden:false,renderer: statusName,xwidth:fwidth,position:'left',xtype:'commentLocal'},
{show:'是否推荐',tag:'TOP',hidden:true,xwidth:fwidth,position:'right',xtype:'isRecommendLocal'}
];
gridConfig.sm = true;
gridConfig.enableColumnHide=false,
gridConfig.storeURL = basepath+"/admin/validator/validators";
gridConfig.baseParams = {_json:_json};
/****************************状态下拉选*****************************/
var statusData = [
['-1','==全部=='],
['1','已发布'],
['0','未发布'],
['2','已删除']
];
var statusStore = new Ext.data.SimpleStore({
fields: ['value', 'text'],
data: statusData
});
var statusCombo = new Ext.form.ComboBox({
store: statusStore,
id:'statusCombo',
emptyText: '==全部==',
width:100,
mode: 'local',
triggerAction: 'all',
valueField: 'value',
displayField: 'text'
});
/**********************************************************************************/
var verifierName = {xtype:'textfield',emptyText:'==验证员姓名==',id:'verifierName'};
gridConfig.tbar=['->','-',{text:'添加验证员',handler:addFn,iconCls:'addBtn'},'-',
{text:'修改',handler:updateFn,iconCls:'updateBtn'},'-',
{text:'发布',handler:pubFn,iconCls:'rightBtn'},'-',
{text:'取消发布',handler:upubFn,iconCls:'noBtn'},'-',
{text:'删除',handler:delFn,iconCls:'delBtn'},'-',
"发布状态:",statusCombo,'-',
"验证员姓名:",verifierName,'-',
{text:'查询',handler:searchFn,iconCls:'searchBtn'},'-',
{text:'重置',handler:reSetFn,iconCls:'reSetBtn'},'-'
];
gridConfig.viewConfig = {
forceFit: true,
enableRowBody:true,
showPreview:false
};
var agrid = new basePagingGrid(gridConfig);
var viewport = new Ext.Viewport({
layout:'fit',
listeners:{'afterrender':function(){
}},
items:[agrid]
});
})
/**********************************弹出添加(修改)框**********************************************************/
/**********************************xby**********************************************************/
function addFn(btn)
{
showWinFn(btn,"add")
}
function updateFn(btn){
var grid = Ext.getCmp(gridId);
var sm = grid.getSelectionModel();
var sels = sm.getSelections();
if(sels.length ==0)return;
if(sels.length >=2)
{
Ext.Msg.alert("系统提示","请只选择一条记录进行修改!!!") ;
return;
}
var rec = sels[0];
showWinFn(btn,"update",rec)
}
function showWinFn(btn,flag,rec)
{
/**计算高度和宽度***/
var wwWin = Ext.getDom(window);
var abody = Ext.getBody().dom;
var ah = wwWin.screen['availHeight'];
var aw = wwWin.screen['availWidth'];
var aw = abody.clientWidth;
var ah = abody.clientHeight;
var title ="新增信息";
if(flag=="update"){
title = "更改信息";
}
var dataobj = {};
if(typeof rec != 'undefined')dataobj =Ext.apply( dataobj, rec.data ) ;
var obj = makeformpanel( gridConfig.gridCmReaderConfig,dataobj);
awin = new Ext.Window({
layout:'fit',
id:'savewin',
title:title,
width:aw,
height:ah,
closeAction:'close',
plain: true,
modal :true,
maximizable:true,
listeners :{
'afterrender':function(c)
{
if(typeof rec != 'undefined')
{
//设置编辑页面的内容
var dbcontents =rec.data['INTRODUCTION'];
var dbverifierPhotoUrl =rec.data['VERIFIER_PHOTO_URL'];
var certificationAuthoritiesId = rec.data["CERTIFICATION_AUTHORITIES_ID"];
var certificationName = rec.data["ORGANIZATION_NAME"];
var combox = Ext.getCmp("f_CERTIFICATION_AUTHORITIES_ID");
var siteName = certificationName;
var siteId = certificationAuthoritiesId;
if(siteName && combox)combox.setValue(siteName);
if(siteId && combox)combox.value =siteId;
if(Ext.isEmpty(dbcontents) ==false){
Ext.getCmp("aintroduction").setValue(dbcontents);
}
if(Ext.isEmpty(dbverifierPhotoUrl) ==false){
var c = Ext.getCmp("verifierPhotoUrl")
if(c){
//c.setValue(dborganizationPhotoUrl);
}else
{
}
}
// Ext.getCmp("organizationPhotoUrl").setValue(c_inf);
}
}},
minimizable :true,
items:[
new Ext.form.FormPanel({
id:'mainForm',
url: basepath+'/admin/validator/addOrUpdatevalidator',
fileUpload: true,
layout:'form',
border : false,
items:[{
frame:true,
border : false,
items: [{
layout:'column',
border : false,
items: [{
columnWidth:.5,
layout: 'form',
items:obj['left'].sort(sortNumber)
},{
columnWidth:.5,
layout: 'form',
items:obj['right'].concat([{
border : false,
xtype: 'textfield',
name:'verifierPhotoUrl',
id:'averifierPhotoUrl',
width: 300,
fieldLabel: '图片上传',
inputType: 'file'
}])
}]
}/**,{
//frame:true,
border : false,
layout:'form',
items:[]
}*/]
},{
xtype:'panel',
frame:true,
layout:'fit',
items:[{
name: 'aintroduction',
fieldLabel: '介绍',
height:250,
xtype:'fckeditor',
frame:true,
id:'aintroduction'
}]
}
]
})
],
buttons: [{
text: '关闭',
id:'shutdownBtn',
handler: function(){
awin.close();
}
},
{
text: '确定',
id:'sureBtn',
handler: function(){
var gridCmReaderConfig =gridConfig.gridCmReaderConfig;
var obj = getSubmitValue(gridCmReaderConfig);
if(obj['verifierName']!=null && obj['verifierName'].trim().length==0 )
{
Ext.Msg.alert('系统提示', "验证员姓名不能为空");
return;
}
if(obj['certificationAuthoritiesId']!=null && obj['certificationAuthoritiesId'].trim().length==0 )
{
Ext.Msg.alert('系统提示', "所属机构不能为空");
return;
}
var content = Ext.getCmp('aintroduction').getValue();
obj.introduction = content==null?" ":content;
Ext.getCmp('mainForm').getForm().baseParams = {flag:flag,baseInfo:toString2(obj)};
Ext.getCmp('mainForm').getForm().submit({
success: function(form, action){
var info = action.result;
if(info.success=="true"){
Ext.Msg.alert('信息','添加成功');
}else if(info.success=="updatetrue"){
Ext.Msg.alert('信息','修改成功');
}else{
Ext.Msg.alert('信息','添加失败');
}
},
failure: function(){
Ext.Msg.alert('系统提示', '操作失败,请确保网路畅通!!!');
}
});
}
}
]
})
awin.show(this);
}
function getSubmitValue(gridCmReaderConfig)
{
var obj = {};
for(var i =0;i<gridCmReaderConfig.length;i++)
{
var aobj = gridCmReaderConfig[i];
if(aobj.xtype=='img')continue;
var aformid = "f_"+aobj['tag'];
var tag = aobj['tag'];
var cmp = Ext.getCmp(aformid);
if(!cmp)continue;
if(aobj.xtype=='date')
{
if(cmp) obj[tag] = cmp.getRawValue();
}
else
{
obj[tag] = cmp.getValue()==null?"":cmp.getValue();
}
}
return obj;
}
/****************************end******xby**********************************************************/
function delFn(btn){
delOrpubFn(btn,"del");
}
function pubFn(btn){
delOrpubFn(btn,"pub")
}
function upubFn(btn){
delOrpubFn(btn,"upub")
}
/*************删除,发布,取消发布***************************/
function delOrpubFn(btn,mark)
{
var selsobj = getSeleds();
var ids = selsobj.ids;
var records = selsobj['recs'];
var unames = [];
if(ids.length==0)
{
return;
}
else
{ if(mark=="del"){
Ext.MessageBox.confirm('系统提示', '您确定要删除选中的记录吗?',
function(btn){
if(btn=='yes'){
ajaxDelOrpudFn(ids,selsobj['recs'],unames,mark);
}
}
);
}else{
ajaxDelOrpudFn(ids,selsobj['recs'],unames,mark);
}
}
}
function ajaxDelOrpudFn(ids,records,unames,mark)
{
var selobj = getSeleds();
var params= {
ids:ids.join(","),
unames:unames.join(","),
_json:_json,
type: mark
};
function successfulfn(response){
var json = response.responseText;
json = eval("("+json+")");
if(json["result"]=="true")
{
var grid = Ext.getCmp(gridId);
grid.delRows(records);
}else
{
for(var i=0;i<selobj.recs.length;i++)
{
var record = selobj.recs[i];
if(json["result"]=="pub")
{
record.set( "STATUS","1");
}else if(json["result"]=="upub")
{
record.set( "STATUS","0");
}else if(json["result"]=="del")
{
record.set( "STATUS","2");
}
record.commit();
}
}
}
function faulterFn(response)
{
var vx = response.responseText;
}
var url = basepath+'/admin/validator/delOrpub';
ajaxFn(url,successfulfn,faulterFn,params);
}
/*************************获取Id**************************************/
function getSeleds()
{
var grid = Ext.getCmp(gridId);
var sm = grid.getSelectionModel();
var sels = sm.getSelections();
var ret = {ids:[],recs:[]};
if(sels ==null )return ret;
var ids=[];
for(var i=0;i<sels.length;i++)
{
var r = sels[i];
var nid = r.data["VERIFIER_ID"];
ids.push(nid);
}
ret.ids = ids;
ret.recs = sels;
return ret;
}
/*************查询**************************/
function searchFn()
{ var verifierName = Ext.getCmp("verifierName");
var verifierNameValue=verifierName.getValue();
var status = Ext.getCmp("statusCombo");
statusValue=status.getValue();
var grid = Ext.getCmp(gridId);
var obj = grid.store.baseParams?grid.store.baseParams:{};
obj.status =statusValue;
obj.verifierName = verifierNameValue;
grid.store.baseParams = obj;
grid.store.load({params : {start : 0,limit : pagesize }});
}
function statusName(value) {
if (value == '0') {
return "未发布";
} else if(value == '1') {
return "已发布";
}else if(value == '2') {
return "已删除";
}
}
//日期格式化
function dateFormat(v, cellmeta, record, rowIndex, columnIndex, store)
{
if(!v)return "";
else
{
return new Date(v).format("Y-m-d")
}
}
//重置
function reSetFn()
{
Ext.getCmp('statusCombo').reset();
Ext.getCmp("verifierName").reset();
statusValue="";
}
makeForm.js内容
/**
*
*/
var topLength = 20;
function makeformpanel( cfgobj,data,db2show)
{
var ret = {};
var position = "";
for(var i=0;i<cfgobj.length;i++)
{
var obj = cfgobj[i];
if(typeof obj.position =='undefined')
{
continue;
}
var fieldLable = obj.show;
if(obj['require']==true)fieldLable =obj.show+"(<span style='color:red;'>*</span>)";
var avalue = data[obj.tag]?data[obj.tag]:"";
if(data[obj.tag] =="0")avalue="0";
if(obj.tag.indexOf(".")>-1 &&avalue =="")
{
var tTag = obj.tag.split(".");
if(typeof data[tTag[0]] !== 'undefined')
avalue = data[tTag[0]][tTag[1]];
if(!avalue) avalue = "";
}
if(obj.xtype == 'img' && typeof data[obj.tag] =='undefined')avalue = "#";
position = obj.position;
if(typeof ret[position] =='undefined')
{
ret[position] = [];
}
var field = "";
if(typeof obj.xtype == 'undefined')
{
field =
{
xtype:'textfield',
fieldLabel :fieldLable,
value:avalue
};
if(obj.xwidth)
{
field.width=obj.xwidth;
}
if(obj.readonly)
{
field.readOnly =obj.readonly;
}
}else if( obj.xtype == 'hidden')
{
field =
{
xtype:'hidden',
fieldLabel :fieldLable,
value:avalue,
maxLength:50
};
if(obj.xwidth)
{
field.width=obj.xwidth;
}
}else if(obj.xtype == 'emailcombox'){
field =
{
xtype: 'textfield', //邮箱验证
fieldLabel:fieldLable,
width:obj.xwidth,
value:avalue,
vtype:'email'
};
}
else if(obj.xtype == 'numbercombox'){
field =
{
xtype: 'numberfield', //number验证IPcombox
fieldLabel:fieldLable,
width:obj.xwidth,
//readOnly:true,// obj.readonly,
value:avalue
};
}else if(obj.xtype == 'IPcombox'){
field =
{
xtype: 'textfield', //IPcombox验证
fieldLabel:fieldLable,
width:obj.xwidth,
value:avalue,
regex:/^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/
};
}else if(obj.xtype == 'textareacombox'){
field =
{
xtype: 'textarea', //IPcombox验证
fieldLabel:fieldLable,
width:obj.xwidth,
value:avalue
};
}
else if( obj.xtype == 'img')
{
if(avalue == null ||avalue =="")
{
field =
{
xtype: 'panel', //或者xtype: 'component',
html:fieldLable+'没有上传'
};
if(obj.xwidth)
{
field.width=obj.xwidth;
}
}else
field =
{
xtype: 'box', //或者xtype: 'component',
fieldLabel:fieldLable,
width: 300, //图片宽度
height: 200, //图片高度
autoEl: {
tag: 'img', //指定为img标签
src: avalue //指定url路径
}
};
}
else if( obj.xtype == 'topLocal')
{
if(!avalue) avalue = '';
var options = [
['','不置顶']
];
for(var x=1;x<=topLength;x++)
{
options.push([x,x]);
}
field =makeLocalCombox(options,obj,avalue);
field.editable = false;
}else if(obj.xtype=='remoteSiteCombox')
{
var store2 = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:basepath+'/admin/certificationbody/authorities'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalRows',
root: 'pageData'
}, [{name:'certificationAuthoritiesId'},{name:'organizationName'}])
});
//store.load();
field = new Ext.form.ComboBox({
store: store2,
id:"f_"+obj.tag,
editable:false,
loadingText : '正在加载信息',//加载数据时显示的提示信息
emptyText: '==所属机构==',
mode: 'remote',
fieldLabel: obj.show+"(<span style='color:red;'>*</span>)", // "所属机构",
triggerAction: 'all',
valueField: 'certificationAuthoritiesId',
displayField: 'organizationName',
pageSize: 10,
width:obj.xwidth,
resizable: true
});
}
else if( obj.xtype == 'commentLocal')
{
if(!avalue) avalue = '0';
var options = [
['0','未发布'],
['1','已发布'],
['2','已删除']
];
field =makeLocalCombox(options,obj,avalue);
field.editable = false;
}else if( obj.xtype == 'isRecommendLocal')
{
if(!avalue) avalue = '0';
var options = [
['0','未推荐'],
['1','已推荐']
];
field =makeLocalCombox(options,obj,avalue);
field.editable = false;
}else if( obj.xtype == 'areaLocal')
{
if(!avalue) avalue = '1';
var options = [
['1','华东地区'],
['2','华南地区'],
['3','华北地区'],
['4','华中地区'],
['5','东北地区'],
['6','西南地区'],
['7','西北地区'],
['8','台湾省'],
['9','香港特别行政区'],
['10','澳门特别行政区'],
];
field =makeLocalCombox(options,obj,avalue);
field.editable = false;
}else if(obj.xtype =='columntree')
{
//field = columntreeFn(obj.xwidth);
var require = true;
var treecombox = agetColumnTreeCombox('acolumnTree','atreeColumnCombo',false,'cId',require);
var field = treecombox['combox'];
field.width =obj.xwidth;
var acolumnTree = treecombox['tree'];
acolumnTree.on('show',function(){
acolumnTree.getRootNode().expand();
});
}else if(obj.xtype=='templetateTree')
{
//var fieldLable =obj.show+"(<span style='color:red;'>*</span>)";
var troot = new Ext.tree.AsyncTreeNode({
text:'所有',
id:'t0',
children: makeTreeNode(templeateTreedata,false)//
});
var telmplateTree = new Ext.tree.TreePanel({
root:troot,
rootVisible:false,
id:"templetateTree",
listeners:{
'beforeclick':function(node,e){
var uri = node.attributes.apath;
if(uri==null || uri ==""||typeof uri ==undefined)
{
e.stopEvent();
return false;
}
}
},
loader: new Ext.tree.TreeLoader()
});
field = new ComboBoxTree({
id:"tempTreeCombo",
readOnly:false,
widthbj.xwidth,
passName:'tId',
allowUnLeafClick:false,//只允许选择叶子
//treeHeight:200,
emptyText:'请选择使用模板',
fieldLabel:fieldLable,
tree:telmplateTree
});
}
else if( obj.xtype == 'date')
{
field =
{
xtype: 'datefield',
fieldLabel:fieldLable ,
value:avalue
};
if(obj.xwidth)
{
field.width =obj.xwidth;
}if(obj.format)
{
field.format = obj.format;
}
}
else if(obj.xtype=='textarea')
{
field={
xtype:'textarea',
fieldLabel :fieldLable,
value:avalue
};
if(obj.xwidth)
{
field.width=obj.xwidth;
}
}
field.id="f_"+obj.tag;
field.name=obj.tag;
if(typeof obj.xorder !='undefined')
{
field.xorder = obj.xorder;
}
ret[position].push(field);
}
return ret;
}
/*function xmakeLocalCombox(data,obj,avalue)
{
var store = new Ext.data.SimpleStore({
fields: ['value', 'text'],
data : data
});
var combo ={
store: store,
xtype:'combo',
// id :"f_"+obj.tag,
value:avalue,
fieldLabelbj.show ,
width:obj.xwidth,
emptyText: '===请选择===',
mode: 'local',
triggerAction: 'all',
valueField: 'value',
displayField: 'text'
};
return combo;
}*/
function makeLocalCombox(data,obj,avalue)
{
var store = new Ext.data.SimpleStore({
fields: ['value', 'text'],
data : data
});
var combo = {
store: store,
xtype:'combo',
// id :"f_"+obj.tag,
value:avalue,
fieldLabelbj.show ,
width:obj.xwidth,
emptyText: '===请选择===',
mode: 'local',
triggerAction: 'all',
valueField: 'value',
displayField: 'text'
};
return combo;
}
function sortNumber(a,b)
{
return a.xorder - b.xorder;
}
相关推荐
- **编辑操作**:可以使用 Ext.form 或其他表单组件来实现编辑功能。 - **查看操作**:可以通过弹出框或者新页面的方式查看记录详情。 #### 三、注意事项 1. **安全性**:确保所有用户输入都经过了适当的验证和...
例如,EXT的GridPanel允许开发者创建数据驱动的表格,支持排序、分页和行编辑等功能。TreePanel则用于展示层次结构的数据,支持动态加载和拖放操作。 EXT 3.0的布局管理器也是一个关键特性,它能自动管理组件的尺寸...
其表格组件(`Ext.grid.GridPanel`)是其最具特色的功能之一,广泛应用于数据展示和管理。 #### 二、代码分析 在本例中,我们首先引入了必要的 ExtJS 相关文件,包括样式表、脚本等资源。 ```html ...
**2.6 Grid Panel (Ext.grid.GridPanel)** - **xtype**: `grid` - **功能描述**:Grid Panel 是一个用于展示表格数据的组件。 - **主要用途**:展示结构化数据,支持排序、过滤等功能。 **2.7 Paging Toolbar (Ext...
EXT.NET 提供了诸如 GridPanel、FormPanel 等组件来轻松实现这些功能。GridPanel 可以用来展示数据,并通过行编辑或行选择进行修改和删除操作。FormPanel 则用于创建和更新数据,它可以与后台数据库进行数据交换,...
EXT3.2还提供了强大的布局管理器,如Fit布局、Border布局、Form布局等,帮助开发者构建适应不同屏幕尺寸和设备的响应式界面。 在实际开发中,EXT3.2的Ajax支持和数据模型(Model)也是不可忽视的部分。它提供了便捷...
在本文中,我们将深入探讨Ext Js的核心组件,包括Grid、Form和Tree,并讨论如何在项目中有效地引入和使用Ext Js。 1. **Grid组件** Grid是Ext Js中用于展示和操作表格数据的关键组件。`Ext.grid.GridPanel`允许你...
`Ext.grid.GridPanel`则是一个数据展示组件,常用于表格数据的展示和操作。每个类都详细说明了其构造函数、配置选项、事件处理函数以及方法的使用。 在API文档中,开发者还可以找到关于布局管理、数据绑定、Ajax...
editor:new Ext.form.DateField({ format: 'y-m-d' }), ``` ### 四、监听事件验证日期格式 代码中还包含了对store加载事件的监听,用以验证数据是否按照预期的格式正确加载: ```javascript 'load': function...
通过`Ext.grid.GridPanel`创建表格,设置`store`来绑定数据,利用`columns`定义列配置。此外,还可以实现行选择、行编辑、行拖放等功能,提升用户体验。 2. 表单(Form):EXT3.0的表单组件允许开发者创建复杂的...
var comboBox = Ext.create('Ext.form.field.ComboBox', { multiSelect: true, store: myStore, // 这里是你的数据存储 displayField: 'name', valueField: 'id' }); ``` 为了实现全选和去全选的功能,我们可以...
除了以上提到的MessageBox和Grid之外,EXT还提供了大量的其他组件,如Form、TabPanel、Tree等,满足多样化的用户界面需求。 #### 使用Ajax Ajax是现代Web应用不可或缺的一部分,它使得页面可以在不重新加载的情况...
4. **Form处理**:EXT的表单组件支持复杂的数据输入和验证,EXT4.1增加了更多的表单元素和布局选项,如字段集、组合框、日期选择器等,同时也优化了表单的提交和处理流程。 5. **AJAX通信**:EXT4.1改进了Ajax请求...
- **Ext.grid.GridPanel**: 显示二维数据的组件,支持排序、分页、行编辑等功能。 - **Ext.grid.ColumnModel**: 定义表格列的显示和行为。 - **Ext.grid.EditorGridPanel**: 提供单元格级别的编辑功能。 6. **...
var formPanel = Ext.create('Ext.form.Panel', { items: [{ xtype: 'filefield', name: 'uploadFiles', fieldLabel: '选择文件', multiple: true, // 允许多选 buttonText: '浏览...' }] }); ``` 当用户...
4. **表格和网格**:EXT 2.0中的GridPanel组件提供了高度可定制的表格功能,包括排序、分页、行编辑和列重排等。这对于展示大量数据非常有用。 5. **树形视图**:TreePanel组件提供了灵活的树形数据结构显示,支持...
4. **网格(Grid)**:Ext的GridPanel是显示大量数据的利器,支持分页、排序、过滤和编辑功能。 5. **表单(Form)**:Ext的表单组件齐全,支持各种输入控件,以及验证和数据提交功能。 6. **Ajax通信**:使用Ajax...