केंडो ग्रिड इनलाइन कस्टम सत्यापन संदेश संपादित करें उदा। डुप्लिकेट नाम आदि के लिए

Question

मेरे पास एक इकाई स्थान है और मैं इनलाइन संपादन मोड के साथ केंडू यूआई ग्रिड का उपयोग कर रहा हूं। इकाई का गुण डिस्प्लेनाम है, जो आवश्यक है और डेटाबेस में दो बार मौजूद नहीं होना चाहिए।

फिलहाल, यह आवश्यक मान्यकरण संदेश प्रदर्शित करने के लिए काम करता है:

और यह भी एक तरीका है CustomValidateModel LocationController अजाक्स इनलाइन में कहा जाता है का निर्माण करने कि चेक पद्धति बनाएं काम करता है यदि नाम डेटाबेस में पहले से मौजूद है और फिर मॉडल एरर जोड़ता है। मैं में इस त्रुटि को पकड़ता हूं। इवेंट्स (घटनाओं => घटनाओं। त्रुटि ("ऑनरर")) जावास्क्रिप्ट के माध्यम से और तब जावास्क्रिप्ट पॉपअप के माध्यम से संदेश दिखाएं।

ModelState.AddModelError("DisplayName", "Name already exists."); 

और इस मामले की जड़ है: मैं इस जावास्क्रिप्ट पॉपअप संदेश के लिए नहीं करना चाहती। मैं इस क्षेत्र के नीचे भी इस जानकारी को रखना चाहता हूं, जैसे कि "फ़ील्ड आवश्यक है!" संदेश। मैंने बहुत समय खोजा है, लेकिन अधिकांश लोग जावास्क्रिप्ट के माध्यम से केवल यह प्रमाणीकरण और आउटपुट सुझाते हैं क्योंकि यह इस समय काम करता है।

इसके अतिरिक्त, पॉपअप के अलावा वास्तविक समस्या यह है कि रिकॉर्ड, जिसे उपयोगकर्ता ग्रिड में बनाना चाहता है, तब जावास्क्रिप्ट पॉपअप की पुष्टि करने के बाद गायब हो रहा है। लेकिन प्रयोज्यता के लिए, मैं चाहता हूं कि नई लाइन और इनपुट बनी रहे। उपयोगकर्ताओं को दिए गए नाम को संपादित करने में सक्षम होना चाहिए, वह बचाना चाहता था। और फिर पूरी लाइन में प्रवेश नहीं करना चाहिए। केवल सत्यापन संदेश "नाम पहले से मौजूद है।" जानकारी के लिए संकेत देना चाहिए।

कोड:

स्थान इकाई:

public class LocationDto 
{ 
    public Guid? ID { get; set; } 
    [Required(AllowEmptyStrings = false, ErrorMessage = "Field required!")] 
    public string DisplayName { get; set; } 
    // other properties 
} 

LocationController कार्रवाई विधि:

[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult CreateInline([DataSourceRequest] DataSourceRequest request, LocationDto model) 
{ 
    CustomValidateModel(model); // checks if the DisplayName is already existing in the DB 
    if (model != null && ModelState.IsValid) 
    { 
     // Create and Save the Model into database 
    } 
    return Json(ModelState.ToDataSourceResult()); 
} 

जावास्क्रिप्ट समारोह:

function onError(e, status) { 
    if (e.errors) { 
     var message = "Error:\n"; 
     $.each(e.errors, function (key, value) { 
      if (value.errors) { 
       message += value.errors.join("\n"); 
      } 
     }); 
     this.cancelChanges(); 
     alert(message); 
    } 
} 

मुझे आशा है कि यह इस तरह से काम करने की संभावना है। यह अनुकूल दृश्यता और उपयोगिता में वृद्धि के अनुसार ठीक होगा।

Answer 1

एक और जवाब का संशोधित करने और चारों ओर की कोशिश कर के साथ, मैं एक काम कर समाधान का निर्माण LocationController.cs

[AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult CreateInLine([DataSourceRequest] DataSourceRequest request, LocationViewModel model) 
    { 
     CustomValidateModel(model); 
     if (model != null && ModelState.IsValid) 
     { 
      var location = _repository.CreateNewInstance<Location>(); 
      location.ID = Guid.NewGuid(); 
      location.DisplayName = model.DisplayName; 
      ... 
      _repository.SaveChanges(); 
      model = MapToViewModel(location); 
     } 
     return Json(new[] { model }.ToDataSourceResult(request, ModelState)); 
    } 

    private void CustomValidateModel(LocationViewModel model) 
    { 
     var existingEntity = _repository.GetAll<Location>() 
              .Where(o => o.ID != model.ID) 
              .Where(o => o.DisplayName.Equals(model.DisplayName)) 
              .FirstOrDefault(); 

     if (existingEntity != null) 
     { 
      if (existingEntity.Deleted == false) 
       ModelState.AddModelError("DisplayName", "Name already exists."); 
      else 
       ModelState.AddModelError("DisplayName", "Name '" + existingEntity.DisplayName + "' already exists in DB, but deleted."); 
     } 
    } 

परिणाम:

Answer 2

हमने इसे ग्रिड में पूरा किया जैसे आपने नियंत्रक पक्ष पर मॉडल स्थिति में अपनी कस्टम त्रुटि जोड़कर और इसे वापस देखने के लिए किया। और फिर ऑनर जावास्क्रिप्ट ईवेंट में हमने सत्यापन संदेश स्वयं बनाया और इसे ग्रिड में रखा।

जावास्क्रिप्ट onError:

function onError(e, status) { 
    if (e.errors) { 
     var message = "Error:\n"; 

     var grid = $('#gridID').data('kendoGrid'); 
     var gridElement = grid.editable.element; 

     $.each(e.errors, function (key, value) { 
      if (value.errors) { 
       gridElement.find("[data-valmsg-for=" + key + "],[data-val-msg-for=" + key + "]") 
       .replaceWith(validationMessageTmpl({ field: key, message: value.errors[0] })); 
       gridElement.find("input[name=" + key + "]").focus() 
      } 
     }); 
    } 
} 

फिर एक validationMessageTmpl बनाने (या जो भी आप इसे कॉल करना चाहते हैं): जहां तक ​​क्यों उपयोगकर्ता इनपुट गायब है के रूप में

var validationMessageTmpl = kendo.template($("#message").html()); 

<script type="text/kendo-template" id="message"> 
    <div class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error" style="margin: 0.5em; display: block; " data-for="#=field#" data-valmsg-for="#=field#" id="#=field#_validationMessage"> 
     <span class="k-icon k-warning"> 
     </span> 
      #=message# 
     <div class="k-callout k-callout-n"> 
     </div> 
    </div> 
</script> 

, मुझे लगता है कि:

this.cancelChanges(); 

के साथ कुछ करने के लिए हो सकता है। मेरा मानना ​​है कि यह वही करता है जो यह कहता है और सभी परिवर्तनों को रद्द करता है। जो आपके ग्रिड को रीसेट करेगा और सभी उपयोगकर्ता इनपुट को हटा देगा।

एक बात गौर करने योग्य ModelState (आपके $ .प्रत्येक में भी महत्वपूर्ण) में कोड दृश्य मॉडल संपत्ति के रूप में एक ही नाम के कॉलम आप पर त्रुटि प्रदर्शित करना चाहते हैं के लिए इस्तेमाल किया जा रहा होना चाहिए।

स्थान Edit.cshtml ग्रिड उस्तरा:

.DataSource(ds => ds 
    .Ajax() 
    .Events(e => e.Error("onError")) 
    .Model(m => 
     { 
      m.Id(e => e.ID); 
      ... 
     }) 
    .Create(create => create.Action("CreateInLine", "Location")) 
    .Read(...) 
    .Update(update => update.Action("UpdateInLine", "Location")) 
    .Destroy(...) 
) 

स्थान Edit.cshtml js:

<script type="text/javascript"> 
function onError(e, status) { 
    if (e.errors) { 
     var message = "Error:\n"; 

     var grid = $('#locationGrid').data('kendoGrid'); 
     var gridElement = grid.editable.element; 

     var validationMessageTemplate = kendo.template(
      "<div id='#=field#_validationMessage' " + 
       "class='k-widget k-tooltip k-tooltip-validation " + 
        "k-invalid-msg field-validation-error' " + 
       "style='margin: 0.5em;' data-for='#=field#' " + 
       "data-val-msg-for='#=field#' role='alert'>" + 
       "<span class='k-icon k-warning'></span>" + 
       "#=message#" + 
       "<div class='k-callout k-callout-n'></div>" + 
      "</div>"); 

     $.each(e.errors, function (key, value) { 
      if (value.errors) { 
       gridElement.find("[data-valmsg-for=" + key + "],[data-val-msg-for=" + key + "]") 
        .replaceWith(validationMessageTemplate({ field: key, message: value.errors[0] })); 
       gridElement.find("input[name=" + key + "]").focus(); 
      } 
     }); 
     grid.one("dataBinding", function (e) { 
      e.preventDefault(); // cancel grid rebind 
     }); 
    } 
} 
</script>