2013-03-11 2 views
1

메신저 .net 4.5, MVC 4 및 im을 사용하여 양식에 모델 바인더를 사용합니다. 나는 잘 작동하는 목록으로 오류를 표시합니다 HTML 유효성 검사 요약이 있습니다.MVC 모델 바인더 - 개별 폼 오류 얻기

하나의 ModelProperty가 ModelState를 기반으로 오류를 트리거 한 경우 오류가 발생하면 "오류"CSS 클래스를 지정하여 빨간색으로 설정합니다. 아래를 봐주세요.

<div class="controls"> 
@{ 
    // does this element have an error?? 
    if (Model.LastName == error) 
    { 
     @Html.ValidationMessageFor(x => x.LastName) 
     @Html.TextBoxFor(x => x.LastName, new { type = "text", id = "LastName", name = "LastName", value = Model.LastName, @class = "Error" }) 
    } 
    else 
    { 
     @Html.ValidationMessageFor(x => x.LastName) 
     @Html.TextBoxFor(x => x.LastName, new { type = "text", id = "LastName", name = "LastName", value = Model.LastName, }) 
    } 
} 
} 

검증 요약

@{ 
    if (ViewBag.Error != null && ViewBag.Error == true) 
    { 
     <div class="alert alert-error"> 
      <h3>Error</h3> 
      <p>@ViewBag.Message</p> 
      <p>@Html.ValidationSummary(false)</p>     
     </div> 
    } 
    else if (ViewBag.Error != null && ViewBag.Error == false) 
    { 
     <div class="alert alert-success"> 
      <h3 style="color:green;">Details Updated Successfully Received</h3> 
      <p style="color:green;">@ViewBag.Message</p> 
     </div> 
    } 
} 

모델은 모델에서

public class UpdateDetailsModel 
{ 
    public VIPSessionObject VIPSessionObject { get; set; } 

    [Required] 
    [DataType(DataType.Text, ErrorMessage = "Please Enter your First Name")] 
    public string FirstName { get; set; } 

    [Required] 
    [DataType(DataType.Text, ErrorMessage = "Please Enter your Last Name")] 
    public string LastName { get; set; } 

    [Required] 
    [DataType(DataType.PhoneNumber, ErrorMessage = "Please Enter your Phone Number")] 
    public string Telephone { get; set; } 

    [Required] 
    [DataType(DataType.EmailAddress, ErrorMessage = "Please Enter your Email Address")] 
    public string Email { get; set; } 

    [Required] 
    [DataType(DataType.Password, ErrorMessage = "Please Enter your Motorpoint VIP Password")] 
    public string Password { get; set; } 

    [Required] 
    [DataType(DataType.Password, ErrorMessage = "The Passwords must match")] 
    [Compare("Password")] 
    public string PasswordConfirm { get; set; } 

    [Required] 
    [DataType(DataType.Date, ErrorMessage = "Please Enter your Date of Birth")] 
    public DateTime DateOfBirth { get; set; } 

    [Required] 
    public int VehiclesInHousehold { get; set; } 

    [Required(ErrorMessage = "Please select the number of cars in your household")] 
    public int NoOfVehicles { get; set; } 
} 

답변

3
@Html.ValidationMessageFor(model => model.LastName, null, new { @class = "error" }) 

그런 다음 마지막 이름이 당신의 모델 데이터 주석이 지정하는 것을 충족하지 않는 경우 단순히 빨간색 텍스트와에는 .error의 CSS 클래스 스타일을, 그것이 당신의 모델 속성의 주석에 제공된 오류 메시지를 사용합니다.

0

당신은 삭제할 수 있습니다 :

[DataType(DataType.Text, ErrorMessage = "Please Enter your Last Name")] 

및 대체 당신과 함께 [이 필요합니다] :

[Required(ErrorMessage ="Required Field")] 

나는 거기에 [데이터 형식] 속성을 사용하여에 버그가 나는 기사를 찾기 위해 지금 주변에 인터넷 검색을하고 과거에 읽었습니다.

+0

데이터 유형이? – JGilmartin

+1

[필수] 속성을 사용하는 날짜 인 경우에도 강제로 필요합니다. 사용자가 입력하지 않으면 오류 메시지가 표시됩니다. [Required] 속성을 사용하여 모델의 모든 필드를 강제로 입력 할 수 있습니다. – Robert

0

컨트롤의 수동 JavaScript (또는 JQuery) 유효성 검사는 어떻게됩니까? simpliest 예 :

function CheckForm() 
{ 
    var elementValue = document.getElementById('elementId').Value; 

    if(elementValue == null || elementValue == '') 
    { 
     document.getElementById('elementId').className = "Error"; 
    } 
    else 
    { 
     document.getElementById('elementId').className = ""; 
    } 
} 

그런 다음 당신은 당신의 폼 태그에서 사용할 수는

<form method="POST" action="..."> 
... 
<input id="elementId" type="text" ... /> 
<input type="submit" onClick="CheckForm()" .../> 
</form> 

당신은 어떤 검증을 수행 할 수 있습니다. 디스플레이에 대한

또는

설정으로 ErrorMessage 속성, 필수, @Robert 같은 데이터 형식은 조언했다.

+0

이상적으로 MVC3/Model 바인더 솔루션을 찾고 있습니다. 개별적으로 오류를 가져올 수있는 방법이 있어야합니다. 내 질문에 표시된 것처럼 요약을 쉽게 얻을 수 있습니다. – JGilmartin

0

정확히 어떤 문제인지는 모르겠지만 새로운 MVC 4 프로젝트에는 유효성 확인 도우미 스타일이 있습니다.

/* Styles for validation helpers 
-----------------------------------------------------------*/ 
.field-validation-error { 
    color: #f00; 
} 

.field-validation-valid { 
    display: none; 
} 

.input-validation-error { 
    border: 1px solid #f00; 
    background-color: #fee; 
} 

.validation-summary-errors { 
    font-weight: bold; 
    color: #f00; 
} 

.validation-summary-valid { 
    display: none; 
} 

그리고 양식 필드의 유효성 검사가 아니라 당신이 가지고있는 실패 할 때 기본적으로이 당신에게 빨간색 텍스트를 얻을 것이다 : 여기에 그들이있다 옆에 양식 필드에 필요로하는

@Html.ValidationMessageFor(x => x.LastName) 

이 검증 될 . 보기 모델에 배치 한 모델 및 데이터 유효성 검사기가 잘 보입니다. 클래스는 예약 된 단어이기 때문에

@Html.TextBoxFor(x => x.LastName, null, new {@class = "Error"}) 

공지 사항 @ 기호가 :

모든 양식 도우미는 모든 HTML을 통과 당신이 당신의 페이지에 렌더링 할 속성 수를 통해 HtmlAttributes라는 선택적 매개 변수가 있습니다 기음#...