Lorsque l'élément requis de select2 est faux, jquery n'est pas valide

Question

Comment utiliser jQuery pour rendre faux les champs obligatoires de select2 ? Je souhaite utiliser jQuery pour que chaque select2 require=false et le désactive.

J'ai essayé ça... mais $('#accodeformheader').find('input, select').attr('required', false); Existe-t-il un moyen de rendre "required" = false de select2 ?

$(document).ready(function() {
                $('#idtask').change(function() {
                  var taskVal = $(this).val();
                  console.log("Valeur actuelle de la tâche", taskVal);
                  if (taskVal === "Herbe") {
                    document.getElementById("idspeakerdetailsdiv").style.display = "block";
                  }
                  autre {
                    document.getElementById("idspeakerdetailsdiv").style.display = "aucun";
                  }
                })

                $('.lexemeview').click(function() {
                  $('#accodeformheader').find('input, select').attr('disabled', true);
                  $('#accodeformheader').find('input, select').attr('required', false);
                  
                  document.getElementById("accodeformheader").style.display = "none";
                  
                  boutonType = $(this).attr("id")
                  forme active (type de bouton)
                  $('#formdisplay').find('input, select').attr('disabled', true);
                  $('#editbutton').attr('caché', false);
                  
                  var acode = $(this).attr("id");
                  console.log(accode)
                  $.getJSON("{{url_for('karya_bp.getonespeakerdetails')}}", {
                    asycaccesscode:String(accode)
                    }, fonction (données) {
                        console.log(données)
                        métadonnées = data.speakerdetails.current.workerMetadata
                        console.log (métadonnées)
                        $('#accesscode').attr('value', accode)

<div id="accodeformheader" style="display: block;">
              <div class="form-group">
                <label for="idaccesscodefor">Code d'accès pour :</label><br>
                <select class="accesscodefor" id="idaccesscodefor" name="accesscodefor" style="width:55%" obligatoire></select><br>
              </div>

              <div class="form-group">
                <label for="idtask">Tâche :</label><br>                           
                <select class="task" id="idtask" name="task" style="width:55%" obligatoire></select><br>
              </div>

             <div id="uploadaccode" style="display: block;"></div> 
            </div>
              <div class="form-group">

                <label class="col-form-label">Nom :</label>
                <input type="text" class="form-control" id="idname" name="sname" placeholder="--Speaker Name--" style="width:55%" value="" obligatoire >
              </div>

              <div class="form-group">
              <label for="sagegroup">Groupe d'âge : </label> <br> 
              <select class="age" id="idage" name="sagegroup" style="width:55%" obligatoire>
              </select><br>
                </div>

            <div id="idspeakerdetailsdiv" style="display: none;">
                <div class="form-group">                    
                <label for="sgender">Sexe : </label>  <br>
                <select class="gender" id="idgender" name="sgender" style="width:55%" obligatoire>
                
                </select><br>

                </div>  

                <div class="form-group">
                <label for="educationalevel">Niveau d'éducation : </label> <br>
                <select class="educationlvl" id="idelevel" name="educationalevel" style="width:55%" obligatoire>
                </select><br>
                </div>
              

                <div class="form-group">
                    <label for="moe12">Moyen d'enseignement (jusqu'au 12ème) : </label><br>                           
                    <select class="educationmediumupto12" id="idmediumpre" name="moe12" multiple="multiple" style="width:55%" requis>
                    </select><br>
                </div> 
                
                
                <div class="form-group">
                    <label for="moea12">Moyenne d'enseignement (après la 12e) : </label><br>                           
                    <select class="educationmediumafter12" id="idmediumpost" name="moea12" multiple="multiple" style="width:55%" obligatoire>
                    </select><br>
                </div> 
                
                

          </div>


            <button type="button" id="closebutton" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
            <input type="soumettre" value="Soumettre"> <br><br>
            
            </formulaire>
          </div>

Answer 1

Vous pouvez simplement supprimer l'attribut "obligatoire" si vous n'en avez pas besoin

$('select').removeAttr('required');

Si vous souhaitez réinitialiser, veuillez suivre ces étapes :

$('select').prop('required', 'required');

Si vous souhaitez supprimer une liste déroulante select2 spécifique en fonction de l'identifiant ou de la classe, veuillez suivre ces étapes :

$('#your_id_name').removeAttr('required');

Utilisez le nom de la classe :

$('.your_class_name').removeAttr('required');

Encore une fois, vous pouvez définir en fonction de l'identifiant et de la classe comme ceci :

$('#your_id_name').prop('required', 'required');

Utilisez le nom de la classe :

$('.your_class_name').prop('required', 'required');

J'espère avoir compris votre question et donné la bonne réponse.