附件上传方案
使用swfupload.http://swfupload.googlecode.com<script type="text/javascript" src="http://localhost/extjs/ux/SwfUploadPanel.js"></script>
<script type="text/javascript" src="http://localhost/extjs/ux/swfupload.js"></script>
{id :'uploads',xtype :'uploadDisplayField',isFormField: true,fieldLabel : '附件'}按钮事件动作如下：var win = new Ext.Window( {title:'附件上传',height: 300,width : 420,plain : true,modal : true,shadow : true,border : false,layout:'fit',items : });win.show();
swfupload只是完成附件的上传功能。通常还要在表单中添加附件的列表展示，添加附件删除功能。
Ext.ux.UploadDisplayField = Ext.extend(Ext.Component, { autoEl: { tag: 'div' }, onRender: function() { this.autoEl = Ext.apply({}, this.initialConfig, this.autoEl); Ext.ux.UploadDisplayField.superclass.onRender.apply(this, arguments); this.el.on('load', this.onLoad, this); }, onLoad: function() { this.fireEvent('load', this); }, addFile: function(id,name) { var html = '<tpl for="."><span id="{ID}"><a href="#">{NAME}</a> <a href="#" class="file-delete" id="file-{ID}">删除</a> </tpl>';var tpl = new Ext.XTemplate(html);tpl.overwrite(this.el,[{ID:id,NAME:name}]);this.getEl().on('click', function(e, t) { e.stopEvent(); var id=t.id.substr(5); Ext.Ajax.request( {url : Ext.WEB_URL+'admin/info/attachmentDelete.do',params : {'id' : id},method : 'POST',success : function(response) {var r = Ext.decode(response.responseText);if (!r.success)Ext.Msg.alert('提示信息','数据删除失败，由以下原因所致：<br/>' + (r.msg ? r.msg: '未知原因'));else {var span = Ext.getDom(id);span.parentNode.removeChild(span);}},scope : this});}, null, {delegate: 'a.file-delete'}); }, loadFiles:function(data){ var html = '<tpl for="."><span id="{ID}"><a href="#">{NAME}</a> <a href="#" class="file-delete" id="file-{ID}">删除</a> </tpl>';var tpl = new Ext.XTemplate(html);tpl.overwrite(this.el,data);this.getEl().on('click', function(e, t) { e.stopEvent(); var id=t.id.substr(5); Ext.Ajax.request( {url : Ext.WEB_URL+'admin/info/attachmentDelete.do',params : {'id' : id},method : 'POST',success : function(response) {var r = Ext.decode(response.responseText);if (!r.success)Ext.Msg.alert('提示信息','数据删除失败，由以下原因所致：<br/>' + (r.msg ? r.msg: '未知原因'));else {var span = Ext.getDom(id);span.parentNode.removeChild(span);}},scope : this});}, null, {delegate: 'a.file-delete'}); }});Ext.reg('uploadDisplayField', Ext.ux.UploadDisplayField);
服务器端代码：
class UploadAttachment(webapp.RequestHandler): def get(self): self.post() def post(self): self.response.headers['Content-Type'] = 'text/x-json;charset=UTF-8' infoId = self.request.get('infoId') fileName = self.request.get('Filename') data=self.request.get('Filedata') attachment = models.Attachment() attachment.ext=fileName[ - 3:] attachment.name=fileName[: - 4][:10] attachment.content=data attachment.info=infoId attachment.put() self.response.out.write(simplejson.dumps({'success':True,'id':str(attachment.key()),'name':attachment.name}))
页:
[1]