कैसे ASP.NET MVC में रोकने के लिए jQuery ajax प्रस्तुत सत्यापन विफल हो जाता है, तो

Question

मैं ASP.NET 5 MVC RC1

jQuery सत्यापन प्लगइन्स मेरी ASP.NET MVC का उपयोग करता है मानक jquery.validate.js कि एक डिफ़ॉल्ट ASP.NET का उपयोग कर रहा है 5 टेम्पलेट परियोजना का उपयोग करता है।

/*! 
* jQuery Validation Plugin v1.14.0 
* 
* http://jqueryvalidation.org/ 
* 
* Copyright (c) 2015 Jörn Zaefferer 
* Released under the MIT license 
*/ 

और jquery.validation.unobtrusive.js

/*! 
** Unobtrusive validation support library for jQuery and jQuery Validate 
** Copyright (C) Microsoft Corporation. All rights reserved. 
*/ 

मैं मेरी समस्या का प्रदर्शन करने के लिए नीचे दिए गए एक सरल आवश्यक क्षेत्र उदाहरण प्रदान करते हैं।

ViewModel:

public class TierImportStatusUpdateViewModel 
{ 
    [Required] 
    public string String1 { get; set; } 
    [Required] 
    public string String2 { get; set; } 
    //more fields 
} 

cshtml:

@model MyViewModel 
<form action="/controller/action" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#dic1" id="form1" method="post" class="allforms"> 
    @Html.LabelFor(model=>model.String1) 
    @Html.EditorFor(model=>model.String1) 
    @Html.ValidationMessageFor(model=>model.String1) 
    <br> 
    @Html.LabelFor(model=>model.String2) 
    @Html.EditorFor(model=>model.String2) 
    @Html.ValidationMessageFor(model=>model.String2) 
    <br> 
    <button type="submit" class="btn btn-primary" id="submit" name="submit">submit</button> 
</form> 

ऊपर सत्यापन सही ढंग से काम करता है। यदि String1POST विधि में कैप्चर नहीं किया गया है, तो क्लाइंट पक्ष पर त्रुटि संदेश नहीं दिखाया जाता है।

मैं उसके बाद निम्न jQuery का उपयोग के रूप में मैं सभी फ़ॉर्म प्रविष्टियों को पकड़ने के लिए करना चाहते हैं और कुछ अतिरिक्त तर्क कार्य करें:

$(".allforms").submit(function (e) { 

     e.preventDefault(); 

     var self = this; 
     $.ajax({ 
      processData: false, 
      contentType: false, 
      data: new FormData(this), 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      success: function (data) { 
       //other logic 
      } 
     }); 

     return (false); 
    }); 

यह jQuery समारोह काम करता है और मेरी नियंत्रक विधि कॉल बटन क्लिक होने। हालांकि String1 कैप्चर नहीं किया गया है और सबमिट किया गया है, सत्यापन में त्रुटि संदेश दिखाई देता है लेकिन jquery फ़ंक्शन अभी भी फ़ॉर्म पोस्ट करता है।

मौजूदा सत्यापन फ़ील्ड विफल होने पर मैं jquery फ़ंक्शन को AJAX विधि को कॉल करने के लिए कैसे रोकूं?

स्क्रीन पर सत्यापन संदेश दिखाए जाने के कारण मुझे अपनी खुद की सत्यापन करने की आवश्यकता नहीं है। मैं सिर्फ प्रस्तुत

केवल एक चीज मैं अपने रूप में मिल सकता है व्यक्तिगत सत्यापन क्षेत्रों

<span class="text-danger field-validation-valid" data-valmsg-for="String1" data-valmsg-replace="true"></span> 

जैसे और फार्म केवल novalidate=novalidate टैग जो jquery.validate.js सभी रूपों यह है करने के लिए कहते हैं है को रोकने के लिए की जरूरत है पर सक्षम

if ($("#form1").valid()) { 
    // make the ajax call 
} 

प्रलेखन यहाँ है: .valid()

Answer 1

आप सशर्त ajax कॉल केवल तभी प्रकार मान्य है, जो इस जावास्क्रिप्ट कोड के साथ किया जा सकता है बनाने की जरूरत है।

कृपया सत्यापित करें कि जेनरेट किए गए पृष्ठ में फ़ॉर्म की आईडी वास्तव में form1 है। यदि नहीं, तो वैकल्पिक चयनकर्ता हैं जिनका आप उपयोग कर सकते हैं, या आईडी प्राप्त करने के तरीके जो रेजर कोड द्वारा उत्पन्न किए जाएंगे।

नोट: जैसा कि मैंने आपका कोड दोहराया है, मैं देख सकता हूं कि आप सभी रूपों के लिए एक हैंडलर का उपयोग कर रहे हैं। उस स्थिति में आपको .valid() विधि को उस फ़ॉर्म में ट्रिगर करने के लिए कॉल करना होगा, जो कि ट्रिल $(this) उपलब्ध होगा। I.e, यह जांचने के लिए कि क्या फॉर्म मान्य है, $(this).valid() करें।

Answer 2

पहले e.preventDefault(); का उपयोग न करें, यह फ़ॉर्म सबमिट करने से सबमिट बटन को रोक देगा।

अपने $(".allforms").submit समारोह में पहली बार अपने प्रपत्र

इस var frmVlalidation = $('#formId').valid();

की तरह मान्य आपके प्रपत्र मान्य है ठीक से frmVlalidation मूल्य true हो सकता है अगर यदि सत्यापन विफल हो यह false वापस आ जाएगी। इस चर कॉल कॉल AJAX का उपयोग करके

।

इस तरह।

$(".allforms").submit(function (e) { 

     var frmVlalidation = $('#formId').valid(); 

     if (frmVlalidation == true) 
     { 
     var self = this; 
     $.ajax({ 
      processData: false, 
      contentType: false, 
      data: new FormData(this), 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      success: function (data) { 
       //other logic 
      } 
     }); 
     } 

     return (false); 
    }); 

Answer 3

इस प्लगइन के साथ AJAX का उपयोग करने का उचित तरीका प्लगइन के सबमिट के अंदर AJAX डालना हैडलर कॉलबैक फ़ंक्शन।

"The right place to submit a form via Ajax after it is validated."

प्रलेखन

से

उदाहरण: अजाक्स के माध्यम से फार्म जब वैध सबमिट करता है।

$(".selector").validate({ 
    submitHandler: function(form) { 
    $(form).ajaxSubmit(); 
    } 
}); 

यह सुनिश्चित करता है कि यदि फॉर्म वैध है तो केवल फॉर्म सबमिट किया गया है।