DIV क्लिक पर, एकाधिक चेकबॉक्स चेक करें (समान नाम से नहीं)

Question

मेरे रेडियो बटन को गतिशील रूप से नामित किया गया है। 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);
});

javascript php html

2

KIRPAL SINGH 28 पद 2018, 07:14

Answer 1

// assuming jquery

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

   });

});

1

David Bray 28 पद 2018, 07:37

Answer 2

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

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

1

Rohit 28 पद 2018, 08:53

Answer 3

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

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

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

$('.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

DIV क्लिक पर, एकाधिक चेकबॉक्स चेक करें (समान नाम से नहीं)

3 जवाब

संबंधित सवाल

नए सवाल