Шаги по созданию поля для загрузки файлов с помощью Ext Js
Загрузка файла с помощью EXT JS
Ответ 1
Что касается конкретных шагов, используя функциональность, поддерживаемую в ExtJS 3x, лучше всего использовать этот модуль/плагин:
http://dev.sencha.com/deploy/dev/examples/form/file-upload.html
Ядро script поставляется с пакетом Ext JS в главном HTML файле (где вы связаны с основными сценариями Ext) в разделе главы после того, как вы добавили другие скрипты:
<script type="text/javascript" src="nameofyourextfolder/examples/ux/fileuploadfield/FileUploadField.js"></script>
К сожалению, в этом элементе Ext JS отсутствует огромное количество документации, но для базовых функций вы можете создать форму с полем загрузки async, используя ниже:
myuploadform= new Ext.FormPanel({
fileUpload: true,
width: 500,
autoHeight: true,
bodyStyle: 'padding: 10px 10px 10px 10px;',
labelWidth: 50,
defaults: {
anchor: '95%',
allowBlank: false,
msgTarget: 'side'
},
items:[
{
xtype: 'fileuploadfield',
id: 'filedata',
emptyText: 'Select a document to upload...',
fieldLabel: 'File',
buttonText: 'Browse'
}],
buttons: [{
text: 'Upload',
handler: function(){
if(myuploadform.getForm().isValid()){
form_action=1;
myuploadform.getForm().submit({
url: 'handleupload.php',
waitMsg: 'Uploading file...',
success: function(form,action){
msg('Success', 'Processed file on the server');
}
});
}
}
}]
})
Что этот код будет делать, так это создать новую формульную панель с полем загрузки и кнопкой загрузки. Когда вы нажмете кнопку загрузки - выбранный файл будет отправлен на серверный script handleupload.php(или как вы его называете). Именно тогда этот script обрабатывает то, что вы хотите сделать с файлом. Примером этого может быть:
$fileName = $_FILES['filedata']['name'];
$tmpName = $_FILES['filedata']['tmp_name'];
$fileSize = $_FILES['filedata']['size'];
$fileType = $_FILES['filedata']['type'];
$fp = fopen($tmpName, 'r');
$content = fread($fp, filesize($tmpName));
$content = addslashes($content);
fclose($fp);
if(!get_magic_quotes_gpc()){
$fileName = addslashes($fileName);
}
$query = "INSERT INTO yourdatabasetable (`name`, `size`, `type`, `file`) VALUES ('".$fileName."','".$fileSize."', '".$fileType."', '".$content."')";
mysql_query($query);
Что бы вставить файл в SQL DB. Следует помнить, что файл на стороне сервера обрабатывает загрузку так же, как обычная форма HTML...
Надеюсь, это поможет!
Ответ 2
Если вы посмотрите на примеры, доступные на сайте www.ExtJS.com, вы найдете этот.
Хотя он основан на стандартной загрузке файла HTML - так же, как этот ответ.
Ответ 3
установка идентификатора приведет только к тому, что имя массива $_FILES будет таким же, как и идентификатор. Если вам нужно использовать что-то еще, то установите параметр конфигурации имени, и он будет использовать его вместо этого.
Ответ 4
items: {
xtype: 'form',
border: false,
bodyStyle: {
padding: '10px'
},
items: {
xtype: 'multifilefield',
labelWidth: 80,
fieldLabel: 'Choose file(s)',
anchor: '100%',
allowBlank: false,
margin: 0
}
},
Демо-версия для ExtJS 4.2.2 здесь