在雅虎的一篇文章中，在附加文件时，有一个“附加更多文件”按钮，当你按下它时，它变成一个插入文件的字段。这是代码：
<a href = "javascript: addUploadFields ();" id = "attach_more"> Attach more files </ a>
我如何实现它 MVC？
问问题
4313 次
5 回答
0
创建允许您上传文件的控制器和操作
找一个实现上传多个文件的客户端插件。我发现一个很好用的是Kendo UI的 Upload 插件
如果您使用 Kendo UI，这应该可以帮助您入门：
控制器：
[HttpPost]
public ActionResult Save(HttpPostedFileBase[] files) {
// The Name of the Upload component is "attachments"
foreach (var file in files) {
//Do Something
}
// Return an empty string to signify success
return Content("");
}
看法
<form action="/Controller/Action" method="post" enctype="multipart/form-data">
<input type="file" name="files[]" id="file" />
...
</form>
于 2013-01-28T15:13:46.223 回答
0
您可以使用许多文件上传器，例如
您可以使用此代码上传此代码是客户端：
<form enctype="multipart/form-data">
<input name="file" type="file" />
<input type="button" value="Upload" />
</form>
<progress></progress>
首先，您可以根据需要进行一些验证。例如在文件的 onChange 事件中。
$(':file').change(function(){
var file = this.files[0];
name = file.name;
size = file.size;
type = file.type;
//your validation
});
$(':button').click(function(){
var formData = new FormData($('form')[0]);
$.ajax({
url: 'url', //server script to process data
type: 'POST',
xhr: function() { // custom xhr
myXhr = $.ajaxSettings.xhr();
if(myXhr.upload){ // check if upload property exists
myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // for handling the progress of the upload
}
return myXhr;
},
//Ajax events
beforeSend: beforeSendHandler,
success: completeHandler,
error: errorHandler,
// Form data
data: formData,
//Options to tell JQuery not to process data or worry about content-type
cache: false,
contentType: false,
processData: false
});
});
function progressHandlingFunction(e){
if(e.lengthComputable){
$('progress').attr({value:e.loaded,max:e.total});
}
}
这是你的控制器
[HttpPost]
public ActionResult Save(HttpPostedFileBase[] files) {
// The Name of the Upload component is "attachments"
foreach (var file in files) {
//Do Something
}
// Return an empty string to signify success
return Content("");
}
所以如果你不想使用 ajax 使用这个
@{
ViewBag.Title = "Upload";
}
<h2>
Upload</h2>
@using (Html.BeginForm(actionName: "Upload", controllerName: "User",
method: FormMethod.Post,
htmlAttributes: new { enctype = "multipart/form-data" }))
{
<text>Upload a photo:</text> <input type="file" name="files" multiple />
<input type="submit" value="Upload" />
}
于 2013-01-29T06:28:05.743 回答
0
这与https://stackoverflow.com/questions/14575787/ 之类的问题几乎相同。插件支持多文件上传。如果需要更多详细信息，请告诉我。
于 2013-01-29T06:16:58.063 回答
0
在尝试了许多不成功的解决方案后，我得到了它
http://lbrtdotnet.wordpress.com/2011/09/02/asp-net-mvc-multiple-file-uploads-using-uploadify-and-jqueryui-progressbar/
I kept the Url Values in a session
public JsonResult Upload(HttpPostedFileBase file)
{
if (Session["myAL"] == null)
{
al = new ArrayList();
}
else
al = (ArrayList)Session["myAL"];
var uploadFile = file;
if (uploadFile != null && uploadFile.ContentLength > 0)
{
string filePath = Path.Combine(HttpContext.Server.MapPath("~/Content/Uploads"),
Path.GetFileName(uploadFile.FileName));
al.Add(filePath);
Session["myAL"] = al;
uploadFile.SaveAs(filePath);
}
var percentage = default(float);
if (_totalCount > 0)
{
_uploadCount += 1;
percentage = (_uploadCount / _totalCount) * 100;
}
return Json(new
{
Percentage = percentage
});
}
然后在我的 Post Create Action 中检索它们
public ActionResult MultimediaCreate(MultimediaModel newMultimedia)
{
if (ModelState.IsValid)
{
db.submitMultimedia(newMultimedia);
al = (ArrayList)Session["myAL"];
foreach(string am in al)
{
MarjaaEntities me = new MarjaaEntities();
MultimediaFile file = new MultimediaFile();
file.MultmediaId = newMultimedia.id;
file.MultimediaFileUrl = am;
me.MultimediaFiles.AddObject(file);
me.SaveChanges();
Session.Remove("myAL");
}
return RedirectToAction("MultimediaIndex");
}
return View();
}
于 2013-02-04T17:29:34.747 回答
0
为了使用文件上传控件上传多个文件，我使用简单易看的 JQuery Multifile 插件。请参阅此链接JQuery Multiple File Upload
只包括这个库和 JQuery，它的语法就像
<input type="file" class="multi"/>
于 2013-01-28T14:06:29.727 回答