How to insert value of radio button into database?

Question

I have this code:

<label style="cursor:pointer;"><input type="radio" name="rads" value="'.$correct.'" id = "radio">'.$answer.'</label> 
<button onclick="myFunction()">Value</button>';

where $correct is a row in my database that shows if a question is correct or wrong and has a value of either 1 or 0 ($correct = $row['correct']

I'm trying to increment data in another table in the database anytime a user clicks on a radio button.

For example, if a question is wrong the value will be '0' and when a user clicks on it, the 'wrong' row will be incremented and vice-versa.

I tried using PHP to insert the values:

$vote = isset($_GET['rads']);
               if($vote == 1){
                  $sql = mysqli_query($connection, "UPDATE stats SET question_id='$question_id', correct=correct + 1, wrong=0") ;
               } elseif($vote == 0) {
                   $sql = mysqli_query($connection, "UPDATE stats SET question_id='$question_id', correct=0, wrong=wrong + 1") ;
               }

but only the 'wrong' column was incrementing. I tried using js to print out the value of the selected radio button:

<p id =" demo"></p>
<script>
function myFunction() {
    var x = document.getElementById("radio").value;
    document.getElementById("demo").innerHTML = x;
}
</script>

But nothing appeared when I clicked the button. I also tried:

var try = document.getElementsByName('rads');
for (var i = 0, len = try.length; i < length; i++) {
if (try[i].checked == 0) {
    // increment wrong in db

    else if (try[i].checked == 1){
        //increment correct in db
    }

    break;

}

I'm not really sure what to do anymore. Sorry if I'm not clear.

Answer 1

The code below finally worked for me after much trials and error. I added the ajax function below which the radio buttons call when clicked.

<script>
function addVote(str) {
if (str == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
} else {
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","try.php?rad="+str,true);
    xmlhttp.send();
    }
}

    </script>

On try.php, which the function works from takes the value of the radio button and updates the database according to the value of the button clicked.

 <?php
$q = $_GET['rad'];

$con = mysqli_connect('localhost','','','try');
if (!$con) {
    die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con, 'try');
if($q == 1){
$sql="UPDATE count SET correct = correct+1, wrong=wrong+0 WHERE question_id = 1 ";
} else{
$sql="UPDATE count SET correct=correct+0, wrong=wrong+1 WHERE question_id = 1 ";
}
$result = mysqli_query($con,$sql);


mysqli_close($con);
?>

The button's onclick calls the function this way and should be in a div function called txtHint:

onclick="addVote(this.value)"

Answer 2

I'm not able to clearly understand your problem, I found a mistake from your code.

<label style="cursor:pointer;">
  <input type="radio" name="rads" value="<?php echo $correct; ?>" id = "radio"><?php echo $answer; ?></label> 
<button onclick="myFunction()">Value</button>';

try this. sorry if I'm wrong.

Answer 3

try this code

var try = document.getElementsByName('rads');
   for (var i = 0, len = try.length; i < length; i++) {
   if  !(try[i].checked) {
   // increment wrong in db

   else if (try[i].checked){
    //increment correct in db
  }

  break;

  }