JQuery में, मुझे रेडियो बटन का मूल्य कैसे मिलता है जब वे सभी एक ही नाम रखते हैं?

Question

यहाँ मेरा कोड है:

<table>
   <tr>
      <td>Sales Promotion</td>
      <td><input type="radio" name="q12_3" value="1">1</td>
      <td><input type="radio" name="q12_3" value="2">2</td>
      <td><input type="radio" name="q12_3" value="3">3</td>
      <td><input type="radio" name="q12_3" value="4">4</td>
      <td><input type="radio" name="q12_3" value="5">5</td>
   </tr>
</table>
<button id="submit">submit</button>

यहाँ जेएस है:

$(function(){
    $("#submit").click(function(){      
        alert($('input[name=q12_3]').val());
    });
 });

यहाँ JSFIDDLE है ! हर बार जब मैं बटन पर क्लिक करता हूं तो यह 1. क्यों? क्या कोई मेरी मदद कर सकता है?

Answer 1

आपके कोड में, jQuery नाम के साथ एक इनपुट के पहले उदाहरण के लिए देखता है q12_3, जिसमें इस मामले का मूल्य है 1। आप नाम के साथ एक इनपुट चाहते q12_3है कि :checked।

$("#submit").click(() => {
  const val = $('input[name=q12_3]:checked').val();
  alert(val);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>
  <tr>
    <td>Sales Promotion</td>
    <td><input type="radio" name="q12_3" value="1">1</td>
    <td><input type="radio" name="q12_3" value="2">2</td>
    <td><input type="radio" name="q12_3" value="3">3</td>
    <td><input type="radio" name="q12_3" value="4">4</td>
    <td><input type="radio" name="q12_3" value="5">5</td>
  </tr>
</table>
<button id="submit">submit</button>

ध्यान दें कि उपरोक्त कोड उपयोग करने के समान नहीं है .is(":checked")। jQuery का is()फ़ंक्शन एक बूलियन (सही या गलत) और नहीं (ए) तत्व देता है।

---

क्योंकि इस उत्तर पर बहुत ध्यान दिया जा रहा है, इसलिए मैं एक वैनिला जावास्क्रिप्ट स्निपेट भी शामिल करूँगा।

document.querySelector("#submit").addEventListener("click", () => {
  const val = document.querySelector("input[name=q12_3]:checked").value;
  alert(val);
});

<table>
  <tr>
    <td>Sales Promotion</td>
    <td><input type="radio" name="q12_3" value="1">1</td>
    <td><input type="radio" name="q12_3" value="2">2</td>
    <td><input type="radio" name="q12_3" value="3">3</td>
    <td><input type="radio" name="q12_3" value="4">4</td>
    <td><input type="radio" name="q12_3" value="5">5</td>
  </tr>
</table>
<button id="submit">submit</button>

Answer 2

अपने चयनकर्ता में, आपको यह भी निर्दिष्ट करना चाहिए कि आप चेक किए गए रेडियोबॉटन चाहते हैं:

$(function(){
    $("#submit").click(function(){      
        alert($('input[name=q12_3]:checked').val());
    });
 });

Comments

मुझे 'अपरिभाषित' मान मिल रहा है

— पावन अल्पपति

@PavanAlapati हम वास्तव में आपको यह नहीं बता सकते कि आपके HTML को देखे बिना क्यों; आदर्श रूप से, आप अपने सटीक HTML स्निपेट और आपके द्वारा उपयोग किए जा रहे कोड के साथ एक नया प्रश्न पोस्ट करेंगे। आपको केवल अपरिभाषित होना चाहिए, यदि: चयनकर्ता का नाम रेडियोबुटन के नामों से मेल नहीं खाता है; रेडियोबॉटन की कोई भी जाँच नहीं की जाती है; या चेक किए गए रेडियोडॉटन में कोई मान निर्दिष्ट नहीं है।

— डेनिस

Answer 3

आप चयनकर्ता बदलना चाह सकते हैं:

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

Answer 4

दूसरा तरीका भी है। कोड के नीचे प्रयास करें

$(document).ready(function(){

      $("input[name='gender']").on("click", function() {
            alert($(this).val());
        });
});

Answer 5

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

Answer 6

डेमो : https://jsfiddle.net/ipsjolly/xygr065w/

$(function(){
    $("#submit").click(function(){      
        alert($('input:radio:checked').val());
    });
 });

Answer 7

इस स्क्रिप्ट का उपयोग करें

$('input[name=q12_3]').is(":checked");

Comments

jQuery का isफ़ंक्शन एक लौटाएगा boolean, जो इस मामले में बेकार होगा।

— डेनिस