Question

我已经使用PHP创建了一个表单，用户必须在单击按钮之前单击单选按钮才能提交表单。它看起来如下：

<form name="films" action="showing.php" method="post">
<table id="filmtable">
<tr><th>Title</th><th>Length</th><th>Description</th><th>Poster</th><th>Required</th></tr>
<?php
//Loop through every row returned by $result query to display it in table.
while ($newArray = mysql_fetch_array($result)){

    $title  = $newArray['title'];
    $length = $newArray['length'];
    $description = $newArray['description'];
    $image = $newArray['image'];

    //Echo statements will display query results on screen.

    echo "<tr><td>$title</td><td>$length</td><td>$description</td>";
    echo "<td><image src=\"$image\"</td>";
    echo "<td><input type=\"radio\" id='wanted' name=\"wanted[]\" value='$title'></td></tr>";

}
// if (! array_key_exists($_POST['wanted[0]'], $result)){
//  echo "Select it.";
//}


?>
</table>
<input type="submit" onsubmit = 'return validate()' value="Select Film">
</form>

作为验证措施，我在Javascript中创建了以下内容，目的是阻止用户在未选择单选按钮时提交表单：

<script>
function validate(){
    var radio = document.getElementById('wanted').checked;

    if(radio=="")
    {
        alert("Please select a film to continue making a booking.");
        return false;
    }
    return true;

}

</script>

如果未按预期从收音机框中进行选择，则脚本会阻止用户提交表单。但是，如果选择了第一个单选框，它将只允许提交表单。选择除此之外的任何按钮将导致提交尝试失败。我应该对JS做出哪些改变以纠正这种情况？

Answer 1

这个PHP提取循环属性多次相同的id =＆＃34;想要＆＃34;许多单选按钮。
Id应该是唯一的......所以这是一个不好的做法
删除id并添加一个类：

if(!$('.wanted').prop("checked")){
    alert("Please select a film to continue making a booking.");
    return;
}

然后，使用jQuery可以减轻痛苦......
在提交脚本中：

<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>

在你的头脑中添加这个jQuery lib调用：

function validate(){
    var wantedChecked=$(".wanted:checked");
    if (!wantedChecked.prop("checked")){
        console.log("false");
        return false;

    }else{
        console.log("true");
        return true;
    }
}

编辑 - 见评论
功能验证应该是这样的：

dict1 = {'a':1, 'b':2, 'c':3}
dict2 = {'a':1, 'b':2, 'c':4}

set1 = set([(k, v) for k, v in dict1.items()])
set2 = set([(k, v) for k, v in dict2.items()])
diff_set = list(set1 - set2) + list(set2-set1)
print diff_set

Answer 2

getElementById返回与选择器匹配的第一个元素。如果您只是想验证是否已选中其中任何一个，您可以执行以下操作：

var anyChecked = document.querySelectorAll('[name=wanted]:checked').length > 0;

如何使用Javascript验证动态生成的PHP表单？

2 个答案: