2013-07-17 9 views
6

असल में मुझे नियंत्रक (WebApi) से लौटाए गए मॉडलस्टेट त्रुटियों को दिखाने में परेशानी हो रही है। एमवीसी 4, jQuery और नॉकआउट का उपयोग करना। उम्मीद है कि आप देख सकते हैं कि मैं नीचे से क्या हासिल करने की कोशिश कर रहा हूं - अग्रिम धन्यवाद।jQuery Validator.ShowErrors एमवीसी ViewModel ModelState

देखें: -

<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> 

नॉकआउट viewmodel पोस्ट/प्रस्तुत कर रही: -

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); 
} 

नियंत्रक: -

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

    } 

ActionFilterAttribute (modelstate ध्यान दें वापस भेजा जा रहा है)

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

गाया मार्कअप: -

enter image description here

Firebug प्रतिक्रिया: -

enter image description here

अब, मुझे पता है सत्यापनकर्ता कोशिश करते हैं और नाम 'model.CostCode' के साथ एक तत्व मिलेगा न केवल 'कॉस्टकोड' जैसा कि यह मार्कअप में दिखाई देता है, लेकिन मैंने आईडी & नाम को 'model.CostCode' से मिलान करने का प्रयास किया है, लेकिन इससे कोई फर्क नहीं पड़ता है। मुझे लगता है कि मेरे निकालने के लिए एक समस्या है।

अगर मैं एक त्रुटि संदेश को हार्डकोड सत्यापनकर्ता काम करता है ठीक

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

enter image description here

वैसे, इस सर्वर साइड सत्यापन संदेश दिखाना का एक स्वीकार्य तरीका है या मैं के साथ कुछ गलत पेड़ भौंकने हूँ यह सब? कोई भी संकेतक/टिप्पणियां बहुत स्वागत है धन्यवाद।

+0

अब आप छवियां जोड़ सकते हैं। – nemesv

उत्तर

4

अनुमान में, जैसा कि आपने हमें console.log (त्रुटियों) से आउटपुट नहीं दिखाया है, आप त्रुटि आइटमों की एक सरणी बना रहे हैं, लेकिन कामकाजी उदाहरण में, आपके पास एक हैशटेबल है जिस पर कुंजी है क्षेत्र का नाम

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

बनाम

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

तो अपने त्रुटि संदेश एक सरणी, जबकि काम कर रहे उदाहरण नहीं है। तो तुम डेटा, पार्स करने के लिए नहीं बल्कि सिर्फ इस पर प्रति बनाने की बजाय अपने extractErrors विधि को बदलने की जरूरत:

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

कि एक छोटे से hacky है, लेकिन यह सही रास्ते पर आप मिलना चाहिए!

+0

धन्यवाद पॉल - यह अद्भुत है, एक आकर्षण की तरह काम करता है। – renz