v1.3 add _setQueueTarget

KF-kissyForm · Aug 15, 2012 · ed7f04c · ed7f04c
1 parent 80d6a43
commit ed7f04c
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 3 deletions.
diff --git a/gallery/form/1.3/demo/form/uploader/uploadImage.html b/gallery/form/1.3/demo/form/uploader/uploadImage.html
@@ -90,7 +90,7 @@ <h2>简单demo</h2>
                 ]
             </script>
 
-            <input class="g-u" id="J_UploaderBtn" name="Filedata" type="image-uploader" value="上传图片"
+            <input class="g-u" id="J_UploaderBtn" name="Filedata" type="image-uploader" value="上传图片" queueTarget="#J_UploaderQueue"
                    action="upload.php" postData='{"username":"minghe"}' urlsInputName="imageUrls"
                    required maxSize="500" max="4" allowExts="jpg,jpeg,png,gif,bmp"
                    restoreHook="#J_ImageUploaderRestore"
@@ -111,7 +111,7 @@ <h2>事件演示</h2>
         <div class="span6">
             <div class="grid">
                 <input class="g-u" id="J_UploaderBtn2" name="Filedata" type="image-uploader" value="上传图片"
-                       action="upload.php" urlsInputName="imageUrls" maxSize="500" max="4">
+                       action="upload.php" urlsInputName="imageUrls2" maxSize="500" max="4">
                 <input type="hidden" name="imageUrls2">
             </div>
             <ul id="J_UploaderQueue2" class="grid">
@@ -124,7 +124,23 @@ <h2>事件演示</h2>
             </div>
         </div>
     </div>
+    <h2>接口控制演示</h2>
 
+    <div class="row">
+        <div class="span6">
+            <div class="grid">
+                <input class="g-u" id="J_UploaderBtn3" name="Filedata" type="image-uploader" value="上传图片"
+                       action="upload.php" urlsInputName="imageUrls3" maxSize="500" max="4">
+                <input type="hidden" name="imageUrls3">
+            </div>
+            <ul id="J_UploaderQueue3" class="grid">
+
+            </ul>
+        </div>
+        <div class="span6">
+
+        </div>
+    </div>
 </div>
 <script>
     var S = KISSY,
@@ -155,7 +171,7 @@ <h2>事件演示</h2>
 
     //加载上传组件入口文件
     KISSY.use('gallery/form/1.3/uploader/imageUploader', function (S, ImageUploader) {
-        new ImageUploader('#J_UploaderBtn', '#J_UploaderQueue').render();
+        new ImageUploader('#J_UploaderBtn').render();
 
         //事件演示demo
         var imageUploader2 = new ImageUploader('#J_UploaderBtn2', '#J_UploaderQueue2');
@@ -203,6 +219,9 @@ <h2>事件演示</h2>
             alert('队列中的文件数为：'+queue.get('files').length);
         });
         imageUploader2.render();
+
+        var imageUploader3 = new ImageUploader('#J_UploaderBtn3', '#J_UploaderQueue3');
+        imageUploader3.render();
     })
 </script>
 

diff --git a/gallery/form/1.3/uploader/imageUploader.js b/gallery/form/1.3/uploader/imageUploader.js
@@ -82,6 +82,7 @@ KISSY.use('gallery/form/1.3/uploader/index', function (S, ImageUploader) {
             var  theme = self.get('theme');
             var uploader;
 
+            self._setQueueTarget();
             self._setConfig();
             self._replaceBtn();
 
@@ -111,6 +112,21 @@ KISSY.use('gallery/form/1.3/uploader/index', function (S, ImageUploader) {
             }
             return self;
         },
+        /**
+         * 设置队列目标元素
+         * @private
+         */
+        _setQueueTarget:function(){
+            var self = this;
+            var $queue = self.get('queueTarget');
+            var $btn = $(self.get('buttonTarget'));
+            if(!$queue || !$queue.length){
+                var queueTarget = $btn.attr('queueTarget');
+                if(queueTarget != EMPTY){
+                    self.set('queueTarget',$(queueTarget));
+                }
+            }
+        },
         /**
          * 监听uploader的各个事件
          * @param {Uploader} uploader