日期:2014-05-16 浏览次数:20450 次
相信使用Ext开发的时候,经常会碰到要多文件上传图片的功能,而这个时候开发一个上传的组件是相对比较麻烦,成本较高,这个时候如果我们有一个现成的组件的话,就会省去很多不必要的事情。之前在网上找到了一个非常好用的Ext的上传组件,在这特意分享给大家!
?
<head>
<title>Ext.ux.UploadDialog user extension.</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<style type='text/css'>
@import url('../ExtJS/resources/css/ext-all.css');
@import url('ExtJS.ux/UploadDialog/css/Ext.ux.UploadDialog.css');
@import url('upload-dialog.css');
</style>
<body style='overflow: hidden'>
<!-- ########################################################################################## -->
<script type='text/javascript' src='../ExtJS/adapter/ext/ext-base.js'></script>
<script type='text/javascript' src='../ExtJS/ext-all.js'></script>
<script type='text/javascript' src='ExtJS.ux/UploadDialog/Ext.ux.UploadDialog.js'></script>
<!--<script type='text/javascript' src='ExtJS.ux/UploadDialog/locale/ru.utf-8.js'></script>-->
<script>
Ext.onReady(function(){
var dialog = new Ext.ux.UploadDialog.Dialog({
autoCreate: true,
closable: true,
collapsible: false,
draggable: true,
minWidth: 400,
minHeight: 200,
width: 600,
height: 400,
permitted_extensions:['JPG','jpg','jpeg','JPEG','GIF','gif','png'],
proxyDrag: true,
resizable: true,
constraintoviewport: true,
title: '图片上传',
url: 'up.php',
reset_on_hide: false,
allow_close_on_upload: true
});
dialog.show();
});
</script>
<div id=show-button></div>
</body>
?
?上面这段代码是这个组件运行时的代码,对照改下路径,类型,就可以使用了!
?不过经过测试,不能使用ext的js,因为这个组件重写了ext的底层代码,不然就会报一些非常莫名奇妙的错误!
?
?
由于不能贴图,所以也不太好描述,如果感兴趣,可以下来看看,学习下!