如何通过使用 PHP 和 Javascript 获取单选按钮值来计算总数?

How to calculate a total by taking the radio button values using PHP and Javascript?

我使用 php 表示数据库中的问题。我使用数组将它们显示在 table 中。单选按钮通过在 php 中给出变量 "i" 作为名称进行分组。因此,我无法将这些单选按钮的值提供给 javascript 函数来计算总数。

这是 table 的表示方式:

我想计算所选单选按钮值的总和,并将该值发送到另一个页面。我怎么做?非常感谢!

下面是我的代码。

<html>

<body>

 <?php
$DATABASE_HOST = 'localhost';
$DATABASE_USER = 'root';
$DATABASE_PASS = '';
$DATABASE_NAME = 'psych';

$connect = mysqli_connect($DATABASE_HOST, $DATABASE_USER, $DATABASE_PASS, $DATABASE_NAME);

    $res = mysqli_query($connect, "SELECT questions FROM questions");

    $quests = mysqli_fetch_array($res);  

  ?>
<form name="form1" id="form1" method="post" action="../../Algorithms/score.php"> 

<table> 
  <th>
  <td width=100>Strongly agree </td>
  <td width=100>Agree </td>
  <td width=100>Neutral </td>
  <td width=100>Disagree </td>
  <td width=100>Strongly disagree </td>
  </th>
<?php 

$score=0;

    $i=1;
  while($row = mysqli_fetch_array($res))
    {
     echo "<tr> <td width=500>".$i.". ".$row['questions']."</td>";
     echo '<td width=100> <input type="radio" name="'.$i.'"  value="1" > </td>';
     echo '<td width=100> <input type="radio" name="'.$i.'"  value="2" > </td>';
     echo '<td width=100> <input type="radio" name="'.$i.'"  value="3" > </td>';
     echo '<td width=100> <input type="radio" name="'.$i.'"  value="4" > </td>';
     echo '<td width=100> <input type="radio" name="'.$i.'"  value="5" > </td>';
       // if (score."$i") {echo "score$i";}
     echo "</tr>"; 
     // echo $scores[$i];
     //$scores[$i]=$_POST['score'.$i];
     $i++;

      }

    echo "</table>"; 
    echo "<br>"; 

  ?> 

  <input type='submit' name='submit' value='Submit'/>    

首先,更好用有意义的名称命名您的输入。

例如

echo '<td width=100> <input type="radio" name="score['.$i.']"  value="1" > </td>'

这将帮助您区分其他字段 - 如果您需要添加其他字段 -

在服务器端,您现在有一个名为 score 的输入数组,您可以 sum/calculate 总计 array_sum 就像:

if (isset($_POST['score'])) {
    $total = array_sum($_POST['score']);
}

要保存此值,您可以将 session 与此

一起使用
  1. 您可以使用相同的单选按钮但值不同 <input type="radio" name="score" value="1" >,<input type="radio" name="score" value="2" >.
  2. 在单选按钮中像这样传递自定义 class <input type="radio" class="cstm-radio" name="score" value="1" >;
  3. 使用on-click java脚本或jquery事件获取点击单选按钮的值并执行ajax请求,传递url文件或您必须执行后端操作的文件名。

您可以使用此代码执行 ajax 请求!

$('.cstm-radio').click(function () {
  var radio_val = $(this).val();
   $.ajax({
    //url of your php file
    url: "post.php",
    type: "POST",
    data: {score: radio_val},
    success: function (data) {
        // alert radio value here
        alert(data);
    }
 });
});