extjs上傳大小
A. 我想用extjs實現上傳和下載
給你上傳代碼,下載在服務端實現
重點是 xtype: 'filefield',
*************************************************************************
*上傳框組件
*
************************************************************************
*/
Ext.define('Mocoolka.web.coreview.container.MKUploadForm', {
extend:'Ext.form.Panel',
frame: true,
autoScroll: true,
initComponent: function () {
var me = this;
me.title = getUIWithID("SystemUI.Buttons.Upload.Description");//'上傳',
me.items = [
{
xtype: 'filefield',
emptyText: getUIWithID("SystemUI.MKUploadForm.SelectFile.Description"),//'選擇一個文件',
name: 'filename',
buttonText: '...',
buttonConfig: {
iconCls: 'upload-icon'
}
},
];
me.buttons = [{
text: getUIWithID("SystemUI.Buttons.Upload.Description"),//'上傳',
handler: function () {
var form = this.up('form').getForm();
var action = this.up('form').mkaction;
var myaction = "import";
if (action.get("Name") == "ImportAttachment")
myaction = "ImportAttachment";
var url = mkruntimer.getDataManager().getUrlPath(myaction, action);
if (form.isValid()) {
form.submit({
url: url,
waitMsg: getUIWithID("SystemUI.Buttons.Uploading.Description"),//'上傳中...',
success: function (fp, o) {
var form1 = form.owner;
form1.mkcallout(form1.mkcalloutpara, action.result.children);
form1.up('window').close();
},
failure: function (form, action) {
mkerrorutil.processAjaxFailure(action.response);
}
});
}
}
}, {
text: getUIWithID("SystemUI.Buttons.Reset.Description"),//'重設',
handler: function () {
this.up('form').getForm().reset();
}
}, {
text: getUIWithID("SystemUI.Buttons.Cancel.Description"),//'取消',
handler: function () {
this.up('window').close();
}
},
{
text: getUIWithID("SystemUI.MKUploadForm.AddFile.Description"),//'增加一個文件',
handler: function () {
this.up('form').addFile();
}
}
]
me.callParent(arguments);
},
addFile: function () {
var me = this;
me.add({
xtype: 'filefield',
emptyText: getUIWithID("SystemUI.MKUploadForm.SelectFile.Description"),//'選擇一個文件',
fieldLabel: getUIWithID(""),// '文件',
name: 'filename',
buttonText: '',
buttonConfig: {
iconCls: 'upload-icon'
}
});
},
//standardSubmit:false,
bodyPadding: '10 10 0',
flex:1,
defaults: {
anchor: '100%',
msgTarget: 'side',
labelWidth: 50
},
region: 'center',
});
B. EXTJS4.0中上傳文件的問題
你只寫了界面沒有寫業務 官方有這樣的代碼
Ext.create('Ext.form.Panel', {
title: 'Upload a Photo',
width: 400,
bodyPadding: 10,
frame: true,
renderTo: Ext.getBody(),
items: [{
xtype: 'filefield',
name: 'photo',
fieldLabel: 'Photo',
labelWidth: 50,
msgTarget: 'side',
allowBlank: false,
anchor: '100%',
buttonText: 'Select Photo...'
}],
buttons: [{
text: 'Upload',
handler: function() {
var form = this.up('form').getForm();
if(form.isValid()){
form.submit({
url: 'photo-upload.php',
waitMsg: 'Uploading your photo...',
success: function(fp, o) {
Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.');
}
});
}
}
}]
});
C. 改變ExtJs默認的字體大小的幾種方法
1、 只需把ext-all.css樣式文件中的所有11px換成12px,這樣就為統一的12px的字體了。 但是如果再想增大,那麼這時候不光是把源文件的11px換成15px,而且需要把裡面和font有關的12px換成15px。 改完之後按鈕出現世擾毛邊,在樣式文件中加 .ext-ie .x-btn-text-icon .x-btn-center .x-btn-text { padding:3px 0px 0px 0px;}毛碧團邊就不見了!2、由於在不同瀏覽器中,或者不同版本的同款瀏覽器中顯示的Extjs字體大小不一樣。而且看起來比較小。不順眼。 在網上查之,獲得一條有用信息:Extjs 在很多情況下使用 11px 字體,11px 大小是一種邊緣字體,不同的瀏覽器對 11px 的渲染各不相同,IE 的渲染和12px 相似,而在 Firefox 中,則和 10px相似,導致字體在FF 中過小的問題。 為了能夠徹底的解決字體大小問題,直接打開ext-all.css,查找所有的11px並替換為12px。問題解決了3、 Extjs版本3.2.1,字體大小修改 上網找了好搜慧旦多資料,都說是加上 .x-btn-text{ font-size:15px;}這樣就好了,但是在IE9和FF下還是不好用。 後來到ext-all.css里慢慢試,才找到設置的地方。
D. ExtJS 文件上傳(使用SwfUploadPanel插件)
應該是flash文件的問題,swf文件要放對地方,還有,檢查一下瀏覽器的 flash 插件是否已經安裝。
E. 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);//存儲文件
?>
F. extjs 控制圖片大小問題 width不起作用
autoEl 的配置項里,使沒沖好枯鉛用 cls:cssClass 或者 style:"width:600px"判亮 試試
G. Extjs 如何實現上傳及下載功能。
其實,EXTJS4.0中有自帶的上傳控制項 ,你引用一下就行了
關鍵在於,你上傳的文件是保存在資料庫中,還是保存在伺服器的硬盤上
保存在資料庫中要化成二進制流,但缺點是文件大的時候,資料庫很麻煩,並且寫進資料庫要轉換,讀出來也要轉化
如果保存在伺服器上,只在資料庫中保存路徑,然後就可以根據路徑來下載,
刪除的時候,也同樣根據路徑要刪除伺服器上的文件和資料庫中的文件信息
祝你好運,如何你不明白的話,我可以給你源碼看一下,之前我做的上傳,下載和刪除功能。
H. 誰做過ExtJS上傳下載文件的功能,求教
//附件上傳表單
varwareFrom=Ext.create('Ext.form.Panel',{
items:[{
xtype:'filefield',
name:'upfile',
fieldLabel:'文件上傳',
blankText:'請選擇文件',
allowBlank:false
}]
});
//創建一個窗體
varwin=Ext.create('Ext.window.Window',{
title:'上傳課件',
width:'auto',
height:'auto',
layout:'fit',
items:wareFrom,
buttonAlign:'center',
buttons:[{
minWidth:80,
text:'取消',
handler:function(){ win.hide(); }
},{
minWidth:80,
text:'上傳',
handler:upLoad
}]
});
//顯示窗體
win.show();
//點擊上傳按鈕處理事件
functionupLoad(){
if(wareFrom.getForm().isValid()){
wareFrom.getForm().submit({
waitTitle:'請稍候',
waitMsg:'正在執行操作...',
url:'upload.php?upload=ok',
method:'POST',
success:function(form,action){
Ext.Msg.alert('提示',action.result.msg);
wareFrom.getForm().reset();
},
failure:function(form,action){
Ext.Msg.alert('提示',action.result.msg);
}
});
}
}
//後台不管你用的什麼,流程一致,此以php為例,因為比較好寫
<?php
if($_GET['upload']=='ok'){
//上傳路徑
$location='upload_file/';
//此處的name是上傳窗體,upload控制項的name
if(move_uploaded_file($_FILES['upfile']['tmp_name'],$location)){
echojson_encode(array('success'=>true,'msg'=>'上傳成功'));
}else{
echojson_encode(array('success'=>false,'msg'=>'上傳發生了錯誤'));
}
}
?>
//下載
<?php
//此處需前台傳一個id過來
$id=$_GET['id'];
$sql="SELECT*FROM`ware`WHERE`id`='$id'";
$result=mysql_query($sql);
$row=mysql_fetch_row($result);
//此處的row是文件保存在資料庫的路徑
if(file_exists($row[0])){
//用stream讀取該文件
$file=fopen($row[0],'r');
header('Content-Type:application/octet-stream');
header('Accept-Ranges:bytes');
header('Accept-Length:'.filesize($row[0]));
//此處的row1是文件名稱
header('Content-Disposition:attachment;filename='.$row[1]);
echofread($file,filesize($row[0]));
fclose($file);
}
?>
//有什麼地方不明白的話,歡迎繼續追問
I. 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");
J. 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();
}
}
});