jQuery obtenir la valeur du bouton radio sélectionné

L’énoncé du problème est simple. Je dois voir si l’utilisateur a sélectionné un bouton radio dans un groupe de radio. Chaque bouton radio du groupe partage le même identifiant.

Le problème est que je n’ai pas de contrôle sur la façon dont le formulaire est généré. Voici l’exemple de code de la façon dont un code de contrôle de bouton radio ressemble à:

 

En plus de cela, quand un bouton radio est sélectionné, il n’ajoute pas un atsortingbut “checked” au contrôle “juste le texte vérifié” (je suppose que la propriété est vérifiée sans valeur) . Voici comment se présente une commande radio sélectionnée

  

Quelqu’un peut-il m’aider avec le code jQuery qui peut m’aider à obtenir la valeur du bouton radio coché?

Juste utiliser.

 $('input[name=name_of_your_radiobutton]:checked').val(); 

C’est si facile.

Tout d’abord, vous ne pouvez pas avoir plusieurs éléments avec le même identifiant. Je sais que vous avez dit que vous ne pouvez pas contrôler la façon dont le formulaire est créé, mais … essayez de supprimer tous les identifiants des radios ou de les rendre uniques.

Pour obtenir la valeur du bouton radio sélectionné, sélectionnez-le par nom avec le filtre :checked .

 var selectedVal = ""; var selected = $("input[type='radio'][name='s_2_1_6_0']:checked"); if (selected.length > 0) { selectedVal = selected.val(); } 

MODIFIER

Donc, vous n’avez aucun contrôle sur les noms. Dans ce cas, je dirais de mettre ces boutons tous dans un div, nommé, disons, radioDiv , puis de modifier légèrement votre sélecteur:

 var selectedVal = ""; var selected = $("#radioDiv input[type='radio']:checked"); if (selected.length > 0) { selectedVal = selected.val(); } 

La manière la plus simple d’obtenir la valeur du bouton radio sélectionné est la suivante:

 $("input[name='optradio']:checked").val(); 

Aucun espace ne doit être utilisé entre les sélecteurs.

 $("#radioID") // select the radio by its id .change(function(){ // bind a function to the change event if( $(this).is(":checked") ){ // check if the radio is checked var val = $(this).val(); // resortingeve the value } }); 

Veillez à envelopper ceci dans la fonction DOM ready ( $(function(){...}); ou $(document).ready(function(){...}); ).

  1. Dans votre code, jQuery recherche simplement la première instance d’une entrée avec le nom q12_3, qui dans ce cas a la valeur 1. Vous voulez une entrée avec le nom q12_3 qui est :checked .
 $(function(){ $("#submit").click(function() { alert($("input[name=q12_3]:checked").val()); }); }); 
  1. Notez que le code ci-dessus n’est pas identique à l’utilisation de .is(":checked") . La fonction is() de jQuery renvoie un booléen (true ou false) et non un élément.
 1
2
3

Cela retournera, coché la valeur du bouton radio.

 if($("input[type='radio'].radioBtnClass").is(':checked')) { var card_type = $("input[type='radio'].radioBtnClass:checked").val(); alert(card_type); } 

Pour obtenir la valeur du bouton radio sélectionné, utilisez RadioButtonName et l’ID de formulaire contenant RadioButton.

 $('input[name=radioName]:checked', '#myForm').val() 

OU seulement par

 $('form input[type=radio]:checked').val(); 
  $("input[name='gender']:checked").val() 

pour les atsortingbuts nesteds

 $("input[name='lead[gender]']:checked").val() 

N’oubliez pas les accolades simples pour le nom

Obtenez toutes les radios:

 var radios = $("input[type='radio']"); 

Filtrer pour obtenir celui qui est vérifié

 radios.filter(":checked"); 

OU

Une autre façon de trouver la valeur du bouton radio

 var RadeoButtonStatusCheck = $('form input[type=radio]:checked').val(); 

Vérifiez l’exemple, cela fonctionne bien

 
Metal purity :
 var check_value = $('.gold_color:checked').val(); 
 if (!$("#InvCopyRadio").prop("checked") && $("#InvCopyRadio").prop("checked")) // do something 

Voir ci-dessous un exemple de travail avec une collection de groupes de radios associés chacun à des sections différentes. Votre schéma de dénomination est important, mais idéalement, vous devriez essayer d’utiliser un schéma de dénomination cohérent pour les entrées de toute façon (en particulier quand elles sont dans des sections comme ici).

 $('#submit').click(function(){ var section = $('input:radio[name="sec_num"]:checked').val(); var question = $('input:radio[name="qst_num"]:checked').val(); var selectedVal = checkVal(section, question); $('#show_val_div').text(selectedVal); $('#show_val_div').show(); }); function checkVal(section, question) { var value = $('input:radio[name="sec'+section+'_r'+question+'"]:checked').val() || "Selection Not Made"; return value; } 
 * { margin: 0; } div { margin-bottom: 20px; padding: 10px; } h5, label { display: inline-block; } .small { font-size: 12px; } .hide { display: none; } #formDiv { padding: 10px; border: 1px solid black; } .center { display:block; margin: 0 auto; text-align:center; } 
  

Section 1

First question text

Second question text

Third Question

Section 2

First question text

Second question text

Third Question

Section 3

First question text

Second question text

Third Question

Choose Section Number



Choose Question Number







Par nom seulement

 $(function () { $('input[name="EventType"]:radio').change(function () { alert($("input[name='EventType']:checked").val()); }); }); 

La meilleure façon d’expliquer ce sujet simple est de donner un exemple simple et un lien de référence: –

Dans l’exemple suivant, nous avons deux boutons radio. Si l’utilisateur sélectionne un bouton radio, nous afficherons la valeur du bouton radio sélectionné dans un message d’alerte.

Html:

 
Male
Female
others

jquery: –

  $(document).ready(function(){ $('#Demo input').on('change', function() { alert($('input[name="Gender"]:checked', '#Demo').val()); }); }); 

Essayez ceci avec l’exemple

  
1
2
 
Company Suscription: Customer Subscription: Manully Set: NO Subscription:

et gérer jquery pour alerte comme pour la valeur définie / Changé par ID de div:

 $("#subscriptions input") // select the radio by its id .on('change', function(){ // bind a function to the change event alert($('input[name="subsrad"]:checked', '#subscriptions').val()); }); 

c’est très facile….:-}

Je ne suis pas une personne javascript, mais j’ai trouvé ici pour rechercher ce problème. Pour qui google il et trouve ici, j’espère que cela aide certains. Donc, comme en question si nous avons une liste de boutons radio:

 

Je peux trouver celui qui est sélectionné avec ce sélecteur:

 $('.list input[type="radio"]:checked:first').val(); 

Même s’il n’y a pas d’élément sélectionné, je n’obtiens toujours pas d’erreur indéfinie. Donc, vous n’avez pas besoin d’écrire une instruction if supplémentaire avant de prendre la valeur de l’élément.

Voici un exemple très simple de jsfiddle .

Voici 2 boutons radio à savoir rd1 et radio1

   

Le moyen le plus simple de vérifier quel bouton radio est coché, en vérifiant que chaque individu est (“: checked”)

 if ($("#rd1").is(":checked")) { alert("rd1 checked"); } else { alert("rd1 not checked"); } 

Un autre moyen facile de comprendre … ça marche:

Code HTML:

  Hold Cancel Suspend 

Code Jquery:

 $(document).on("click", ".active_status", function () { var a = $('input[name=active_status]:checked').val(); (OR) var a = $('.active_status:checked').val(); alert(a); }); 
   $(function() { $("#submit").click(function() { alert($('input[name=s_2_1_6_0]:checked').val()); }); });` 
 HTML Code    Javascript Code $("input[type='radio'].check").click(function() { if($(this).is(':checked')) { if ($(this).val() == 1) { $("#submit").val("Verified & Save"); }else{ $("#submit").val("Save"); } } }); 

ce sera facile avec onChange ()

   1 
2
3