2013-07-17 12 views
6

Zasadniczo mam problemy z wyświetlaniem błędów związanych z wystąpieniem błędu modelu zwróconych przez kontroler (WebApi). Korzystanie z MVC4, jQuery i nokaut. Mam nadzieję, że możesz zobaczyć, co próbuję osiągnąć od dołu - z góry dzięki.jQuery Validator.showErrors MVC ViewModel ModelState

Widok: -

<div class="editor-field"> 
     @Html.TextBoxFor(model => model.CostCode, 
       new 
       { 
        placeholder = "cost/budget code", 
        data_bind = "value: CostCode"       
       })    
    </div> 
    <div> 
     @Html.ValidationMessageFor(model => model.CostCode) 
    </div> 

nokaut ViewModel robi post/złożyć: -

if (validator.valid()) 
    { 
     console.log('is valid'); 
     $.ajax({ 
      url: '/api/Booking/CompleteBooking', 
      type: 'POST', 
      dataType: 'json', 
      data: ko.mapping.toJS(self), 
      error: function (jqXHR) { 
       extractErrors(jqXHR, validator);          
      }, 
      success: function (data) {     
       console.log(data); 
      } 
     }); 
    } 

function extractErrors(jqXhr, validator) 
{ 
    var data = $.parseJSON(jqXhr.responseText), 
    errors = { }; 

    $.each(data.ModelState, function (i, item) { 
     errors[i] = item; 
    }); 

    console.log(errors); 
    validator.showErrors(errors); 
} 

Kontroler: -

[ModelValidationFilter] 
    public HttpResponseMessage CompleteBooking(AdditionalBookingInfoViewModel model) 
    { 
     return new HttpResponseMessage(HttpStatusCode.OK); 

    } 

ActionFilterAttribute (nota ModelState jest odsyłany)

public class ModelValidationFilterAttribute : ActionFilterAttribute 
{ 
    public override void OnActionExecuting(HttpActionContext actionContext) 
    { 
     if (!actionContext.ModelState.IsValid) 
     { 
      actionContext.Response = 
       actionContext.Request.CreateErrorResponse(HttpStatusCode.BadRequest, actionContext.ModelState); 
     } 
    } 
} 

Przedstawiane znaczników: -

enter image description here

Firebug odpowiedź: -

enter image description here

Teraz wiem, że weryfikator będzie spróbować znaleźć element o nazwie 'model.CostCode' nie tylko "CostCode", ponieważ pojawia się w znacznikach, ale próbowałem ustawić nazwę Id & na "model.CostCode", aby dopasować, ale nie robi żadnej różnicy. Myślę, że jest problem z moją funkcją extractErrors.

Gdybym hardcode komunikat o błędzie walidator działa OK

validator.showErrors({ 
    "CostCode" : "Test test test!" 
}); 

enter image description here

Nawiasem mówiąc, jest to akceptowalny sposób pokazujący komunikaty sprawdzania poprawności po stronie serwera albo ja szczekanie na złe drzewo z to wszystko? Wszelkie wskazówki/komentarze są bardzo mile widziane. Dziękuję.

+0

Teraz możesz dodać zdjęcia. – nemesv

Odpowiedz

4

Na domysły, ponieważ nie pokazałeś nam wyjścia z pliku console.log (błędy), tworzysz tablicę elementów błędu, ale w przykładzie roboczym masz tylko tablice z hashtable nazwa pola.

{ 
    0: { 'model.CostCode': ['Please enter a valid cost code.'] } 
} 

vs

{ 
    "CostCode" : "Test test test!" 
} 

Więc komunikat o błędzie jest tablicą, natomiast przykładem pracy nie jest. Więc trzeba zmienić metodę extractErrors do analizowania danych, a nie tylko skopiowanie go:

for(var key in data.ModelState) 
{ 
    errors[key.replace('model.', '')] = data.ModelState[key][0];  
} 

To trochę hacky, ale powinno Ci na dobrej drodze!

+0

Dziękuję Paul - to niesamowite, działa jak urok. – renz

Powiązane problemy