jQuery सत्यापन प्लगइन: निर्दिष्ट सबमिट बटन के लिए सत्यापन अक्षम करें


167

मेरे पास कई फ़ील्ड्स के साथ एक फॉर्म है जिसे मैं मान्य कर रहा हूं (कुछ कस्टम सत्यापन के लिए जोड़े गए तरीकों के साथ) Jörn Zaeffere के उत्कृष्ट jQuery मान्यकरण प्लगइन के साथ। आप निर्दिष्ट सबमिट नियंत्रणों के साथ सत्यापन को कैसे दरकिनार करते हैं (दूसरे शब्दों में, कुछ सबमिट इनपुट के साथ आग सत्यापन, लेकिन दूसरों के साथ सत्यापन को आग न दें)? यह मानक ASP.NET सत्यापनकर्ता नियंत्रण के साथ सत्यापन समूहों के समान होगा।

मेरी स्थिति:

यह ASP.NET WebForms के साथ है, लेकिन आप चाहें तो इसे अनदेखा कर सकते हैं। हालाँकि, मैं सत्यापन का उपयोग "अनुशंसा" के रूप में अधिक कर रहा हूं: दूसरे शब्दों में, जब फ़ॉर्म सबमिट किया जाता है, तो सत्यापन में आग लग जाती है, लेकिन "आवश्यक" संदेश प्रदर्शित करने के बजाय, "अनुशंसा" से पता चलता है कि "आप" की रेखा के साथ कुछ कहता है निम्नलिखित क्षेत्रों को याद किया .... क्या आप आगे बढ़ना चाहते हैं? " उस बिंदु पर त्रुटि कंटेनर में अब एक और सबमिट बटन दिखाई देता है जिसे दबाया जा सकता है जो सत्यापन को अनदेखा करेगा और वैसे भी सबमिट करेगा। इस बटन नियंत्रण और अभी भी पोस्ट के लिए रूपों .validate () को कैसे दरकिनार करें?

Http://jquery.bassistance.de/validate/demo/mipart// पर घर का नमूना खरीदें और बेचें लिए पिछले लिंक को हिट करने की अनुमति देता है, लेकिन यह कस्टम तरीकों को बनाने और सत्यापनकर्ता में जोड़ने के माध्यम से ऐसा करता है। मैं मान्यकरण प्लगइन में पहले से ही कार्यक्षमता को डुप्लिकेट करने के लिए कस्टम तरीके नहीं बनाना पसंद करूंगा।

निम्नलिखित तुरंत लागू स्क्रिप्ट का छोटा संस्करण है जिसे मैंने अभी प्राप्त किया है:

var container = $("#<%= Form.ClientID %> div.validationSuggestion");

$('#<%= Form.ClientID %>').validate({          
    errorContainer: container,
    errorLabelContainer: $("ul",container),
    rules: {
        <%= YesNo.UniqueID %>: { required: true },
        <%= ShortText.UniqueID %>: { required: true } // etc.

    },
    messages: {
        <%= YesNo.UniqueID %>: 'A message.',
        <%= ShortText.UniqueID %>: 'Another message.' // etc.
    },
    highlight: function(element, errorClass) {
        $(element).addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass("valid");
    },
    unhighlight: function(element, errorClass) {
        $(element).removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass("valid");
    },
    wrapper: 'li'
}); 

इसके अलावा, बटन पर कीवर्ड वापसी निर्दिष्ट इतना है कि यह दूर नेविगेट नहीं होंगे technote.in/TechNote/Forums/AspnetReply.aspx?post_id=134

जवाबों:


285

cancelसत्यापन को दबाने के लिए आप सबमिट बटन का CSS वर्ग जोड़ सकते हैं

जैसे

<input class="cancel" type="submit" value="Save" />

इस सुविधा के jQuery के मान्य दस्तावेज को यहां देखें: सबमिट करने पर लंघन सत्यापन


संपादित करें :

उपरोक्त तकनीक को चित्रित किया गया है और formnovalidateविशेषता के साथ बदल दिया गया है।

<input formnovalidate="formnovalidate" type="submit" value="Save" />

1
क्या यह <इनपुट /> के साथ काम कर रहा है? मैंने क्लास = "रद्द" किया और यह काम नहीं कर रहा है। मैं MVC2 का उपयोग MicrosoftMvcValidation के साथ कर रहा हूं। धन्यवाद।
विन्नीज

4
@VinnyG - MicrosoftMvcValidation का उपयोग नहीं किया गया (और कभी नहीं होगा) - यह जक्वेरी वेलिडेट के समान नहीं है।
redsquare

1
क्या इनपुट तत्व के बिना समान व्यवहार प्राप्त करना संभव है? यानी क्या मैं किसी तरह ट्रिगर कर सकता हूं (एक दस्तावेज तरीके से, लेप के जवाब के विपरीत) फार्म जमा करना और एक ही समय में सत्यापन को छोड़ दें?
ivan

10
नोट: यह काम नहीं करता है यदि आप गतिशील रूप से कक्षा रद्द करते हैं, अर्थात $('input[type=submit]').addClass('cancel'), कक्षा को पृष्ठ लोड पर उपस्थित होना है।
१४:४० बजे लोलस्क

@ लॉस्क आपको फिर से सत्यापन विधि को कॉल करने की आवश्यकता है जब तक कि उन्होंने इस जवाब पर तारीख को ध्यान में रखते हुए काम करने का तरीका नहीं बदला है)
Redsquare

107

अन्य (अनिर्दिष्ट) इसे करने का तरीका, कॉल करना है:

$("form").validate().cancelSubmit = true;

बटन के क्लिक इवेंट पर (उदाहरण के लिए)।


नमस्कार @lepe, आप जानते हैं कि लिखने के बाद jquery सत्यापन को फिर से कैसे लागू किया जाए $("form").validate().cancelSubmit = true;। मैंने कोशिश की $("form").validate().cancelSubmit = false;और $("form").validate();अपने सबमिट बटन पर कॉल किया। धन्यवाद
Jaikrat

3
यह $(yourForm).data('validator').cancelSubmit = false;धन्यवाद की तरह किया जा सकता है
जयकार्ट

18

फिर भी एक और (गतिशील) तरीका:

$("form").validate().settings.ignore = "*";

और इसे फिर से सक्षम करने के लिए, हम बस डिफ़ॉल्ट मान वापस सेट करते हैं:

$("form").validate().settings.ignore = ":hidden";

स्रोत: https://github.com/jzaefferer/jquery-validation/issues/725#issuecomment-17601443


16

इनपुट में formnovalidate विशेषता जोड़ें

    <input type="submit" name="go" value="Submit"> 
    <input type="submit" formnovalidate name="cancel" value="Cancel"> 

वर्ग जोड़ना = "रद्द करना" अब पदावनत हो गया है

इस लिंक पर सबमिट करने पर स्किपिंग सत्यापन के लिए डॉक्स देखें


10

आप सत्यापन प्रस्तुत करते समय ऑनरूबिट: गलत विकल्प ( प्रलेखन देखें ) का उपयोग कर सकते हैं जो फॉर्म जमा करने पर मान्य नहीं होगा। और फिर अपने एस्प में: बटन जोड़ें OnClientClick = $ ('# एस्पनेटफॉर्म')। मान्य (); यदि फॉर्म वैध है तो स्पष्ट रूप से जांच लें।

ऊपर वर्णित ऑप्ट-आउट के बजाय आप इसे ऑप्ट-इन मॉडल कह सकते हैं।

ध्यान दें, मैं ASP.NET WebForms के साथ jquery सत्यापन का उपयोग कर रहा हूं। नेविगेट करने के लिए कुछ मुद्दे हैं लेकिन एक बार जब आप उनके माध्यम से प्राप्त करते हैं, तो उपयोगकर्ता अनुभव बहुत अच्छा है।


3

( + के लिए उत्तर @lepeऔर विस्तार )@redsquareASP.NET MVCjquery.validate.unobtrusive.js


JQuery सत्यापन प्लगइन (नहीं माइक्रोसॉफ्ट विनीत एक) यदि आप एक डाल करने के लिए अनुमति देता है .cancelबाईपास सत्यापन करने के लिए पूरी तरह से (के रूप में स्वीकार किए जाते हैं जवाब में दिखाया गया है) अपने सबमिट बटन पर वर्ग।

 To skip validation while still using a submit-button, add a class="cancel" to that input.

  <input type="submit" name="submit" value="Submit"/>
  <input type="submit" class="cancel" name="cancel" value="Cancel"/>

(इसे भ्रमित न करें type='reset'जिसके साथ कुछ पूरी तरह से अलग है)

दुर्भाग्य से jquery.validation.unobtrusive.jsसत्यापन से निपटने (ASP.NET MVC) कोड थोड़े jquery.validate प्लगइन के डिफ़ॉल्ट व्यवहार को खराब कर देता है

यह वही है जो मैं आपको .cancelऊपर दिखाए अनुसार सबमिट बटन पर डालने की अनुमति देता हूं । अगर Microsoft कभी भी इसे ठीक करता है तो आप इस कोड को हटा सकते हैं।

    // restore behavior of .cancel from jquery validate to allow submit button 
    // to automatically bypass all jquery validation
    $(document).on('click', 'input[type=image].cancel,input[type=submit].cancel', function (evt)
    {
        // find parent form, cancel validation and submit it
        // cancelSubmit just prevents jQuery validation from kicking in
        $(this).closest('form').data("validator").cancelSubmit = true;
        $(this).closest('form').submit();
        return false;
    });

नोट: यदि पहली बार में यह प्रतीत होता है कि यह काम नहीं कर रहा है - सुनिश्चित करें कि आप सर्वर पर चक्कर नहीं लगा रहे हैं और त्रुटियों के साथ एक सर्वर जनरेट किए गए पृष्ठ को देख रहे हैं। आपको सर्वर साइड पर सत्यापन को कुछ अन्य माध्यमों से दरकिनार करना होगा - यह फ़ॉर्म को त्रुटियों के बिना क्लाइंट साइड जमा करने की अनुमति देता है (विकल्प .ignoreआपके फॉर्म में सब कुछ के लिए विशेषताओं को जोड़ रहा होगा )।

(नोट: buttonयदि आप सबमिट करने के लिए बटनों का उपयोग कर रहे हैं तो आपको चयनकर्ता को जोड़ना पड़ सकता है )


कि एक लानत Pay with PayPalबटन सबमिट करने के लिए लगभग 4 घंटे खराब होते हैं
सिमोन_वेवर जूल

यह डिफ़ॉल्ट MVC 5 टेम्पलेट के साथ मेरे लिए काम नहीं किया। मेरे पास Nuget पैकेज JQuery 1.10.2, JQuery वेलिडेशन 1.11.1, Microsoft jQuery विनीत मान्य 3.0.0 है। मेरे द्वारा अपने कोड में दो पंक्तियों को प्रतिस्थापित करने के लिए क्या काम किया गया था: $(this).closest('form').data("validator", null).unbind().submit();यह सत्यापनकर्ता को शून्य करने और इसे रद्द करने के लिए निर्धारित करेगा। इसके बाद वह फॉर्म सबमिट करेगा। आप इस लाइन द्वारा सत्यापन को रीसेट कर सकते हैं:$.validator.unobtrusive.parse($("#YourUniqueFormId"));
राल्फ जानसेन

लाइन के साथ कहीं यह तय किया गया था। मैं इसे पूरी तरह से टिप्पणी करने में सक्षम हूं और यह अब एक .cancelकक्षा के साथ काम करता है । ध्यान दें: यदि आप एक प्रकार = 'छवि' सबमिट बटन का उपयोग कर रहे हैं तो .cancelवर्ग तब तक काम नहीं करेगा जब तक कि आप jquery के मूल सत्यापन प्लगइन में नहीं बदल ":submit"जाते हैं":submit,:image"
Simon_Weaver

2
$("form").validate().settings.ignore = "*";

या

$("form").validate().cancelSubmit = true;

लेकिन एक कस्टम आवश्यक सत्यापनकर्ता में सफलता के बिना। डायनामिकली कॉल करने के लिए, मैंने इस कोड के साथ एक नकली हिडन सबमिट बटन बनाया है:

var btn = form.children('input.cancel.fakeSubmitFormButton');
if (btn.length === 0) {
    btn = $('<input name="FakeCancelSubmitButton" class="cancel fakeSubmitFormButton hide" type="submit" formnovalidate value="FakeCancelSubmitButton" />');
    form.append(btn);
}
btn.click();

अब सत्यापन को सही ढंग से छोड़ें :)


यदि आप किसी विशिष्ट वर्ग को मान्य होने से बाहर करना चाहते हैं, तो आप तारांकन के बजाय उसका उपयोग कर सकते हैं। $("form").validate().settings.ignore = "class-name";
जेम्स पॉउलॉस

1

यह प्रश्न पुराना है, लेकिन मुझे इसका उपयोग करने का एक और तरीका मिला है $('#formId')[0].submit(), जो कि jQuery ऑब्जेक्ट के बजाय डोम तत्व प्राप्त करता है, इस प्रकार किसी भी सत्यापन हुक को दरकिनार कर देता है। यह बटन उस मूल प्रपत्र को सबमिट करता है जिसमें इनपुट होता है।

<input type='button' value='SubmitWithoutValidation' onclick='$(this).closest('form')[0].submit()'/>

इसके अलावा, सुनिश्चित करें कि आपके पास कोई input"सबमिट" नाम नहीं है , या यह नामित फ़ंक्शन को ओवरराइड करता है submit


1

मैंने पाया कि JQuery का उपयोग करने के लिए सबसे लचीला तरीका है:

event.preventDefault():

उदाहरण के लिए, यदि मैं प्रस्तुत करना चाहता हूं, तो मैं यह कर सकता हूं:

$("#redirectButton").click(function( event ) {
    event.preventDefault();
    window.location.href='http://www.skip-submit.com';
});

या मैं डेटा को एक अलग समापन बिंदु पर भेज सकता हूं (जैसे कि अगर मैं कार्रवाई बदलना चाहता हूं):

$("#saveButton").click(function( event ) {
    event.preventDefault();
    var postData = $('#myForm').serialize();
    var jqxhr = $.post('http://www.another-end-point.com', postData ,function() {
    }).done(function() {
        alert("Data sent!");
    }).fail(function(jqXHR, textStatus, errorThrown) {
        alert("Ooops, we have an error");
    })

एक बार जब आप 'event.preventDefault ();' आप सत्यापन को बायपास करें।


1

मेरे पास फॉर्म जमा करने के लिए दो बटन हैं, बटन जिसे सेव और एग्जिट नाम दिया गया है जो मान्यता को दरकिनार करता है:

$('.save_exist').on('click', function (event) {
            $('#MyformID').removeData('validator');
            $('.form-control').removeClass('error');
            $('.form-control').removeClass('required');                
            $("#loanApplication").validate().cancelSubmit = true;
            $('#loanApplication').submit();
            event.preventDefault();
});

0

यहाँ सबसे सरल संस्करण है, आशा है कि यह किसी की मदद करता है,

$('#cancel-button').click(function() {
    var $form = $(this).closest('form');
    $form.find('*[data-validation]').attr('data-validation', null);
    $form.get(0).submit();
});
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.