Javascript は私の強みではなく、ユーザーが選択したチェックボックスの数をカウントする単純な関数を作成しようとしています。これらのチェックボックスは、データベースに格納された値から生成され、ピザを注文する顧客が利用できるトッピングの選択肢を表します。
Javascript:
<script type="text/javascript">
function countBoxes()
{
var aCounter = 0;
var count = 0;
while (count < 10){
var aString = 'topping' + count;
var aCheckbox = document.getElementById(aString);
if (aCheckbox.checked)
{
aCounter++;
}
count++;
}
alert(aCounter + 'boxes have been ticked');
}
</script>
PHP:
echo "<table>";
while($row = mysql_fetch_assoc($product))
{
echo "<tr><td>".$row['topping_name']."</td><td>".price($row[$aString])."</td><td> <input type=\"checkbox\" id=\"topping".$counter."\" name=\"topping".$counter."\" value=\"".$row['topping_name']."\" onclick=\"countBoxes()\"\" ></td></tr>";
$counter + 1;
}
echo "</table>";
何らかの理由で、チェック ボックスの「チェック済み」状態が取得されていませんか? これがなぜなのか誰か知っていますか?
生成された HTML
<table><tr><td>Pepperoni</td><td>0.00</td><td><input type="checkbox" id="topping" name="topping" value="Pepperoni" onclick="countBoxes()"" ></td></tr><tr><td>Ham</td> <td>0.00</td><td><input type="checkbox" id="topping" name="topping" value="Ham" onclick="countBoxes()"" ></td></tr><tr><td>Sausage</td><td>0.00</td><td><input type="checkbox" id="topping" name="topping" value="Sausage" onclick="countBoxes()"" ></td></tr><tr><td>Red Onions</td><td>0.00</td><td><input type="checkbox" id="topping" name="topping" value="Red Onions" onclick="countBoxes()"" ></td></tr></td></tr></table>