使用asp.net mvc3剃刀上传单个文件并使用jquery进行验证的最佳方式是什么?
我只需要用户上传jpg,png小于5mb。
谢谢
发布于 2012-05-11 04:05:24
您需要使用javascript进行验证,下面是一个示例
function onSelect(e) {
if (e.files[0].size > 256000) {
alert('The file size is too large for upload');
e.preventDefault();
return false;
}
// Array with information about the uploaded files
var files = e.files;
var ext = $('#logo').val().split('.').pop().toLowerCase();
if ($.inArray(ext, ['gif', 'jpeg', 'jpg', 'png', 'tif', 'pdf']) == -1) {
alert('This type of file is restricted from being uploaded due to security reasons');
e.preventDefault();
return false;
}
return true;
}这说明文件大小不能超过256K,并且只允许gif、jpg、jpeg、tif、png和pdf。只需将256000更改为5000000和您的特定文件类型
我在MVC3中的一个带有Telerik上传控件的剃刀视图中使用了它。您也可以使用标准的上载输入,只需在选择时或提交前触发此事件
发布于 2012-05-11 05:44:57
除了jQuery验证(非常好的Acid的回答),你还应该做服务器验证。下面是一些简单的例子:
视图:
@if (TempData["imageUploadFailure"] != null)
{
@* Here some jQuery popup for example *@
}
@using (Html.BeginForm("ImageUpload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<legend>Add Image</legend>
<label>Image</label>
<input name="image" type="file" value=""/>
<br/>
<input type="submit" value="Send"/>
}控制器:
public ActionResult ImageUpload()
{
return View();
}
[HttpPost]
public ActionResult ImageUpload(HttpPostedFileBase image)
{
var result = ImageUtility.SaveImage("/Content/Images/", 1000000, "jpg,png", image, HttpContext.Server);
if (!result.Success)
{
var builder = new StringBuilder();
result.Errors.ForEach(e => builder.AppendLine(e));
TempData.Add("imageUploadFailure", builder.ToString());
}
return RedirectToAction("ImageUpload");
}ImageUtility帮助器类:
public static class ImageUtility
{
public static SaveImageResult SaveImage(string path, int maxSize, string allowedExtensions, HttpPostedFileBase image, HttpServerUtilityBase server)
{
var result = new SaveImageResult { Success = false };
if (image == null || image.ContentLength == 0)
{
result.Errors.Add("There was problem with sending image.");
return result;
}
// Check image size
if (image.ContentLength > maxSize)
result.Errors.Add("Image is too big.");
// Check image extension
var extension = Path.GetExtension(image.FileName).Substring(1).ToLower();
if (!allowedExtensions.Contains(extension))
result.Errors.Add(string.Format("'{0}' format is not allowed.", extension));
// If there are no errors save image
if (!result.Errors.Any())
{
// Generate unique name for safety reasons
var newName = Guid.NewGuid().ToString("N") + "." + extension;
var serverPath = server.MapPath("~" + path + newName);
image.SaveAs(serverPath);
result.Success = true;
}
return result;
}
}
public class SaveImageResult
{
public bool Success { get; set; }
public List<string> Errors { get; set; }
public SaveImageResult()
{
Errors = new List<string>();
}
}您也可以修补响应格式,不同的文件重命名或添加多个文件处理等功能。
发布于 2012-09-10 17:02:14
这只是为了指定要接受的文件类型: MSvisualstudio2010。
在您的视图(.cshtml)中:
ATTACHMENT:<input type="file" name="file" id="file" accept=".PNG,.TXT,.JPG,.BMP" />只需指定所需的格式即可。
https://stackoverflow.com/questions/10540901
复制相似问题