কীভাবে jQuery বৈধতা ত্রুটি বার্তা সাফ করবেন?


169

আমি ক্লায়েন্ট পাশের বৈধতার জন্য jQuery বৈধতা প্লাগইন ব্যবহার করছি। ফাংশনটিকে editUser()'ব্যবহারকারী সম্পাদনা করুন' বোতামে ক্লিক করা হয়, যা ত্রুটির বার্তা প্রদর্শন করে।

তবে আমি আমার ফর্মটিতে ত্রুটি বার্তাগুলি সাফ করতে চাই, যখন আমি 'ক্লিয়ার' বোতামটি ক্লিক করি, এটি একটি পৃথক ফাংশন বলে clearUser()

function clearUser() {
    // Need to clear previous errors here
}

function editUser(){
    var validator = $("#editUserForm").validate({
        rules: {
            userName: "required"
        },
        errorElement: "span",
        messages: {
            userName: errorMessages.E2
        }
    });

    if(validator.form()){
        // Form submission code
    }
}

উত্তর:


209

আপনি resetForm()পদ্ধতিটি চান :

var validator = $("#myform").validate(
   ...
   ...
);

$(".cancel").click(function() {
    validator.resetForm();
});

আমি তাদের একটি ডেমোসের উত্স থেকে ধরেছি

দ্রষ্টব্য: এই কোডটি বুটস্ট্র্যাপ 3 এর জন্য কাজ করবে না।


31
বুটস্ট্র্যাপ ব্যবহারকারীদের ক্ষেত্রে এমন কিছু ঘটনা রয়েছে যেখানে ফর্মের শিশু উপাদানগুলির resetForm()সমস্ত দৃষ্টান্ত পরিষ্কার হয় না .error। আপনি কল না করা হলে এটি লাল পাঠ্যের রঙের মতো অবশিষ্টাংশের সিএসএস ছেড়ে দেবে .removeClass()। উদাহরণ:$('#myform .control-group').removeClass('error');
জ্লেউকোভিচ

14
বুটস্ট্র্যাপ 3 ব্যবহার করা এতে ক্ষেত্রের বৈধতা ত্রুটিগুলি আড়াল করে না। কি লজ্জা.
মাফিন ম্যান

2
এটি আমার জন্য বুটস্ট্র্যাপ 3 নিয়ে কাজ করে Perhaps সম্ভবত সমস্যাটি আপনার উভয় গ্রন্থাগারের একীকরণের সাথে?
বার্নি

3
এই রিসেটফর্মটি ফর্মের ডেটাগুলিকে আক্ষরিক এমনকি বিশ্রামও দেবে না।
কোডমোল

@ জেলেভকোভিচ বুটস্ট্রাইপি 3 ব্যবহার করে যা বলেছেন তা সত্য, অবশ্যই ম্যানুয়াল রিসেটিং লাফিয়ে বাস্তবায়ন করতে হবে পরিদর্শকের মধ্যে এবং কোথাও ক্লাসগুলি ত্রুটির ক্ষেত্রে প্রয়োগ করছে তা নির্ধারণ করতে হবে
নেস্টার কোল্ট

126

আমি নিজেই এই বিষয়টি জুড়ে এসেছি। পদক্ষেপের উপর ভিত্তি করে ফর্মটি তৈরি করা অবস্থায় আমার শর্তসাপেক্ষে কোনও ফর্মের অংশগুলি বৈধতা দেওয়ার প্রয়োজন ছিল (অর্থাত্ নির্দিষ্ট সময়কর্মগুলি রানটাইমের সময় ডায়নামিকভাবে সংযোজন করা হয়েছিল)। ফলস্বরূপ, কখনও কখনও একটি নির্বাচিত ড্রপডাউনটির বৈধতা প্রয়োজন হয়, এবং কখনও কখনও এটি হয় না। যাইহোক, অগ্নিপরীক্ষার শেষে, এটি বৈধকরণ করা দরকার। ফলস্বরূপ, আমার একটি শক্তিশালী পদ্ধতি দরকার ছিল যা কার্যক্ষম ছিল না। আমি এর উত্স কোডের সাথে পরামর্শ করেছিjquery.validate

আমি এখানে যা এলাম:

  • বৈধতা সাফল্যের ইঙ্গিত দিয়ে ত্রুটিগুলি সাফ করুন
  • ত্রুটি প্রদর্শনের জন্য কল হ্যান্ডলার
  • সাফল্য বা ত্রুটির সমস্ত সঞ্চয় সাফ করুন
  • পুরো ফর্ম বৈধতা পুনরায় সেট করুন

    কোডে এটি দেখতে কেমন লাগে তা এখানে:

    function clearValidation(formElement){
     //Internal $.validator is exposed through $(form).validate()
     var validator = $(formElement).validate();
     //Iterate through named elements inside of the form, and mark them as error free
     $('[name]',formElement).each(function(){
       validator.successList.push(this);//mark as error free
       validator.showErrors();//remove error messages if present
     });
     validator.resetForm();//remove error class on name elements and clear history
     validator.reset();//remove all error and success data
    }
    //used
    var myForm = document.getElementById("myFormId");
    clearValidation(myForm);

    একটি jQuery এক্সটেনশন হিসাবে minified:

    $.fn.clearValidation = function(){var v = $(this).validate();$('[name]',this).each(function(){v.successList.push(this);v.showErrors();});v.resetForm();v.reset();};
    //used:
    $("#formId").clearValidation();

  • 2
    দুর্দান্ত, এই সমাধানটি "বৈধকরণের জন্য" বৈধকরণের জন্যও কাজ করছে
    সৈয়দ আলী

    1
    গ্রেট! বুটস্ট্র্যাপ এবং এমভিসি দিয়ে পুরোপুরি কাজ করে!
    সুইসবেন

    2
    সবার আগে, ধন্যবাদ! এটি বছরের পর বছর ধরে দুর্দান্ত কাজ করেছিল তবে এখন আমি একটি পারফরম্যান্সের বিষয়টি আবিষ্কার করেছি: showErrorsকিছু ডিওএম হেরফের করে এবং এটি ফর্মের প্রতিটি উপাদানগুলির জন্য ডাকা হয়। Code 30 টি নিয়ন্ত্রণ সহ কোনও ফর্মটিতে এই কোডটি ব্যবহার করার সময় ব্রাউজারটি কয়েক সেকেন্ডের জন্য হিমায়িত হয়। আমার জন্য সমাধানটি ছিল showErrorsলুপ থেকে সরে যাওয়া এবং ঠিক একবার আগে এটি কল করা validator.resetForm। আমি যতদূর বলতে পারি, এটি ঠিক একইভাবে আচরণ করে এবং অনেক দ্রুত।
    মাইকেল স্যান্ডিনো

    আমি আজ অবধি এটি ব্যবহার করে এসেছি যে আমি দেখেছি যে আমি যদি "রিসেট" বোতামে এই পদ্ধতিটি ব্যবহার করি তবে এটি সমস্ত ত্রুটিগুলি সরিয়ে দেয় তবে আর কোনও বৈধতা নেই ... এমনকি যদি আমি আবার যাচাই করার চেষ্টা করি তবে সবকিছু বৈধ
    সাভান্দি

    58

    আপনি যদি ত্রুটিগুলি কেবল লুকিয়ে রাখতে চান:

    $("#clearButton").click(function() {
      $("label.error").hide();
      $(".error").removeClass("error");
    });

    আপনি যদি নির্দিষ্ট করে থাকেন errorClass, তবে পরিবর্তে সেই ক্লাসটি কল করার জন্য কল করুন error(পূর্বনির্ধারিত) উপরে আমি ব্যবহার করেছি।


    2
    @ মার্ক - সঠিক, তবে এটি ডিজাইন করা হয়নি ... সেগুলি এখনও অবৈধ, আমরা কেবল এই ক্ষেত্রে ত্রুটি বার্তাগুলি গোপন করছি। আপনি যে ক্ষেত্রগুলিতে বিশেষত ত্রুটিগুলি আড়াল করতে চান (উপেক্ষা করবেন না, যেমন জমা দেওয়া বারণ করবেন না) তার জন্য গৃহীত উত্তরের বিকল্প এটি । এটি প্রায়শই আসে যা আপনি ভাবেন :)
    নিক ক্র্যাভার

    1
    সমস্যাটি যখন আপনি ফর্মটি পুনরায় সেট করে আবার সম্পাদনা করেন। আমার ত্রুটি কথোপকথন ত্রুটির গণনা প্রদর্শন করে এবং গণনাটি কেবল যোগফল রাখে। এমনকি 'রিসেটফর্ম'ও সহায়তা করে না।
    চিহ্নিত করুন

    1
    এমনকি আমি এটি করেছি তবে এটি অন্য সমস্যার দিকে পরিচালিত করে। ডায়লগটি খোলার পরে বৈধতাগুলি প্রয়োগ হয় না!
    বন্দর

    এই কৌশলটি আমার জন্য বুটস্ট্র্যাপ 3 ওয়েবসাইটে কাজ করেছিল। কেবল নিম্নলিখিতটিতে ত্রুটি শ্রেণিটি পরিবর্তন করতে হয়েছিল: $(".has-error").removeClass("has-error");
    মাইকে ব্ল্যাক

    42

    আপনি যদি ফর্মের সাথে সংযুক্ত করার সময় ভ্যালিডেটরদের আগে সংরক্ষণ না করে থাকেন তবে আপনি কেবল সহজভাবে অনুরোধ করতে পারেন

    $("form").validate().resetForm();

    যেমন .validate()আপনি পূর্বে সংযুক্ত একই ভ্যালিডিটারগুলি ফিরিয়ে দেবে (যদি আপনি এটি করেন)।



    18

    দুর্ভাগ্যবশত, validator.resetForm() অনেক ক্ষেত্রে কাজ করে না।

    আমার একটি কেস রয়েছে যেখানে, কেউ যদি ফাঁকা মান সহ কোনও ফর্মের "জমা দিন" তে আঘাত করে তবে এটি "জমা দিন" উপেক্ষা করা উচিত। কোনও ত্রুটি নেই। এটি যথেষ্ট সহজ। যদি কেউ মানগুলির একটি আংশিক সেট রাখে এবং "জমা দিন" তে আঘাত করে তবে এটি কিছু ক্ষেত্রকে ত্রুটিযুক্তভাবে পতাকাঙ্কিত করবে। তবে, যদি তারা সেই মানগুলি মুছে ফেলে এবং "জমা দিন" আবার আঘাত করে তবে এটির ত্রুটিগুলি সাফ হওয়া উচিত। এই ক্ষেত্রে, কোনও কারণে, "কারেন্টিলমেন্টস" অ্যারেটিতে বৈধকারীর মধ্যে কোনও উপাদান নেই, তাই কার্যকর করা হচ্ছে.resetForm() একেবারেই কিছুই করে না।

    এটিতে বাগ পোস্ট করা আছে।

    এগুলি ঠিক করার মতো সময় না হওয়া পর্যন্ত আপনার নিক ক্র্যাভারের উত্তর, তোতা'র গৃহীত উত্তর নয় use


    শুধুমাত্র জাভাস্ক্রিপ্ট বিশ্বে এটি গ্রহণযোগ্য বিষয়।
    স্ট্যাকওভারথ্রো


    6

    আমি মনে করি আমাদের সবকিছু পরিষ্কার করার জন্য ইনপুটগুলি প্রবেশ করতে হবে

    $("#your_div").click(function() {
      $(".error").html('');
      $(".error").removeClass("error");
    });

    5

    আপনি যদি কেবল পরিষ্কার বৈধতা লেবেল চান তবে আপনি jquery. માન્યate.js রিসেটফর্ম () থেকে কোড ব্যবহার করতে পারেন

    var validator = $('#Form').validate();
    
    validator.submitted = {};
    validator.prepareForm();
    validator.hideErrors();
    validator.elements().removeClass(validatorObject.settings.errorClass);

    4

    যাদের নীচে বুটস্ট্র্যাপ 3 কোড ব্যবহার করছে তারা পুরো ফর্মটি পরিষ্কার করবে: বার্তা, আইকন এবং রঙ ...

    $('.form-group').each(function () { $(this).removeClass('has-success'); });
    $('.form-group').each(function () { $(this).removeClass('has-error'); });
    $('.form-group').each(function () { $(this).removeClass('has-feedback'); });
    $('.help-block').each(function () { $(this).remove(); });
    $('.form-control-feedback').each(function () { $(this).remove(); });

    3

    আমি এটি দিয়ে পরীক্ষা করেছি:

    $("div.error").remove();
    $(".error").removeClass("error");

    এটি ঠিক হবে, যখন আপনার এটি আবার যাচাই করা দরকার।


    1
    var validator = $("#myForm").validate();
    validator.destroy();

    এটি সমস্ত বৈধতা ত্রুটি ধ্বংস করবে



    1

    আপনি যদি ক্লায়েন্টের পক্ষে কোনও বৈধতা লুকিয়ে রাখতে চান যা কোনও ফর্ম জমা দেওয়ার অংশ নয় তবে আপনি নিম্নলিখিত কোডটি ব্যবহার করতে পারেন:

    $(this).closest("div").find(".field-validation-error").empty();
    $(this).removeClass("input-validation-error");

    1

    প্রতিটি একক উত্তর চেষ্টা। আমার পক্ষে একমাত্র কাজটি ছিল:

    $("#editUserForm").get(0).reset();

    ব্যবহার:

    jquery-validate/1.16.0
    
    jquery-validation-unobtrusive/3.2.6/

    1

    অন্য কোনও সমাধান আমার পক্ষে কাজ করেনি। resetForm()প্রকৃত ফর্মটি পুনরায় সেট করতে স্পষ্টভাবে নথিভুক্ত করা হয়েছে, উদাহরণস্বরূপ ফর্ম থেকে ডেটা সরিয়ে ফেলুন, যা আমি চাই না। এটি কেবল কখনও কখনও এটি না করার সাথে ঘটে তবে কেবল ত্রুটিগুলি সরিয়ে দেয়। অবশেষে আমার জন্য যা কাজ করেছে তা হ'ল:

    validator.hideThese(validator.errors());

    0

    বাতিল করতে ক্লিক করে বৈধতা অপসারণের জন্য এটি ব্যবহার করার চেষ্টা করুন

     function HideValidators() {
                var lblMsg = document.getElementById('<%= lblRFDChild.ClientID %>');
                lblMsg.innerHTML = "";           
                if (window.Page_Validators) {
                    for (var vI = 0; vI < Page_Validators.length; vI++) {
                        var vValidator = Page_Validators[vI];
                        vValidator.isvalid = true;
                        ValidatorUpdateDisplay(vValidator);
                    }
                } 
            }

    এই ফাংশনটি বোতাম বাতিল করে আর কোথায় তোমার দর্শন লগ করা এই এক ব্যবহার করতে চান হয় কাজ করছে এটা good.try
    হাসিখুশি Goyal

    0

    ব্যবহার করার চেষ্টা করুন:

    onClick="$('.error').remove();"

    ক্লিয়ার বোতামে।


    0

    বৈধতা সারাংশ অপসারণ করতে আপনি এটি লিখতে পারে

    $('div#errorMessage').remove();

    যাইহোক, আপনি একবার সরিয়ে ফেললে, আবার যদি বৈধতা ব্যর্থ হয় তবে এটি এই বৈধকরণের সারাংশটি প্রদর্শন করবে না কারণ আপনি এটিকে সরিয়ে দিয়েছেন। পরিবর্তে নীচের কোডটি ব্যবহার করে লুকান এবং প্রদর্শন ব্যবহার করুন

    $('div#errorMessage').css('display', 'none');
    
    $('div#errorMessage').css('display', 'block');  

    0

    উপরের সমাধানগুলির কোনওটিই আমার পক্ষে কার্যকর হয়নি। আমি তাদের উপর আমার সময় নষ্ট করে হতাশ ছিল। তবে একটি সহজ সমাধান আছে।

    সমাধানটি বৈধ স্থিতির জন্য এইচটিএমএল মার্ক আপ এবং ত্রুটির অবস্থার জন্য এইচটিএমএল মার্ক আপের সাথে তুলনা করে অর্জন করা হয়েছিল।

    কোনও ত্রুটি তৈরি হবে না:

            <div class="validation-summary-valid" data-valmsg-summary="true"></div>

    যখন কোনও ত্রুটি দেখা দেয় তখন এই ডিভটি ত্রুটিগুলি দিয়ে জনবহুল হয় এবং শ্রেণিটি বৈধতা-সংক্ষিপ্ত-ত্রুটিতে পরিবর্তিত হয়:

            <div class="validation-summary-errors" data-valmsg-summary="true"> 

    সমাধান খুব সহজ। ডিভের এইচটিএমএল সাফ করুন যাতে ত্রুটি রয়েছে এবং তারপরে ক্লাসটি বৈধ অবস্থায় ফিরে যেতে হবে।

            $('.validation-summary-errors').html()            
            $('.validation-summary-errors').addClass('validation-summary-valid');
            $('.validation-summary-valid').removeClass('validation-summary-errors');

    শুভ কোডিং।


    0

    আপনি যদি আবারও রিসেট করতে চান numberOfInvalids()তবে ফাইল লাইনের নম্বরটিতে resetFormফাংশনে নিম্নলিখিত লাইনটি যুক্ত করুন jquery.validate.js: 415।

    this.invalid = {};

    0

    আমি করেছি

    $('.input-validation-error').removeClass('input-validation-error');

    ইনপুট ত্রুটি ক্ষেত্রগুলিতে লাল সীমানা অপসারণ করতে।


    0

    $(FORM_ID).validate().resetForm(); এখনও প্রত্যাশার মতো কাজ করছে না।

    আমি সাথে ফর্ম সাফ করছি resetForm() । এটি এক বাদে সব ক্ষেত্রেই কাজ করে !!

    আমি যখন অজ্যাক্সের মাধ্যমে কোনও ফর্ম লোড করি এবং আমার গতিশীল লোড করার পরে ফর্ম বৈধতা প্রয়োগ করি HTML, তারপরে যখন আমি ফর্মটি পুনরায় সেট করার চেষ্টা করি তখনresetForm() এবং এটি ব্যর্থ এবং এটি ফর্ম উপাদানগুলিতে আমি প্রয়োগ করছি সমস্ত বৈধতা বন্ধ করে দিই।

    সুতরাং দয়া করে এজ্যাক্স বোঝাই ফর্মগুলির জন্য বা ম্যানুয়ালি আরম্ভ করা বৈধতার জন্য এটি ব্যবহার করবেন না।

    PS যেমন বিবরণ হিসাবে আপনার নিক Craver এর উত্তর ব্যবহার করা প্রয়োজন ।


    0

    validator.resetForm()পদ্ধতি পরিষ্কার ত্রুটি পাঠ্য। তবে আপনি যদি ক্ষেত্রগুলি থেকে RED সীমানাটি সরাতে চান তবে আপনাকে ক্লাসটি সরিয়ে ফেলতে হবেhas-error

    $('#[FORM_ID] .form-group').removeClass('has-error');

    0

    ট্র্যাভিস জে , জে লেভকোভিচ এবং নিক ক্র্যাভারের পন্থাগুলি ব্যবহার করে ফাংশন ...

    // NOTE: Clears residual validation errors from the library "jquery.validate.js". 
    // By Travis J and Questor
    // [Ref.: https://stackoverflow.com/a/16025232/3223785 ]
    function clearJqValidErrors(formElement) {
    
        // NOTE: Internal "$.validator" is exposed through "$(form).validate()". By Travis J
        var validator = $(formElement).validate();
    
        // NOTE: Iterate through named elements inside of the form, and mark them as 
        // error free. By Travis J
        $(":input", formElement).each(function () {
        // NOTE: Get all form elements (input, textarea and select) using JQuery. By Questor
        // [Refs.: https://stackoverflow.com/a/12862623/3223785 , 
        // https://api.jquery.com/input-selector/ ]
    
            validator.successList.push(this); // mark as error free
            validator.showErrors(); // remove error messages if present
        });
        validator.resetForm(); // remove error class on name elements and clear history
        validator.reset(); // remove all error and success data
    
        // NOTE: For those using bootstrap, there are cases where resetForm() does not 
        // clear all the instances of ".error" on the child elements of the form. This 
        // will leave residual CSS like red text color unless you call ".removeClass()". 
        // By JLewkovich and Nick Craver
        // [Ref.: https://stackoverflow.com/a/2086348/3223785 , 
        // https://stackoverflow.com/a/2086363/3223785 ]
        $(formElement).find("label.error").hide();
        $(formElement).find(".error").removeClass("error");
    
    }
    
    clearJqValidErrors($("#some_form_id"));

    0

    নিজস্ব কোড লিখুন কারণ প্রত্যেকে আলাদা শ্রেণীর নাম ব্যবহার করে। আমি এই কোড দ্বারা jQuery বৈধতা পুনরায় সেট করছি।

    $('.error').remove();
            $('.is-invalid').removeClass('is-invalid');
    আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
    Licensed under cc by-sa 3.0 with attribution required.