I have this loop that loops through my database table tvshows to get the names of the T.V shows and output them to the screen with a radio input:
<div style="width: 200px;">
<div>
<?php
$query = "SELECT distinct(title), (id) from tvshows";
$featured = mysqli_query($conn,$query);
while ($row = mysqli_fetch_assoc($featured)) { ?>
<div class="list-group-item checkbox" style=" background-
color: #f4f4f4;">
<label ><input type="radio" name="re"
class="common_selector collection" style="" value="<?php
echo $row['title']; ?>" id='sale'> <?php echo
$row['title']; ?></label>
</div>
<?php
}
?>
</div>
</div>
Here is the AJAX:
$("input:radio").change(function() {
var product_id = $(this).attr('id');
var coll = $(this).attr('value');
var action = "check";
if ($(this).is(":checked")) {
$.ajax({
url:"../PHP_Scripts/fetch_data.php",
method: "POST",
dataType: "json",
data:{
coll:coll, action:action, product_id:product_id
},
success:function(data){
$('#product_wrapper').html(data);
alert("success");
}
});
});
It's the $("input:radio").change(function() {} that is my issue. To summarise why this problem is happening: the script PHP_Scripts/fetch_data.php activates every time the radio input is changed. Its function is to output the products based off of which radio button is clicked. It's an issue because the PHP_Scripts/fetch_data.php also contains some AJAX that adds the product to the cart, so when the radio input changes, and you try to add a product to the cart, the product gets added to the cart the same amount of times as the input has been changed. So if you check a radio input 3 times, then click the button that adds a product to the cart, it will be added 3 times.
The reason I didn't paste every page is that the issue just one line: $("input:radio").change(function() {}. Does anyone know an alternative I can use to activate the AJAX when say, a certain input is checked?