2016-09-13 9 views
1

私のMVC Webアプリケーションでは、imageuploadコンポーネントを持つフォームがあります。 imageupload Image-dataは、データアノテーションの助けを借りて検証されます。 私のサーバー側の検証が動作しているが、私のクライアント側のjQuery関数が呼び出されていない...私はwhy- HELPを知らない:ファイルアップロード、クライアントスクリプトが呼び出されていませんか?データアノテーション

1.私のビューでファイルアップロード:

@Scripts.Render("~/bundles/jquery") 
@Scripts.Render("~/Scripts/jquery.validate.min.js") 
@Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js") 

<input type="file" id="FileUploader" name="FileUploader" multiple /> 
<div id="FileDisplay" name="FileDisplay"></div> 
@Html.ValidationMessageFor(model => model.FileUploader, "", new { @class = "text-danger" }) 

[ValidImageUpload] 
public IEnumerable<HttpPostedFileBase> FileUploader { get; set; } 

3.ValidImageUploadファイル:

私のモデルでは

2.、私はこれを持っています

public sealed class ValidImageUpload : ValidationAttribute, IClientValidatable { string[] stringArray = { "gif", "jpg", "png", "jpeg" }; protected override ValidationResult IsValid(object value, ValidationContext validationContext) { IEnumerable<System.Web.HttpPostedFileBase> uploadedFiles = (IEnumerable<System.Web.HttpPostedFileBase>)value; var firstfile = uploadedFiles.FirstOrDefault(); if (firstfile != null) { foreach (var file in uploadedFiles) { int pos = Array.IndexOf(stringArray, file.ContentType.Substring(6)); if (pos > -1) { if (file.ContentLength > 5242880) { return new ValidationResult(String.Format("Billedet: {0} er for stort. (Max. tilladt billede-størrelse xxxxx)", file.FileName)); } } else { return new ValidationResult(String.Format("Billedt: {0} har et forkert format. Tilladte formater er - GIF, JPG, PNG, JPEG", file.FileName)); } } } return ValidationResult.Success; } public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) { ModelClientValidationRule mvr = new ModelClientValidationRule(); mvr.ErrorMessage = "Forkert format"; mvr.ValidationType = "validImageUpload"; return new[] { mvr }; } } 

jQueryの

$(document).ready(function() { 
    jQuery.validator.addMethod('validImageUpload', function (value, element, params) { 
     var currentDate = new Date(); 
     alert('Working indsi´side'); 
      return false; 

    }, ''); 

    jQuery.validator.unobtrusive.adapters.add('validImageUpload', function (options) { 
     options.rules['validImageUpload'] = {}; 
     options.messages['validImageUpload'] = options.message; 
    }); 
}); 
+0

入力を手動で入力し、クライアント側の検証に必要なすべての 'data- *'属性を省略しました。 '@ H​​tml.TextBoxFor(m => m.FileUploader、new(type =" file "、multiple =" multiple "})を使用してください。 –

+0

ありがとうございます。この質問を閉じる方法。 –

答えて

0

あなたのhtmlに適切なdata-val-*属性を追加していないので、あなたが任意のクライアント側の検証を取得しない理由があります。常にあなたのケース

@Html.TextBoxFor(m => m.FileUploader, new { type="file", multiple="multiple"}) 

内部メソッドが検証属性からmetatdataを読み取り、HTMLに適切な属性を追加するには、あなたのHTMLを生成するために、強く型付けされたHtmlHelperメソッドを使用します。ページが最初にレンダリングされると、jquery.validate.unobtrusive.jsファイルはこれらの属性の値を読み取り、クライアント側の検証のために規則をjquery.valdate.jsに追加します。

しかし、実装には他にも複数の問題があります。 2つの別々のもの(ファイルサイズとファイルタイプ)を検証するため、2つの別個の属性が必要です。また、有効な値をコードにハードコードしているため、属性が柔軟性がありません(.pdfファイルを許可したい別のプロパティにすべてのコードを適用する必要があります)。 GetClientValidationRules()メソッドのパラメータを返さず、有効なファイルタイプ(またはファイルサイズ)を示します。そして、javacript関数はdocument.ready()の中にあってはいけません。

FileTypeAttributeの実装については、FileExtension Validation using custom validation creates duplicate and invalid data-* attributesを参照してください。 FileSizeAttributeの実装については、Client-side File Upload Size Validation in ASP.NET MVCを参照してください(この解決策は1つのファイル用であり、複数のファイルをアップロードする場合は変更する必要があります)。

私はあなたの研究The Complete Guide To Validation In ASP.NET MVC 3 - Part 2もお勧めします。

関連する問題