做系统的时候难免会遇到需要批量上传这样的需求，之前一直没有做过，今天经理给了这个需求并简单讲了一下思路，花了点时间把它给做出来了，细想起来还是比较简单的。
思路：用JQuery来实现动态的添加或者删除多个上传控件（如<input type="file" name="fileUpload" runat="server" />），选择好上传的文件后，就可以一次性提交，避免了一个一个上传的麻烦。
下面是自己整的一个简单的demo
js部分的代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="multiUpload.aspx.cs" Inherits="multiUpload" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>批量上传</title>
<script src="JS/jquery-1.4.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
var count = 1;//上传组件个数
$(function() {
//添加上传组件
$("#btnAdd").click(function() {
if ($("#DivUploads").find(":button").length >= 7) {
alert('最多只能添加八个上传组件！');
return;
}
var strHtml = '<span><input type="file" name="fileUpload" runat="server" />';
strHtml += "<input type='button' onclick='delUploadBtn(" + count + ")' value='删除'/></span>";
$("#DivUploads").append(strHtml);
count++;
});
});
//删除上传组件
function delUploadBtn(index) {
$("#DivUploads").find(":button").each(function() {
var text = "" + $(this).attr("onclick");
if (text.indexOf("delUploadBtn(" + index + ")") != -1) {
$(this).parent().remove();
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:FileUpload ID="FileUpload1" runat="server" />
<input type="button" id="btnAdd" value="添加" />
<div id="DivUploads" style="border:1px solid;300px;height:auto;">
</div>
<asp:Button ID="btnUpload" runat="server" Text="上传" onclick="btnUpload_Click" />
</form>
</body>
</html>
asp.net的后台代码：
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class multiUpload : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
/// <summary>
/// 上传处理
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btnUpload_Click(object sender, EventArgs e)
{
string filepath = Request.Form["fileUpload"];
string savePath = Server.MapPath("UploadFiles")+"\\";//上传文件保存路径
HttpFileCollection uploadFiles = Request.Files;
for (int i = 0; i < uploadFiles.Count; i++)
{
if (uploadFiles[i].FileName != "")
{
uploadFiles[i].SaveAs(savePath + uploadFiles[i].FileName);
}
}
}
}
还是整个运行的效果图：
客户端代码
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="UploadFile._Default" %>
2
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 <html xmlns="http://www.w3.org/1999/xhtml" >
6 <head runat="server">
7 <title>Upload Multiple Files in ASP.NET Using jQuery</title>
8 <script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
9 <script src="Scripts/jquery.MultiFile.js" type="text/javascript"></script>
10 </head>
11 <body>
12 <form id="form1" runat="server">
13 <div>
14 <asp:TextBox ID="TextBox1" runat="server" Height="79px" TextMode="MultiLine"></asp:TextBox>
15 <asp:FileUpload ID="FileUpload1" runat="server" CssClass="multi" /><asp:Button ID="btnUpload" runat="server" Text="Upload" onclick="btnUpload_Click" />
16 </div>
17
18 </form>
19 </body>
20 </html>
服务器端代码
1 using System;
2 using System.Data;
3 using System.Configuration;
4 using System.Collections;
5 using System.Web;
6 using System.Web.Security;
7 using System.Web.UI;
8 using System.Web.UI.WebControls;
9 using System.Web.UI.WebControls.WebParts;
10 using System.Web.UI.HtmlControls;
11 using System.IO;
12
13 namespace UploadFile
14 {
15 /// <summary>
16 /// 多个文件上传
17 /// 涂聚文 QQ:463588883 www.dusystem.com
18 /// </summary>
19 public partial class _Default : System.Web.UI.Page
20 {
21
22 string fi;
23 protected void Page_Load(object sender, EventArgs e)
24 {
25
26 }
27 /// <summary>
28 ///
29 /// </summary>
30 /// <param name="sender"></param>
31 /// <param name="e"></param>
32 protected void btnUpload_Click(object sender, EventArgs e)
33 {
34 try
35 {
36 //多个文件
37
38 // Get the HttpFileCollection
39 HttpFileCollection hfc = Request.Files;
40 for (int i = 0; i < hfc.Count; i++)
41 {
42
43 HttpPostedFile hpf = hfc[i];
44 if (hpf.ContentLength > 0)
45 {
46 string name=System.IO.Path.GetFileName(hpf.FileName);
47 if (name.Contains("."))
48 {
49 System.Random srd = new Random();
50 int srdName = srd.Next(1000);
51 name = name.Substring(name.LastIndexOf("."), name.Length - name.LastIndexOf("."));
52 name = DateTime.Now.ToString("yyyyMMddhhmmss") + srdName.ToString() + name;
53 }
54 // FileUpload2.PostedFile.SaveAs(Server.MapPath("upimge/") + name);
55 if (hfc.Count == 1)
56 {
57 fi = name;
58 }
59 if (hfc.Count!= 1)
60 {
61 //file += name;
62 fi += name+";";
63 }
64 //创造年,月,日的文件夹
65 //string year = DateTime.Now.Year.ToString();
66 //string month = DateTime.Now.Month.ToString();
67 //string day = DateTime.Now.Day.ToString();
68 //if (Directory.Exists("upload" + "\\" + year) == false)
69 //{
70 // Directory.CreateDirectory("upload" + "\\" + year);
71 //}
72 //if (Directory.Exists("upload" + "\\" + year + "\\" + month) == false)
73 //{
74 // Directory.CreateDirectory("upload" + "\\" + year + "\\" + month);
75 //}
76 //if (Directory.Exists("upload" + "\\" + year + "\\" + month + "\\" + day) == false)
77 //{
78 // Directory.CreateDirectory("upload" + "\\" + year + "\\" + month + "\\" + day);
79 //}
80 //保存地址this.TextBox1.Text ="/" + year + "/" + month + "/" + day +"/"+name;
81 hpf.SaveAs(Server.MapPath("upload") + "\\" + name);
82 //hpf.SaveAs(Server.MapPath("upload") + "\\" + System.IO.Path.GetFileName(hpf.FileName));
83 // Response.Write("<b>File: </b>" + hpf.FileName + " <b>Size:</b> " +
84 //hpf.ContentLength + " <b>Type:</b> " + hpf.ContentType + " Uploaded Successfully <br/>");
85 }
86 this.TextBox1.Text = fi;
87 }
88
89 }
90 catch (Exception ex)
91 {
92
93 }
94 }
95 /// <summary>
96 ///
97 /// </summary>
98 /// <param name="jsContent"></param>
99 //protected void WriteJs(string jsContent)
100 //{
101
102 // ClientScript.RegisterStartupScript(this.GetType(), "writejs", "<script type='text/javascript'>" + jsContent + "</script>");
103 //}
104
105
106 }
107 }
jquery.MultiFile.js代码
1 /*
2 ### jQuery Multiple File Upload Plugin v1.45 - 2009-04-22 ###
3 * Home: http://www.fyneworks.com/jquery/multiple-file-upload/
4 * Code: http://code.google.com/p/jquery-multifile-plugin/
5 *
6 * Dual licensed under the MIT and GPL licenses:
7 * http://www.opensource.org/licenses/mit-license.php
8 * http://www.gnu.org/licenses/gpl.html
9 ###
10 */
11
12 /*# AVOID COLLISIONS #*/
13 ;if(window.jQuery) (function($){
14 /*# AVOID COLLISIONS #*/
15
16 // plugin initialization
17 $.fn.MultiFile = function(options){
18 if(this.length==0) return this; // quick fail
19
20 // Handle API methods
21 if(typeof arguments[0]=='string'){
22 // Perform API methods on individual elements
23 if(this.length>1){
24 var args = arguments;
25 return this.each(function(){
26 $.fn.MultiFile.apply($(this), args);
27 });
28 };
29 // Invoke API method handler
30 $.fn.MultiFile[arguments[0]].apply(this, $.makeArray(arguments).slice(1) || []);
31 // Quick exit...
32 return this;
33 };
34
35 // Initialize options for this call
36 var options = $.extend(
37 {}/* new object */,
38 $.fn.MultiFile.options/* default options */,
39 options || {} /* just-in-time options */
40 );
41
42 // Empty Element Fix!!!
43 // this code will automatically intercept native form submissions
44 // and disable empty file elements
45 $('form')
46 .not('MultiFile-intercepted')
47 .addClass('MultiFile-intercepted')
48 .submit($.fn.MultiFile.disableEmpty);
49
50 //### http://plugins.jquery.com/node/1363
51 // utility method to integrate this plugin with others...
52 if($.fn.MultiFile.options.autoIntercept){
53 $.fn.MultiFile.intercept( $.fn.MultiFile.options.autoIntercept /* array of methods to intercept */ );
54 $.fn.MultiFile.options.autoIntercept = null; /* only run this once */
55 };
56
57 // loop through each matched element
58 this
59 .not('.MultiFile-applied')
60 .addClass('MultiFile-applied')
61 .each(function(){
62 //#####################################################################
63 // MAIN PLUGIN FUNCTIONALITY - START
64 //#####################################################################
65
66 // BUG 1251 FIX: http://plugins.jquery.com/project/comments/add/1251
67 // variable group_count would repeat itself on multiple calls to the plugin.
68 // this would cause a conflict with multiple elements
69 // changes scope of variable to global so id will be unique over n calls
70 window.MultiFile = (window.MultiFile || 0) + 1;
71 var group_count = window.MultiFile;
72
73 // Copy parent attributes - Thanks to Jonas Wagner
74 // we will use this one to create new input elements
75 var MultiFile = {e:this, E:$(this), clone:$(this).clone()};
76
77 //===
78
79 //# USE CONFIGURATION
80 if(typeof options=='number') options = {max:options};
81 var o = $.extend({},
82 $.fn.MultiFile.options,
83 options || {},
84 ($.metadata? MultiFile.E.metadata(): ($.meta?MultiFile.E.data():null)) || {}, /* metadata options */
85 {} /* internals */
86 );
87 // limit number of files that can be selected?
88 if(!(o.max>0) /*IsNull(MultiFile.max)*/){
89 o.max = MultiFile.E.attr('maxlength');
90 if(!(o.max>0) /*IsNull(MultiFile.max)*/){
91 o.max = (String(MultiFile.e.className.match(/\b(max|limit)\-([0-9]+)\b/gi) || ['']).match(/[0-9]+/gi) || [''])[0];
92 if(!(o.max>0)) o.max = -1;
93 else o.max = String(o.max).match(/[0-9]+/gi)[0];
94 }
95 };
96 o.max = new Number(o.max);
97 // limit extensions?
98 o.accept = o.accept || MultiFile.E.attr('accept') || '';
99 if(!o.accept){
100 o.accept = (MultiFile.e.className.match(/\b(accept\-[\w\|]+)\b/gi)) || '';
101 o.accept = new String(o.accept).replace(/^(accept|ext)\-/i,'');
102 };
103
104 //===
105
106 // APPLY CONFIGURATION
107 $.extend(MultiFile, o || {});
108 MultiFile.STRING = $.extend({},$.fn.MultiFile.options.STRING,MultiFile.STRING);
109
110 //===
111
112 //#########################################
113 // PRIVATE PROPERTIES/METHODS
114 $.extend(MultiFile, {
115 n: 0, // How many elements are currently selected?
116 slaves: [], files: [],
117 instanceKey: MultiFile.e.id || 'MultiFile'+String(group_count), // Instance Key?
118 generateID: function(z){ return MultiFile.instanceKey + (z>0 ?'_F'+String(z):''); },
119 trigger: function(event, element){
120 var handler = MultiFile[event], value = $(element).attr('value');
121 if(handler){
122 var returnValue = handler(element, value, MultiFile);
123 if( returnValue!=null ) return returnValue;
124 }
125 return true;
126 }
127 });
128
129 //===
130
131 // Setup dynamic regular expression for extension validation
132 // - thanks to John-Paul Bader: http://smyck.de/2006/08/11/javascript-dynamic-regular-expresions/
133 if(String(MultiFile.accept).length>1){
134 MultiFile.accept = MultiFile.accept.replace(/\W+/g,'|').replace(/^\W|\W$/g,'');
135 MultiFile.rxAccept = new RegExp('\\.('+(MultiFile.accept?MultiFile.accept:'')+')$','gi');
136 };
137
138 //===
139
140 // Create wrapper to hold our file list
141 MultiFile.wrapID = MultiFile.instanceKey+'_wrap'; // Wrapper ID?
142 MultiFile.E.wrap('<div class="MultiFile-wrap" id="'+MultiFile.wrapID+'"></div>');
143 MultiFile.wrapper = $('#'+MultiFile.wrapID+'');
144
145 //===
146
147 // MultiFile MUST have a name - default: file1[], file2[], file3[]
148 MultiFile.e.name = MultiFile.e.name || 'file'+ group_count +'[]';
149
150 //===
151
152 if(!MultiFile.list){
153 // Create a wrapper for the list
154 // * OPERA BUG: NO_MODIFICATION_ALLOWED_ERR ('list' is a read-only property)
155 // this change allows us to keep the files in the order they were selected
156 MultiFile.wrapper.append( '<div class="MultiFile-list" id="'+MultiFile.wrapID+'_list"></div>' );
157 MultiFile.list = $('#'+MultiFile.wrapID+'_list');
158 };
159 MultiFile.list = $(MultiFile.list);
160
161 //===
162
163 // Bind a new element
164 MultiFile.addSlave = function( slave, slave_count ){
165 //if(window.console) console.log('MultiFile.addSlave',slave_count);
166
167 // Keep track of how many elements have been displayed
168 MultiFile.n++;
169 // Add reference to master element
170 slave.MultiFile = MultiFile;
171
172 // BUG FIX: http://plugins.jquery.com/node/1495
173 // Clear identifying properties from clones
174 if(slave_count>0) slave.id = slave.name = '';
175
176 // Define element's ID and name (upload components need this!)
177 //slave.id = slave.id || MultiFile.generateID(slave_count);
178 if(slave_count>0) slave.id = MultiFile.generateID(slave_count);
179 //FIX for: http://code.google.com/p/jquery-multifile-plugin/issues/detail?id=23
180
181 // 2008-Apr-29: New customizable naming convention (see url below)
182 // http://groups.google.com/group/jquery-dev/browse_frm/thread/765c73e41b34f924#
183 slave.name = String(MultiFile.namePattern
184 /*master name*/.replace(/\$name/gi,$(MultiFile.clone).attr('name'))
185 /*master id */.replace(/\$id/gi, $(MultiFile.clone).attr('id'))
186 /*group count*/.replace(/\$g/gi, group_count)//(group_count>0?group_count:''))
187 /*slave count*/.replace(/\$i/gi, slave_count)//(slave_count>0?slave_count:''))
188 );
189
190 // If we've reached maximum number, disable input slave
191 if( (MultiFile.max > 0) && ((MultiFile.n-1) > (MultiFile.max)) )//{ // MultiFile.n Starts at 1, so subtract 1 to find true count
192 slave.disabled = true;
193 //};
194
195 // Remember most recent slave
196 MultiFile.current = MultiFile.slaves[slave_count] = slave;
197
198 // We'll use jQuery from now on
199 slave = $(slave);
200
201 // Clear value
202 slave.val('').attr('value','')[0].value = '';
203
204 // Stop plugin initializing on slaves
205 slave.addClass('MultiFile-applied');
206
207 // Triggered when a file is selected
208 slave.change(function(){
209 //if(window.console) console.log('MultiFile.slave.change',slave_count);
210
211 // Lose focus to stop IE7 firing onchange again
212 $(this).blur();
213
214 //# Trigger Event! onFileSelect
215 if(!MultiFile.trigger('onFileSelect', this, MultiFile)) return false;
216 //# End Event!
217
218 //# Retrive value of selected file from element
219 var ERROR = '', v = String(this.value || ''/*.attr('value)*/);
220
221 // check extension
222 if(MultiFile.accept && v && !v.match(MultiFile.rxAccept))//{
223 ERROR = MultiFile.STRING.denied.replace('$ext', String(v.match(/\.\w{1,4}$/gi)));
224 //}
225 //};
226
227 // Disallow duplicates
228 for(var f in MultiFile.slaves)//{
229 if(MultiFile.slaves[f] && MultiFile.slaves[f]!=this)//{
230 //console.log(MultiFile.slaves[f],MultiFile.slaves[f].value);
231 if(MultiFile.slaves[f].value==v)//{
232 ERROR = MultiFile.STRING.duplicate.replace('$file', v.match(/[^\/\\]+$/gi));
233 //};
234 //};
235 //};
236
237 // Create a new file input element
238 var newEle = $(MultiFile.clone).clone();// Copy parent attributes - Thanks to Jonas Wagner
239 //# Let's remember which input we've generated so
240 // we can disable the empty ones before submission
241 // See: http://plugins.jquery.com/node/1495
242 newEle.addClass('MultiFile');
243
244 // Handle error
245 if(ERROR!=''){
246 // Handle error
247 MultiFile.error(ERROR);
248
249 // 2007-06-24: BUG FIX - Thanks to Adrian Wr骲el <adrian [dot] wrobel [at] gmail.com>
250 // Ditch the trouble maker and add a fresh new element
251 MultiFile.n--;
252 MultiFile.addSlave(newEle[0], slave_count);
253 slave.parent().prepend(newEle);
254 slave.remove();
255 return false;
256 };
257
258 // Hide this element (NB: display:none is evil!)
259 $(this).css({ position:'absolute', top: '-3000px' });
260
261 // Add new element to the form
262 slave.after(newEle);
263
264 // Update list
265 MultiFile.addToList( this, slave_count );
266
267 // Bind functionality
268 MultiFile.addSlave( newEle[0], slave_count+1 );
269
270 //# Trigger Event! afterFileSelect
271 if(!MultiFile.trigger('afterFileSelect', this, MultiFile)) return false;
272 //# End Event!
273
274 }); // slave.change()
275
276 // Save control to element
277 $(slave).data('MultiFile', MultiFile);
278
279 };// MultiFile.addSlave
280 // Bind a new element
281
282
283
284 // Add a new file to the list
285 MultiFile.addToList = function( slave, slave_count ){
286 //if(window.console) console.log('MultiFile.addToList',slave_count);
287
288 //# Trigger Event! onFileAppend
289 if(!MultiFile.trigger('onFileAppend', slave, MultiFile)) return false;
290 //# End Event!
291
292 // Create label elements
293 var
294 r = $('<div class="MultiFile-label"></div>'),
295 v = String(slave.value || ''/*.attr('value)*/),
296 a = $('<span class="MultiFile-title" title="'+MultiFile.STRING.selected.replace('$file', v)+'">'+MultiFile.STRING.file.replace('$file', v.match(/[^\/\\]+$/gi)[0])+'</span>'),
297 b = $('<a class="MultiFile-remove" href="#'+MultiFile.wrapID+'">'+MultiFile.STRING.remove+'</a>');
298
299 // Insert label
300 MultiFile.list.append(
301 r.append(b, ' ', a)
302 );
303
304 b
305 .click(function(){
306
307 //# Trigger Event! onFileRemove
308 if(!MultiFile.trigger('onFileRemove', slave, MultiFile)) return false;
309 //# End Event!
310
311 MultiFile.n--;
312 MultiFile.current.disabled = false;
313
314 // Remove element, remove label, point to current
315 MultiFile.slaves[slave_count] = null;
316 $(slave).remove();
317 $(this).parent().remove();
318
319 // Show most current element again (move into view) and clear selection
320 $(MultiFile.current).css({ position:'', top: '' });
321 $(MultiFile.current).reset().val('').attr('value', '')[0].value = '';
322
323 //# Trigger Event! afterFileRemove
324 if(!MultiFile.trigger('afterFileRemove', slave, MultiFile)) return false;
325 //# End Event!
326
327 return false;
328 });
329
330 //# Trigger Event! afterFileAppend
331 if(!MultiFile.trigger('afterFileAppend', slave, MultiFile)) return false;
332 //# End Event!
333
334 }; // MultiFile.addToList
335 // Add element to selected files list
336
337
338
339 // Bind functionality to the first element
340 if(!MultiFile.MultiFile) MultiFile.addSlave(MultiFile.e, 0);
341
342 // Increment control count
343 //MultiFile.I++; // using window.MultiFile
344 MultiFile.n++;
345
346 // Save control to element
347 MultiFile.E.data('MultiFile', MultiFile);
348
349
350 //#####################################################################
351 // MAIN PLUGIN FUNCTIONALITY - END
352 //#####################################################################
353 }); // each element
354 };
355
356 /*--------------------------------------------------------*/
357
358 /*
359 ### Core functionality and API ###
360 */
361 $.extend($.fn.MultiFile, {
362 /**
363 * This method removes all selected files
364 *
365 * Returns a jQuery collection of all affected elements.
366 *
367 * @name reset
368 * @type jQuery
369 * @cat Plugins/MultiFile
370 * @author Diego A. (http://www.fyneworks.com/)
371 *
372 * @example $.fn.MultiFile.reset();
373 */
374 reset: function(){
375 var settings = $(this).data('MultiFile');
376 //if(settings) settings.wrapper.find('a.MultiFile-remove').click();
377 if(settings) settings.list.find('a.MultiFile-remove').click();
378 return $(this);
379 },
380
381
382 /**
383 * This utility makes it easy to disable all 'empty' file elements in the document before submitting a form.
384 * It marks the affected elements so they can be easily re-enabled after the form submission or validation.
385 *
386 * Returns a jQuery collection of all affected elements.
387 *
388 * @name disableEmpty
389 * @type jQuery
390 * @cat Plugins/MultiFile
391 * @author Diego A. (http://www.fyneworks.com/)
392 *
393 * @example $.fn.MultiFile.disableEmpty();
394 * @param String class (optional) A string specifying a class to be applied to all affected elements - Default: 'mfD'.
395 */
396 disableEmpty: function(klass){ klass = String(klass || 'mfD');
397 var o = [];
398 $('input:file').each(function(){ if($(this).val()=='') o[o.length] = this; });
399 return $(o).each(function(){ this.disabled = true }).addClass(klass);
400 },
401
402
403 /**
404 * This method re-enables 'empty' file elements that were disabled (and marked) with the $.fn.MultiFile.disableEmpty method.
405 *
406 * Returns a jQuery collection of all affected elements.
407 *
408 * @name reEnableEmpty
409 * @type jQuery
410 * @cat Plugins/MultiFile
411 * @author Diego A. (http://www.fyneworks.com/)
412 *
413 * @example $.fn.MultiFile.reEnableEmpty();
414 * @param String klass (optional) A string specifying the class that was used to mark affected elements - Default: 'mfD'.
415 */
416 reEnableEmpty: function(klass){ klass = String(klass || 'mfD');
417 return $('input:file.'+klass).removeClass(klass).each(function(){ this.disabled = false });
418 },
419
420
421 /**
422 * This method will intercept other jQuery plugins and disable empty file input elements prior to form submission
423 *
424
425 * @name intercept
426 * @cat Plugins/MultiFile
427 * @author Diego A. (http://www.fyneworks.com/)
428 *
429 * @example $.fn.MultiFile.intercept();
430 * @param Array methods (optional) Array of method names to be intercepted
431 */
432 intercepted: {},
433 intercept: function(methods, context, args){
434 var method, value; args = args || [];
435 if(args.constructor.toString().indexOf("Array")<0) args = [ args ];
436 if(typeof(methods)=='function'){
437 $.fn.MultiFile.disableEmpty();
438 value = methods.apply(context || window, args);
439 //SEE-http://code.google.com/p/jquery-multifile-plugin/issues/detail?id=27
440 setTimeout(function(){ $.fn.MultiFile.reEnableEmpty() },1000);
441 return value;
442 };
443 if(methods.constructor.toString().indexOf("Array")<0) methods = [methods];
444 for(var i=0;i<methods.length;i++){
445 method = methods[i]+''; // make sure that we have a STRING
446 if(method) (function(method){ // make sure that method is ISOLATED for the interception
447 $.fn.MultiFile.intercepted[method] = $.fn[method] || function(){};
448 $.fn[method] = function(){
449 $.fn.MultiFile.disableEmpty();
450 value = $.fn.MultiFile.intercepted[method].apply(this, arguments);
451 //SEE-http://code.google.com/p/jquery-multifile-plugin/issues/detail?id=27
452 setTimeout(function(){ $.fn.MultiFile.reEnableEmpty() },1000);
453 return value;
454 }; // interception
455 })(method); // MAKE SURE THAT method IS ISOLATED for the interception
456 };// for each method
457 }
458 });
459
460 /*--------------------------------------------------------*/
461
462 /*
463 ### Default Settings ###
464 eg.: You can override default control like this:
465 $.fn.MultiFile.options.accept = 'gif|jpg';
466 */
467 $.fn.MultiFile.options = { //$.extend($.fn.MultiFile, { options: {
468 accept: '', // accepted file extensions
469 max: -1, // maximum number of selectable files
470
471 // name to use for newly created elements
472 namePattern: '$name', // same name by default (which creates an array)
473
474 // STRING: collection lets you show messages in different languages
475 STRING: {
476 remove:'x',
477 denied:'You cannot select a $ext file.\nTry again...',
478 file:'$file',
479 selected:'File selected: $file',
480 duplicate:'This file has already been selected:\n$file'
481 },
482
483 // name of methods that should be automcatically intercepted so the plugin can disable
484 // extra file elements that are empty before execution and automatically re-enable them afterwards
485 autoIntercept: [ 'submit', 'ajaxSubmit', 'ajaxForm', 'validate' /* array of methods to intercept */ ],
486
487 // error handling function
488 error: function(s){
489 /*
490 ERROR! blockUI is not currently working in IE
491 if($.blockUI){
492 $.blockUI({
493 message: s.replace(/\n/gi,'<br/>'),
494 css: {
495 border:'none', padding:'15px', size:'12.0pt',
496 backgroundColor:'#900', color:'#fff',
497 opacity:'.8','-webkit-border-radius': '10px','-moz-border-radius': '10px'
498 }
499 });
500 window.setTimeout($.unblockUI, 2000);
501 }
502 else//{// save a byte!
503 */
504 alert(s);
505 //}// save a byte!
506 }
507 }; //} });
508
509 /*--------------------------------------------------------*/
510
511 /*
512 ### Additional Methods ###
513 Required functionality outside the plugin's scope
514 */
515
516 // Native input reset method - because this alone doesn't always work: $(element).val('').attr('value', '')[0].value = '';
517 $.fn.reset = function(){ return this.each(function(){ try{ this.reset(); }catch(e){} }); };
518
519 /*--------------------------------------------------------*/
520
521 /*
522 ### Default implementation ###
523 The plugin will attach itself to file inputs
524 with the class 'multi' when the page loads
525 */
526 $(function(){
527 //$("input:file.multi").MultiFile();
528 $("input[type=file].multi").MultiFile();
529 });
530
531
532
533 /*# AVOID COLLISIONS #*/
534 })(jQuery);
535 /*# AVOID COLLISIONS #*/
536