对表单输入执行计算

时间:2015-03-17 23:27:09

标签: javascript php jquery html mysql

我设计了一个包含复选框和收音机的食物菜单网页。我使用PHP从MySQL数据库表中检索结果。下面的代码显示了当前如何设置事物的示例:

PHP包括连接数据库:

  <?php include('includes/fruits.php');?>
  <?php include('includes/cheese.php');?>
  <?php include('includes/desert.php');?>

其中一个PHP的示例包括:

$host="localhost"; // Host name 
$username="root"; // Mysql username    enter code here
$password="admin2"; // Mysql password    enter code here
$db_name="food"; // Database name    enter code here
$tbl_name="fruits"; // Table name

mysql_connect("$host", "$username", "$password")or die("cannot connect");     
mysql_select_db("$db_name")or die("cannot select DB");

$sql="SELECT * FROM $tbl_name";
$result_fruits=mysql_query($sql);

主页上返回表数据的输入框(每个类别都在自己的MySQL表中):

<?php while($rows=mysql_fetch_array($result_fruits)){ ?>
<input type="radio" name="fruits[]" id="<? echo $rows['itemname']; ?>" value="<? echo $rows['label']; ?>" class="green-border-fruits"  />

<?php while($rows=mysql_fetch_array($result_cheese)){ ?>
<input type="radio" name="cheese[]" id="<? echo $rows['itemname']; ?>" value="<? echo $rows['label']; ?>" class="green-border-cheese"  />

<?php while($rows=mysql_fetch_array($result_desert)){ ?>
<input type="radio" name="desert[]" id="<? echo $rows['itemname']; ?>" value="<? echo $rows['label']; ?>" class="green-border-desert"  />

因此,例如,上面的代码将返回:

apple  $2<br> 
orange $1<br>
grapes $2

<td>
swiss $3<br></td>
blue cheese $1.50<br>
feta $2.20

cake $5<br>
pie $4<br>
cookies $3.50

我需要在文本框中显示所有CHECKED项目的总数。

EX:这将是显示的数量(如果检查了苹果,橙子,蓝芝士和馅饼)

  

总计 - $ 8.50

非常感谢任何协助。

2 个答案:

答案 0 :(得分:0)

<script src="jquery.js"></script>

<script>
$(document).ready(function() {

$('.total').click(function() {

v = 0;
$('.sum').each(function() {

if( $(this).is(':checked') ) {
v+= parseFloat($(this).val());
}

});

alert(v);

});

});
</script>

<input class="sum" type="radio" name="fruits[]" id="" value="10.00" class="green-border-fruits"  /> 10.00 ....

<input type="button" class="total" value="sum">

答案 1 :(得分:0)

我会使用jQuery检查选择了哪些单选按钮,然后对所有值求和,并将结果与​​.html放在文本字段中。

检查单选按钮:

var value = $('input[name=radioName]:checked').val()

您可以通过以下方式遍历所有单选按钮:

$('.className').each(function() {
 // do stuff here
}

组合示例:

var sum = 0;
$('.radioButtonClass').each(function() {
     if($(this).is(':checked')) {
     sum = sum + $(this).val();
}
$("#idTextfield").html("Total: " + sum + "$");