ExtJs多个附件框实现方法

var applyFormPanel = new Beidasoft.Bap.FormPanel({
 title : '申请信息',
 loadDataServiceUrl : applyPanel_ServiceUrl,
 submitServiceUrl : 'ReleasePlanApplyFormR/saveReleaseApply',
 //region :'north',
 height : 400,
 border : false,
 baseCls : 'x-panel',
 bodyStyle:'overflow-x:hidden;',
 autoScroll : true,
 fileUpload: true,
 labelWidth : 95,
 width : '100%',
 frame : true,
 items : [{
  xtype:'panel',
  layout:'column',
  labelWidth:95,
  border:false,
  items : [{
   columnWidth:.975,
   xtype:'panel',
   layout:'form',
   items : [fieldSet = new Ext.form.FieldSet({
    title: '文件',
    fieldLabel:'附件',
    id : 'file',
    autoHeight: true,
    defaultType: 'textfield',
    anchor:'98%',
    defaultType:'displayfield',
    autoScroll:true,
    labelWidth:10
   })]
  }, addFileButton = new Ext.Button({
   text:'添加',
   id : 'addFileButton',
   tabIndex: 23,
   iconCls:'page_add',
   handler : function() {
    var number = fileNumber.getValue();
    var fileName = 'file_'+number;
    fileNumber.setValue(parseInt(number)+1);
    var lText = '<a href="#" οnclick="deleteInput(\''+fileName+'\')">×</a>&nbsp;&nbsp;';
    fieldSet.add({
     xtype:'filefield',
     anchor:'95%',
     id:fileName,
     nameValue:fileName,
     leftText:lText,
     allowBlank : false,
     blankText : '附件不能为空'
    });
    fieldSet.doLayout();
   }
  })] 
 }, {
  xtype:'panel',
  layout:'form',
  defaultType:'textfield',
  items:[fileNumber = new Ext.form.Field({
   inputType:'hidden',
   id : 'fileNumber',
   name:'fileNumber',
   value:0
  }), fileDelete = new Ext.form.Field({
   inputType:'hidden',
   name:'fileDelete'
  })]
 }, {
  xtype:'hidden',
  fieldLabel : '发布的任务ID',
  id : 'taskID',
  name : 'taskID',
  anchor : '99%'
 }, {
  xtype: 'hidden',
  fieldLabel : '当前的申请的recordId',
  id : 'recordId',
  name : 'recordId',
  anchor : '90%'
 }]
});


applyFormPanel.on('loaddata', function(r) {
 fieldSet.removeAll();
 // 增加下载文件的链接
 var text = r.responseText.replace(/\n\r/g ,'');
    var data = eval('(' + text + ')');
    if(!data.files) return;
    for(var i = 0 ; i < data.files.length; i++){
     var item = data.files[i];
     var file = eval('(' + item.file + ')');  // 存放文件信息的对象
     // 下载地址
     var link = '/domain/downloadfileajax.cmd?fileid='+file.id;
     var ahref = "<a href='"+link+"'>"+file.text+"</a>";
     // 删除链接
     var ref = "<a href='#' οnclick='deleteFile(\""+file.id+"\")'>×</a>";
     ref += "&nbsp;&nbsp;&nbsp;&nbsp;"+ahref;
     fieldSet.add({id:file.id,value: ref});  //加入的对象中,id为其file.id
    }
   
    fieldSet.doLayout();
});

//删除附件方法
function deleteInput(id) {
 fieldSet.remove(id);
 var num = Ext.getCmp('fileNumber').getValue();
 Ext.getCmp('fileNumber').setValue(parseInt(num)-1);
}

function deleteFile(id) {
 var v = fileDelete.getValue();
 if (v != '') {
  v += ',';
 }
 v += id;
 fileDelete.setValue(v);  // 记录删除的文件id
 fieldSet.remove(id);  // 在fieldSet中删除该条记录
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值