extjs文件上傳_extjs 要在選擇按鈕後增加一個上傳按鈕

Ⅰ extjs 要在選擇按鈕後增加一個上傳按鈕，

單個按鈕的話，參考如下，如果你是想通過兩個按鈕來表達開關稍作擴展即可：

new Ext.Button ({
scale:'Large',
fieldLabel :'是否',
iconAlign : 'left',
id : 'ynButton',
tag : 'Y',
handler :function(button){
if(button.tag == 'N'){
button.tag = 'Y';
Ext.getDom(button.getId()).innerHTML ='Y圖片';
}else if(button.tag=='Y'){
button.tag= 'N';
Ext.getDom(button.getId()).innerHTML ='N圖片';
}
}
})

Ⅱ 前台用extjs的form 上傳文件請問後台用java如何處理

java代碼中對文件上傳的處理可以參考struct的文件上傳，但是在返回處理結果時必須設置
response.setContentType("text/HTML");
否則文件上傳後，會出現一個下載對話框；
var formPanel = new Ext.FormPanel({ }）中必須加入fileUpload:true；
否則不會實現文件上傳；而且ext對文件上傳時，不會將formPanel 中存在的參數進行提交~

Ⅲ extjs ajax 可以上傳文件嗎

文件上傳的Ajax，首先Ajax並不支持流的傳輸，只是在裡面套了個iframe。

//ajax上傳
Ext.get('btn').on('click',function(){
Ext.Ajax.request({
url:'Upload.php',
isUpload:true,
form:'upform',
success:function(){
Ext.Msg.alert('upfile','文件上傳成功！');
}
});
});

<formid="upform">
請選擇文件：<inputtype="file"name="imgFile"/>
<inputtype="button"id="btn"value="上傳"/>
</form>

<?php
if(!isset($_FILES['imgFile'])){
	echojson_encode(array("success"=>false,'msg'=>"NotgetImgfile"));
	return;
}
$upfile=$_FILES['imgFile'];
$name=$upfile["name"];//上傳文件的文件名
$type=$upfile["type"];//上傳文件的類型
$size=$upfile["size"];//上傳文件的大小
$tmp_name=$upfile["tmp_name"];//上傳文件的臨時存放路徑
$error_cod=$upfile["error"];
if($error_cod>0){
	echojson_encode(array("success"=>false,'msg'=>$error_cod));
}
$photo_tmp_file_name=//這里設置存放路徑
move_uploaded_file($tmp_name,$photo_tmp_file_name);//存儲文件
?>

Ⅳ ExtJs可以限制上傳文件的格式嗎

ExtJs能不能不知道（貌似不可以），但是可以用別的方式達到。給你提供個思路：比如你限制僅能上傳txt，pdf，xml，doc格式的文件，上傳時，先獲取上傳的文件名，截取文件的後綴名（這個很簡單，用split功能就可以了，以 .（點）作為分隔符），然後跟允許的上傳格式字元對比，如果不同，則不允許上傳，相同則允許（其實用正則表達式也是可以的）。比如：
var a="filename.pdf"（文件名自己去獲取）
var b=a.split(".")（截取之後是個數組["filename","pdf"]）
b[1]就是後綴名pdf
這樣再對比：if(
b[1]
.toLowerCase()==『pdf』)
alert("ok");

Ⅳ extjs怎樣做圖片上傳

1.代碼如下：
復制代碼
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 
6 <script type="text/javascript" src="/Ext/adapter/ext/ext-base.js"></script>
7 <script type="text/javascript" src="/Ext/ext-all.js"></script>
8 <script src="/Ext/src/locale/ext-lang-zh_CN.js" type="text/javascript"></script>
9 <link rel="stylesheet" type="text/css" href="/Ext/resources/css/ext-all.css" />
10 
11 <script type="text/javascript">
12 Ext.onReady(function () {
13 //初始化標簽中的Ext:Qtip屬性。
14 Ext.QuickTips.init();
15 Ext.form.Field.prototype.msgTarget = 'side';
16 //創建div組件
17 var imagebox = new Ext.BoxComponent({
18 autoEl: {
19 style: 'width:150px;height:150px;margin:0px auto;border:1px solid #ccc; text-align:center;padding-top:20px;margin-bottom:10px',
20 tag: 'div',
21 id: 'imageshow',
22 html: '暫無圖片'
23 }
24 });
25 //創建文本上傳域
26 var file = new Ext.form.TextField({
27 name: 'imgFile',
28 fieldLabel: '文件上傳',
29 inputType: 'file',
30 allowBlank: false,
31 blankText: '請瀏覽圖片'
32 });
33 //提交按鈕處理方法
34 var btnsubmitclick = function () {
35 if (form.getForm().isValid()) {
36 form.getForm().submit({
37 waitTitle: "請稍候",
38 waitMsg: '正在上傳...',
39 success: function (form, action) {
40 Ext.MessageBox.alert("提示", "上傳成功！");
41 document.getElementById('imageshow').innerHTML = '<img style="width:150px;height:150px" src="' + action.result.path + '"/>';
42 },
43 failure: function () {
44 Ext.MessageBox.alert("提示", "上傳失敗！");
45 }
46 });
47 }
48 }
49 //重置按鈕"點擊時"處理方法
50 var btnresetclick = function () {
51 form.getForm().reset();
52 }
53 //表單
54 var form = new Ext.form.FormPanel({
55 frame: true,
56 fileUpload: true,
57 url: '/App_Ashx/Demo/Upload.ashx',
58 title: '表單標題',
59 style: 'margin:10px',
60 items: [imagebox, file],
61 buttons: [{
62 text: '保存',
63 handler: btnsubmitclick
64 }, {
65 text: '重置',
66 handler: btnresetclick
67 }]
68 });
69 //窗體
70 var win = new Ext.Window({
71 title: '窗口',
72 width: 476,
73 height: 374,
74 resizable: true,
75 modal: true,
76 closable: true,
77 maximizable: true,
78 minimizable: true,
79 buttonAlign: 'center',
80 items: form
81 });
82 win.show();
83 });
84 </script>
85 </head>
86 <body>
87 
107 </body>
108 </html>
復制代碼
其中與service交互用上傳圖片的一般處理程序文件，源碼如下：
/App_Ashx/Demo/Upload.ashx
復制代碼
1 using System;
2 using System.Web;
3 using System.IO;
4 using System.Globalization;
5
6 namespace HZYT.ExtJs.WebSite.App_Ashx.Demo
7 {
8 public class Upload : IHttpHandler
9 {
10 public void ProcessRequest(HttpContext context)
11 {
12 //虛擬目錄，建議寫在配置文件中
13 String strPath = "/Upload/Image/";
14 //文件本地目錄
15 String dirPath = context.Server.MapPath(strPath);
16 //接收文件
17 HttpPostedFile imgFile = context.Request.Files["imgFile"];
18 //取出文件擴展名
19 String fileExt = Path.GetExtension(imgFile.FileName).ToLower();
20 //重新命名文件
21 String newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
22 //文件上傳路徑
23 String filePath = dirPath + newFileName;
24 //保存文件
25 imgFile.SaveAs(filePath);
26 //客戶端輸出
27 context.Response.Write("{success:true,path:'" + strPath + newFileName + "'}");
28 }
29
30 public bool IsReusable
31 {
32 get
33 {
34 return false;
35 }
36 }
37 }
38 }
復制代碼
2.效果如下：
無廢話extjs
3.說明：
(1)上傳域不光可以上傳圖片，還要以上傳其他文件。這里我們以圖片為例。
(2)在實際開發中，我們還要對圖片格式，大小等進行校驗，這個示例測重於上傳，沒有加入任何校驗。

Ⅵ extjs4中怎麼上傳多個文件上傳

用swfupload吧，這個可以實現，不知道jquery.uploadify可不可以集成到Extjs里，總之swfupload絕對可以，曾經實現過，不過lz應該要研究不少時間,單純的input type='file'就不用想了

Ⅶ Extjs 如何實現上傳及下載功能。

其實，EXTJS4.0中有自帶的上傳控制項，你引用一下就行了
關鍵在於，你上傳的文件是保存在資料庫中，還是保存在伺服器的硬盤上
保存在資料庫中要化成二進制流，但缺點是文件大的時候，資料庫很麻煩，並且寫進資料庫要轉換，讀出來也要轉化
如果保存在伺服器上，只在資料庫中保存路徑，然後就可以根據路徑來下載，
刪除的時候，也同樣根據路徑要刪除伺服器上的文件和資料庫中的文件信息

祝你好運，如何你不明白的話，我可以給你源碼看一下，之前我做的上傳，下載和刪除功能。

Ⅷ Extjs上傳文件 form.submit({})後，一直在上傳，進不了後台，

既然已經報錯了，可能根本就沒有和後台交互。你應該關注Argument 1 of Node.appendChild is not an object.這個是哪段代碼引起的

Ⅸ ExtJs中怎麼上傳文件

下面為大家介紹在ExtJs中上傳文件的幾種方法
第一種方法：傳統的上傳方式
在formpanal中增加一個fileUpload的屬性
例子代碼：
JScript 代碼復制
Ext.onReady(function(){
var form = new Ext.form.FormPanel({
renderTo:'file',
labelAlign: 'right',
title: '文件上傳',
labelWidth: 60,
frame:true,
url: 伺服器處理上傳功能的url地址,//fileUploadServlet
width: 300,
height:200,
fileUpload: true,
items: [{
xtype: 'textfield',
fieldLabel: '文件名',
name: 'file',
inputType: 'file'//文件類型
}],
buttons: [{
text: '上傳',
handler: function() {
form.getForm().submit({
success: function(form, response){
Ext.Msg.alert('信息', response.result.msg);
},
failure: function(){
Ext.Msg.alert('錯誤', '文件上傳失敗');
}
});
}
}]
});

});

第二種方法：藉助Ext.ux.UploadDialog.Dialog的組件，在編碼時需要導入兩個文件
需要引入 Ext.ux.UploadDialog 樣式文件和 Ext.ux.UploadDialog.packed腳本文件。
例子代碼
//在使用此方法進行文件上傳時，其後台往頁面的返回值類型是這樣的：
//{'success':true,'message':'上傳成功'}
//如果沒有success:true，無論上傳成功與否，顯示的都是上傳失敗，其實這個和form.submit()的提交方式是一個道理。
var dialog = new Ext.ux.UploadDialog.Dialog({
autoCreate: true,
closable: true,
collapsible: false,
draggable: true,
minWidth: 400,
minHeight: 200,
width: 400,
height: 350,
permitted_extensions:['JPG','jpg','jpeg','JPEG','GIF','gif','xls','XLS'],
proxyDrag: true,
resizable: true,
constraintoviewport: true,
title: '文件上傳',
url:用於處理上傳文件功能的Url,
reset_on_hide: false,
allow_close_on_upload: true ,
upload_autostart: false
});
//定義上傳文件的按鈕
var btnShow = new Ext.Button({
text:'上傳文件',
listeners:{
click:function(btnThis,eventobj){
dialog.show();
}
}
});

extjs文件上傳

與extjs文件上傳相關的內容