简体   繁体   中英

How to disabled table row using JS and insert the chosen option in MYSQL?

I have a PHP snippet that display the table row dynamically. Every row I there's a radio button with "Yes" and "No" option.

I created a JS function, when the user choose an option, there's a pop-box will be displayed.

If the user choose "Yes" option in the radio button and click "Ok" in the pop-box, the table row will be disabled even the radio button will be disable too. And the chosen option will be save in MYSQL.

How to save the chosen option in MySQL?

My JS snippet of disabling a row is not working. How to fix this?

PHP:

echo '<td id="resumeFile"><a href="' . $dir  . $file . '">Download Resume</a></td>';
        echo '<td id="radioOption">
                  <label for="Yes">Yes</label>
                    <input type="radio" id="processedOptionYes" name="processedOption" value="Yes" onclick="proccessedCheck()"/>
                  <label for="No">No</label>
                    <input type="radio" id="processedOptionNo" name="processedOption" value="No" onclick="proccessedCheck()"/></td>';

JS:

function proccessedCheck(){
    var checked = null;
    var inputs = document.getElementsByName('processedOption');
        for (var i = 0; i < inputs.length; i++){
            if (inputs[i].checked) {
            checked = inputs[i];
            break;
            }
        }

    if(checked == null){
        return false;
    } else if (checked == true){
            document.getElementById("resumeFile").disabled = true;
            document.getElementById("radioOption").disabled = true;
            document.getElementById("resumeFile").title = "This option has been disabled.";
    } else {
        return confirm('You have chosen '+ checked.value + ', is this correct?');
    }
}

Ok so if you are echo'ing the whole table from PHP just preset the parameters into the table

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<script   src="https://code.jquery.com/jquery-2.2.3.min.js"   integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo="   crossorigin="anonymous"></script> 
<script>
function proccessedCheck(id,answer) {
    if (confirm('You have chosen '+ id +': '+ answer + ', is this correct?')) {
        $("#processedOptionYes"+id).attr('disabled',true);
        $("#processedOptionNo"+id).attr('disabled',true);
        var withlink = $("#resumeFile"+id).html();
        var withoutlink = $(withlink).html();
        $("#resumeFile"+id).html("").append(withoutlink);
        $("#input1".val(id);
        $("#input2".val(answer);
        $("#myform").submit();

    }     
}
</script>

<!-- EDIT: hidden form to submit -->

<form id="myform" method="POST" action="savedb.php">
  <input type="hidden" id="input1" name="id" />
<input type="hidden" id="input2" name="answer" />
</form>


<table>
  <tr>
    <?php
$dir="";
$file="";
$id = 0;
//foreach($array as $row) {
    $id++;
    echo '<td id="resumeFile'.$id.'"><a href="' . $dir  . $file . '">Download Resume</a></td>';
        echo '<td id="radioOption>
                  <label for="Yes">Yes</label>
                    <input type="radio" id="processedOptionYes'.$id.'" name="processedOption" value="Yes" onclick="proccessedCheck('.$id.',\'Yes\')"/>
                  <label for="No">No</label>
                    <input type="radio" id="processedOptionNo'.$id.'" name="processedOption" value="No" onclick="proccessedCheck('.$id.',\'No\')"/></td>';
//}
                    ?>
  </tr>
</table>
</body>
</html>

Contents of savedb.php, this doesn't have to be a seperate file

<?php

// Check if my post array arrived, comment this line when u done
echo "<pre>";print_r($_REQUEST);echo "</pre>"; die();

// Connect to DB
// Build SQL insert string with $_REQUEST['id'] as the primary key


?>

For starters, try replacing:

        document.getElementById("resumeFile").disabled = true;
        document.getElementById("radioOption").disabled = true;

with:

        document.getElementById("processedOptionYes").disabled = true;
        document.getElementById("processedOptionNo").disabled = true;

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM