मेरे रेडियो बटन को गतिशील रूप से नामित किया गया है। Div क्लिक पर सभी चेकबॉक्स कैसे चेक करें। Div और प्रत्येक रेडियो की विशिष्ट id होती है। Div वास्तव में कार्ड का प्रतिनिधित्व करता है। मैं कार्ड पर क्लिक करना चाहता हूं कि div में सभी सूचीबद्ध रेडियो का चयन कैसे करें जावास्क्रिप्ट से सभी बच्चे नोड को गतिशील रूप से कैसे प्राप्त करें लेकिन सभी रेडियो जांचें

<div id=<?= ($counter-1) ?> class="card categoryCard" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title"><?= $rows[$counter-1]["TICKETDESCRIPTION"]?></h5>
    <input type="radio" id=<?='TICKETDESCRIPTION'.($counter-1) ?> name="TICKETDESCRIPTION" >
    <p class="card-text"><label>RM <?= $rows[$counter-1]["TICKETPRICE"]?></label></p>
    <input type="radio" id=<?='TICKETPRICE'.($counter-1) ?> name="TICKETPRICE" >
  </div>
</div>

नीचे मेरा जावास्क्रिप्ट कोड है

$('.categoryCard').click(function(){
    var id = $(this).attr('id');
    var radiobtn = document.getElementById("TICKETDESCRIPTION"+id);
    radiobtn.checked = true;
    alert(id);
});
2
KIRPAL SINGH 28 पद 2018, 07:14

3 जवाब

सबसे बढ़िया उत्तर
// assuming jquery

$('.categoryCard').click(function(e){
   $('input[type="radio"]', this).each( function( i) {
     $(this).prop('checked', true);

   });

});
1
David Bray 28 पद 2018, 07:37

इसे इस प्रकार भी हल किया जा सकता है:-

$('.categoryCard').click(function(){
   $(this).find('input[type="radio"]').each(function() {
     $(this).prop('checked', true);
   });
});
1
Rohit 28 पद 2018, 08:53

इसे लागू करने के कई तरीके हैं। मैंने दो तरीकों का वर्णन किया है।

आपको आईडी को डुप्लीकेट के रूप में उपयोग नहीं करना चाहिए।

आईडी तत्वों के लिए पहचानकर्ता है, इसलिए इसे डुप्लिकेट नहीं होना चाहिए।

$('.categoryCard').click(function(e){
   $('input[type="radio"]', this).each( function( index, element) {
     $(element).prop('checked', true);

   });

});

$('.categoryCard').click(function(e){
  var id = $(this).attr('id');
   $('input[data-details="'+ id +'"]', this).each( function( index, element) {
     $(element).prop('checked', true);

   });

});
.categoryCard{
border: 1px solid #d4d4d4;
padding: 5px;

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div id="1" class="card categoryCard" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title">Desc</h5>
    <input type="radio" name="TICKETDESCRIPTION">
    <p class="card-text">Price</p>
    <input type="radio" name="TICKETPRICE" >
  </div>
</div>

<!-- 2nd Method there must be no duplicate ID  -->

<div id="2" class="card categoryCard" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title">Desc</h5>
    <input type="radio" name="TICKETDESCRIPTION" data-details ="1">
    <p class="card-text">Price</p>
    <input type="radio" name="TICKETPRICE" data-details ="1" >
  </div>
</div>
1
Kaushik 28 पद 2018, 07:44