2013-07-10 2 views
2

나는이 모델이 각 속성은 내가 서버 측의 유효성을 검사 및 유효성 검사 요약 오류 메시지를 표시하기 위해 사용하고 그들 위에 일부 데이터 주석을 가지고클라이언트 쪽 유효성 검사를 사용하여 유효성 검사 요약을 표시하는 방법?

namespace CameraWebApp.Models 
{ 
    public class Images 
    { 
     [Key] 
     [DatabaseGenerated(DatabaseGeneratedOption.Identity)] 
     public int ImageId { get; set; } 
     [Required(ErrorMessage="Please enter your first name")] 
     public string SubmitterFirstName { get; set; } 
     [Required(ErrorMessage = "Please enter your surname name")] 
     public string SubmitterLastName { get; set; } 
     [ExistingFileName] 
     public string NameOfImage { get; set; } 
     [StringLength(140, ErrorMessage="Please reduce the length of your description to below 140 characters")] 
     [DataType(DataType.MultilineText)] 
     public string DescriptionOfImage { get; set; } 
     public string ImagePath { get; set; } 
     [DatabaseGenerated(DatabaseGeneratedOption.Identity)] 
     public DateTime DateAdded { get; set; } 
    } 
} 

를 내보기가있는 이것은이다에 사용되는 아래 :

<script src="http://localhost:55928/Scripts/jquery-1.7.1.js" type="text/javascript"></script> 
<script src="http://localhost:55928/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> 
<script src="http://localhost:55928/Scripts/jquery.validate.js" type="text/javascript"></script> 
<script src="http://localhost:55928/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script> 
0 : 위의 코드와

@model CameraWebApp.Models.Images 
<video id="video"> 
</video> 
<div id="main"> 
<h1> 
    Instructions 
</h1> 
<ul> 
    <li>Above: Live video stream from your computer's camera.</li> 
    <li>Press "Camera button" (right in RED) until you are happy with the photo captured.</li> 
    <li>Copy and paste the "big text string" into the address bar of your browser.</li> 
    <li>What do you see?</li> 
    <li>What applications can you imagine for this UI?</li> 
</ul> 
</div> 
<div id="sidebar"> 
<div id="canvasHolder"> 
    <canvas id="hiddenCanvas"> 
    </canvas> 
</div> 
<div id="errorMessages"> 
@Html.ValidationSummary(false) 
</div> 
<img id="preview" width="160" height="120" src="http://www.clker.com/cliparts/A/Y/O/m/o/N/placeholder-hi.png" alt="default portrait image">  
<!--<a id="button">Camera button</a>--> 
@using (Html.BeginForm()) 
{ 
@Html.ValidationSummary(true) 
<label>base64 image:</label> 
<input id="imageToForm" type="text" name="imgEncoded"/> 
<label>First Name</label> 
@Html.EditorFor(model => model.SubmitterFirstName) 
<label>Last Name</label> 
@Html.EditorFor(model => model.SubmitterLastName) 
<label>Name of Image</label> 
@Html.EditorFor(model => model.NameOfImage) 
<label>Image Description</label> 
@Html.EditorFor(model => model.DescriptionOfImage) 
<input type=button id="button"value=" Camera button"/> 
<input type="submit" value="Click this when your happy with your photo"/> 
} 
</div> 
@Html.ActionLink("gfd!!", "DisplayLatest"); 

<script src="@Url.Content("~/Scripts/LiveVideoCapture.js")" type="text/javascript"></script> 

오류 메시지가 잘 표시, 내 문제는 내가 그 다음 클라이언트 측 유효성 검사를 추가하기 시작하려고 내 _Layout에 다음 코드를 추가입니다

실제로 소스를 볼 때 볼 수있는 것처럼 클라이언트 측에서 유효성을 검사하지만 오류 메시지가 표시되지 않는 것은 무엇입니까? 아무도 아십니까 A : 왜 더 이상 내 오류 메시지를 표시하지 않습니까? B : 클라이언트 쪽의 유효성을 검사 할 때 유효성 검사 요약에 내 오류 메시지를 표시하려면 어떻게해야합니까? 형태로 외부, 하나의 내부 -

답변

2

당신은 페이지에 두 검증 요약을위한 @Html.ValidationFor(model => model.YourProperty)을 사용해야합니다. 클라이언트 측 유효성 검사는 요약 컨테이너 양식 (의도적인지 감독인지 확실하지 않음)에만 기록합니다.

양식 내의 하나가 속성 수준 오류 (true 인수)를 제외하고 모델 전체의 오류 만 표시하도록 만들어졌습니다.

if (htmlHelper.ViewData.ModelState.IsValid) 
{ 
    // [snip] 

    // TODO: This isn't really about unobtrusive; can we fix up 
    // non-unobtrusive to get rid of this, too? 
    if (htmlHelper.ViewContext.UnobtrusiveJavaScriptEnabled 
     && excludePropertyErrors) 
    { 
     // No client-side updates 
     return null; 
    } 
} 

excludePropertyErrors 당신이 true로 설정 한 것입니다 다음 HTML (유래 폭에 맞게 수정 된 소스)를 생성 할 때

이제 ValidationSummary 도우미는이 작업을 수행합니다. HTML을 반환 할 때 ModelState에 오류가없고 속성 오류를 제외하라는 메시지를 표시하면 유효성 검사 요약 컨테이너 (return null)가 출력되지 않습니다. 클라이언트 측 유효성 검사는 속성 오류 만 처리하고 네가 그걸 원하지 않는다고 했어. 단, 두 가지 문제에

: 이미 유효성 검사 오류에가있었습니다 경우

  • 클라이언트 측 유효성 검사 양식 내부의 검증 요약 만 출력됩니다 형태
  • 외부 검증 요약을 사용하지 않습니다 서버.
관련 문제