当前位置:编程学习 > JAVA >>

ext上传文件中,怎么让用户在输入框中输入地址?

最近在做ext+struts2文件上传的功能,功能已经实现了,文件上传的方式是通过点击“浏览”按钮,然后选取文件路径进行上传的。现在增加了一个需求,让用户可以自己在输入框中输入文件路径,该怎么实现呢?
ext代码为:
Ext.onReady(function(){
//上传文件1
var field1 =  new Ext.form.TextField({
name: "upload",
fieldLabel: "上传文件1",
inputType:"file",
width: 180
});

//上传文件2
var field2 =  new Ext.form.TextField({
name: "upload",
fieldLabel: "上传文件2",
inputType:"file",
width: 180
});

//登录按钮
var submit = new Ext.Button({
text: "开始上传",
type:"submit",
handler: function(){
if(f.getForm().isValid()){
  //提交信息     
f.getForm().submit({ 
    url: "parstExcel.do", //提交的地址
                    method: "post",  //提交的方式
                    //waitMsg: "请稍等,正在认证...",
success: function(f,action){
//服务器返回信息
 Ext.Msg.alert('上传成功',"温馨提示:"+action.result.msg,function(){
 //延迟加载
  Ext.MessageBox.show({
            title:"请稍等",
            msg:"正在加载首页.....",
            progressText:"",
            width:300,
            progress:true,
            closable:false,
            animEl:"loding"
           });
           var f = function(v) {
             return function(){
              if(v == 12){
               Ext.MessageBox.hide();
//window.location.href="index.jsp";  //加载页面
              }else{
               var i = v / 11;
               Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% 已完成');
              }
              }
            }
           for(var i = 1; i < 13; i++) {
             setTimeout(f(i), i * 150);//延迟时间
            }
          });//alert  
},//success
failure : function(f, action) {
  Ext.Msg.alert('上传失败',"温馨提示:失败 "+action.result.msg,function(){
 //延迟加载
  Ext.MessageBox.show({
            title:"请重新上传",
            msg:"正在上传.....",
            progressText:"",
            width:300,
            progress:true,
            closable:false,
            animEl:"loding"
           });
           var f = function(v) {
             return function(){
              if(v == 12){
               Ext.MessageBox.hide();
//window.location.href="uploadFile.jsp";  //加载页面
              }else{
               var i = v / 11;
               Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% 已完成');
              }
              }
            }
           for(var i = 1; i < 13; i++) {
             setTimeout(f(i), i * 50);//延迟时间
            }
          });//alert 
}//failure
});//submit
  }//isValid
  }//function end
});// 按钮结束

//重置按钮
var reset = new Ext.Button({
text: "重置",
handler:function(){
f.getForm().reset();
}
});

//表单
Ext.QuickTips.init(); //启动悬停提示
Ext.form.Field.prototype.msgTarget = 'title'; //qtip.title.under
 
var f = new Ext.form.FormPanel({ //form表单
title:"文件上传",  //标题
fileUpload : true,  //文件上传必须的
enctype:'multipart/form-data',  //文件上传必须的
width: 330,   // 宽
height:200,   //高
frame: true, //得到更加漂亮的效果
labelAlign: "right",//统一的操作对齐方式
bodyStyle: "padding:6px", //正文区域的样式
id: "form",
items:[field1,field2],
buttons:[submit,reset]
});
 

   var win = new Ext.Window({  
                id : 'win',  
                layout : 'fit', //自适应布局      
                align : 'center',  
                resizable : false,  
                draggable : true,  
                border : false,  
                plain: true,
               // bodyStyle : 'padding:5px;',  
                maximizable : false,//禁止最大化   
                closeAction : 'close',  
                closable : false,//禁止关闭,   
               items : f  //将表单作为窗体元素嵌套布局   
              
            });  
           win.show();//显示窗体   
            
});
 
</script> ExtJS struts2  上传
补充:Java ,  Web 开发
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,