⑴ excel外部导入数据
table导出excel文件 总的来说,两种方法:服务器端生成和浏览器端生成。
服务器端生成就是:根据用户请求,获取相应的数据,使用poi/jxl, jacob/jawin+excel,或是用数据拼html的table或是cvs纯文本的数据格式等。然后按.xls或是.cvs格式的文件的形式返回给用户,指定Content-Type:application/vnd.ms-excel ,浏览器就会提示要下载的文件是excel文件。
poi/jxl, jacob/jawin生成的是excel的biff格式。html/csv的是文本格式,不另存为excel文件,很多excel功能是用不了的。jacob/jawin需要服务器端是windows系统,且安装了excel2000以上版本。poi/jxl和html/csv方式的话,服务器端可以跨平台。
浏览器端生成excel文件还没有特别完善的方案,这是因为js无法处理二进制。大概有以下几个方案,各有利弊。
1. activex方式:使用js/vbs调用excel对象 (ie+excel)
2. ie命令方式:将html或是csv输出到open的window,然后使用execCommand的saveas命令,存为csv或xls。 (ie only)
3. 服务器端中转方式:将html的table或是拼接的csv传到服务器端,服务器端再按照Content-Type:application/vnd.ms-excel返回,浏览器就会按excel方式处理。与服务器端拼接相比,少了一次取数操作。 (all)
4. data协议方式:对于支持data协议的浏览器,可以将html或是csv先用js base64处理,然后前缀data:application/vnd.ms-excel;base64,,即可使浏览器将其中的数据当做excel来处理,浏览器将提示下载或打开excel文件,可惜的是ie不支持。extjs的官网有一个grid的plugin,实现导出xhtml格式的伪excel文件,就是这么做的。 (except IE)
浏览器端只有第一种方案导出的是真正的biff格式的excel文件,其他方式都是文本格式。activex方式只能在windows平台的ie浏览器使用,而且需要降低ie的安全性,所以应用比较有限。复杂的excel文件,还是在服务器端用poi/jxl生成excel比较好。如果浏览器固定位ie,浏览器端方式2是最好的方案。如果要降低服务器端cpu的计算压力,客户端方案3可行,而且跨平台(比poi/jxl方式少了取数和生成二进制文件)。如果是非ie浏览器,方案4也不失为一种好方法。
⑵ extjs 表头合并行
要看你使用的是哪个版本的ExtJs
1.如果是4.2版本的grid原生支持列header合并,合并只需在创建列模型时创建下级column就可以了。如
columns:[
{
dataIndex:'',
text:'name'
},{
dataIndex:'',
text:'ccc',
columns:[{
dataIndex:'',
text:'aaa
},{
dataIndex:'',
text:'bbb'
}]
}]
2.如果是3.x系列版本,使用扩展插件,请参照examplesux实例,导入提供的examplesuxColumnHeaderGroup.js和.css,在创建时以plugin的方式插入,请参考示例代码
⑶ ExtJS 4.2 Ext.grid.Panel 如何把plugins 的编辑模式取消
你可以给GRID加编辑前的监听事件beforeedit.
当beforeedit返回false是就是取消编辑了.
beforeedit: function(editor,e){
//可以在这个方法里面做判断
//返回true就是可以进行编辑,false就是拒绝进行编辑
var data = editor.record.data;
if(data.xxx = ''){
return false;
}
else{
return true;
}
}
⑷ ExtJS grid表头如何增加下拉项
extjs自己提供复选框列
//checkbox列
varfilecheckbox=newExt.grid.CheckboxSelectionModel();
//GridPanel
varfileGrid=newExt.grid.GridPanel({
store:fileStore,
columns:[
newExt.grid.RowNumberer(),//显示列数
filecheckbox,//显示复选框列
{//其他显示列}]
//省略其他属性
});
这样你就可以而得到一个复选框,可以进行单选、全选了
如果你想自己定义的话,也可以
//定义filters
varfilters=newExt.ux.grid.GridFilters({
//
encode:encode,//jsonencodethefilterquery
local:local,//defaultstofalse(remotefiltering)
filters:[{
type:'numeric',
dataIndex:'id'
},{
type:'string',
dataIndex:'company',
disabled:true
},{
type:'numeric',
dataIndex:'price'
},{
type:'date',
dataIndex:'date'
},{
type:'list',
dataIndex:'size',
options:['small','medium','large','extralarge'],
phpMode:true
},{
type:'boolean',
dataIndex:'visible'
}]
});
//
//
//thefiltertypes(
varcreateColModel=function(finish,start){
varcolumns=[{
dataIndex:'id',
header:'Id',
//=true
//tousestore'sfield'stypeproperty(iftypepropertynot
//'auto'which
//GridFilterswillassumetobe'StringFilter'
filterable:true
//,filter:{type:'numeric'}
},{
dataIndex:'company',
header:'Company',
id:'company',
filter:{
type:'string'
//
//,disabled:true
}
},{
dataIndex:'price',
header:'Price',
filter:{
//type:'numeric'//
}
},{
dataIndex:'size',
header:'Size',
filter:{
type:'list',
options:['small','medium','large','extralarge']
//,phpMode:true
}
},{
dataIndex:'date',
header:'Date',
renderer:Ext.util.Format.dateRenderer('m/d/Y'),
filter:{
//type:'date'//
}
},{
dataIndex:'visible',
header:'Visible',
filter:{
//type:'boolean'//
}
}];
returnnewExt.grid.ColumnModel({
columns:columns.slice(start||0,finish),
defaults:{
sortable:true
}
});
};
然后
vargrid=newExt.grid.GridPanel({
colModel:createColModel(4),
plugins:[filters],
//这两个属性是重点,加上去就可以了
});
效果看图片。
建议你去下载官方的源代码,然后看其中的例子。
里面有一个就是如何自定义这个的
⑸ Extjs的Ext.grid.GridPanel组件进行行编辑或单元格编辑之后如何将修改之后的数据及时的更新到数据库
Ext.grid.plugin.CellEditing
Ext.grid.plugin.RowEditing
你用的应该是以上两种
你可以用canceledit事件做提交后台,总是方式回很多
然后答grid.getStore().reload();刷新
⑹ extjs的gridpanel控件加入插件Ext.grid.RowExpander后,viewconfig中的getRowClass失效的问题
plugins:[Ext.grid.RowExpander]可以这样子写??为什么我看到的grid添加plugin都是类似这样的
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
⑺ Extjs 中的datefield 怎么设置只显示年月
{
xtype:"datefield",
name:"date",
fieldLabel:"日期",
editable:true,
emptyText:"--请选择--",
format:"Y-m",//这块就是年月
width:180
}
format参数就是定义年月日的参数,按照自己的需求定义就好,你的是年月所以只需要写
format:"Y-m"就可以了
⑻ ExtJs 如何禁用分页控件的刷新按钮
bbar : new Ext.PagingToolbar({//分页工具栏
store : storePoHeader,
//plugins : new Ext.ux.grid.PageSizePlugin(),
pageSize : 5,
displayInfo : true,
displayMsg : '第 {0} 条到 {1} 条,一共 {2} 条',
emptyMsg : "没有内记容录",
doReflash:function(){
return false;
}
}),