动态地将带有填充的选项的选择框添加到表单中

时间:2011-09-28 00:13:46

标签: php javascript

我有一个发送消息表单,其中包含一个由PHP查询填充到数据库的收件人列表。我希望能够通过动态地向表单添加选择框来包含多个收件人,具体取决于他们希望将邮件发送到的人数。

我不太了解javascript,我一直在研究网络,看看如何动态地将一个选择框添加到一个带有PHP填充选项的表单中,但我似乎唯一能找到的东西是如何根据前一个选择框中选择的内容填充选项。

这是我的Javascript:

<script type="text/javascript">
function add_recipient_field(){
    var container=document.getElementById('addanother');
    var to_field=document.createElement('select');
    to_field.name='to[]';
    to_field.type='file';
    container.appendChild(to_field);
    var br_field=document.createElement('br');
    container.appendChild(br_field);
}
</script>

这是我的PHP:

$tosql = "SELECT UserID, FirstName, LastName FROM users WHERE Active = 'yes' ORDER BY LastName ASC";
$query = mysqli_query($dbc, $tosql) or die("Error: ".mysqli_error($dbc));
$tobox .= "<option value=\"None\">None</option>\n";
while ($row = mysqli_fetch_array($query)) {
    if ($row['UserID'] == $to) {
        $tobox .= "<option value=\"$row[UserID]\" selected=\"selected\">$row[LastName], $row[FirstName]</option>";
    } else {
        $tobox .= "<option value=\"$row[UserID]\">$row[LastName], $row[FirstName]</option>";
    }
}

这是我的HTML:

<div id="addanother"><li><label for="to">To: </label><select name="to[]" id="to">$tobox</select><a href="javascript:void(0);" onClick="add_recipient_field();">add more</a>$toerror</li></div>

当我点击“添加更多”链接时,它会添加另一个选择框,但是框中没有选项,因此它显示为空。我知道我错过了一些相当简单的东西,但是如果有人可以帮助或指导我指导教程,我会非常感激。

1 个答案:

答案 0 :(得分:0)

所有add_recipient_field都会添加一个空选择。我知道这是你的窘境,但我的观点是,根据你上面列出的函数,添加一个空选择是它应该做的,因为这是它写的内容。你仍然需要以某种方式填写数据。

请记住,PHP ONLY仅在服务器上运行,不会与浏览器中当前加载的页面进行交互。您可以使用Javascript在服务器上调用PHP并使用返回的数据来修改页面,但PHP本身在加载后无法更改文档。

您有3个主要选项。

  1. 您可以在每次用户选择“添加更多”时重新加载页面,并让php使用新选择重建页面。请记住,为了正确使用,您每次都必须传递所有表单数据,并在重建表单时重新填写。

  2. 您可以完全从Javascript构建选择,这意味着页面上的Javasript将需要拥有所有必需的数据。 PHP的json_encode方法对于快速执行此操作非常有帮助。您将所有数据加载到页面顶部的javascript对象中,然后每次添加新选择时,都会从该数据中填充新选择。

  3. 您可以阅读通常所谓的“AJAX”,其中页面上的javascript与服务器上的PHP交互,以便根据请求动态加载数据并更改已加载的页面而无需刷新。这是两个先前选项的混合,可能是更先进的方法,但最有价值的学习。