gpt4 book ai didi

javascript - 提交并生成动态 PHP 表单

转载 作者:行者123 更新时间:2023-12-03 10:21:42 26 4
gpt4 key购买 nike

我有一个带有文本框和下拉菜单的表单。其中一个下拉菜单取决于另一个下拉菜单的值,例如InventoryUsage 取决于 InventoryID 中的值。

到目前为止,我已经使用 PHP 完成了整个网站,因为我不懂 JavaScript,尽管我找到了一个 JavaScript 函数可以获取 InventoryID 中输入的值,但我无法在PHP 因为 PHP 是服务器端的。

我需要做的是根据第一个下拉列表的选项更改第二个下拉列表选项。然后像使用普通表单一样提交数据。

编辑:

我使用了 ob_start 并包含了 tpl 页面,并将所有变量发送到之前从数据库中提取的页面。所有变量都具有相同的索引,这意味着 InventoryID['0']=ID3456 对应于 InventoryUsage['0']=60。因此,当 InventoryID 为 ID3456 时,我想显示位于 InventoryUsage['0'] 处的编号。我希望这能为问题增添一些背景。

索引由我的代码片段中的 php 变量 $i 确定。 $i 将被更改以匹配 InventoryID 字段的索引。假设 InventoryUsage 的值为 20,那么我想显示数字 1 到 20。

下面的代码片段:

<label>TypeOfSurgery</label> <input type="text" name="TypeOfSurgery"          size="35" value="" />
<label>CauseOfSurgery</label> <input type="text" name="CauseOfSurgery" size="35" value="" />
<label>AnaesthesiaUsage</label> <input type="text" name="AnaesthesiaUsage" size="35" value="" />
<label>SurgeryOutcome </label> <input type="text" name="SurgeryOutcome" size="35" value="" />
<label>RecoveryTime</label> <input type="text" name="RecoveryTime" size="35" value="" />
<label>Stages </label> <input type="text" name="Stages" size="35" value="" />
<label>EmployeeName </label> <p>
<select name="EmployeeName">
<option value=""></option>
<?php
for($i=0;!empty($EmployeeName[$i]);$i++)
echo '<option value="">'.$EmployeeName[$i].'</option>';
?>
</select><p>
<label>Cost</label> <input type="text" name="Cost" size="35" value="" />
<label>InventoryID</label> <p>
<select name="InventoryID">
<option value=""></option>
<?php
for($i=0;!empty($InventoryID[$i]);$i++)
echo '<option value="">'.$InventoryID[$i].'</option>';
?>
</select><p>
<label>InventoryUsage </label> <p>
<select name="InventoryUsage">
<option value=""></option>

<script type="text/javascript">
var model= document.getElementById('InventoryUsage');
</script>
<?php
//if inventory in
for($i=0;!empty($InventoryUsage[$i]);$i++)
echo '<option value="">'.$InventoryUsage[$i].'</option>';
?>
</select><p>

最佳答案

为了填充 InventoryUsage 下拉列表,您需要使用 JavaScript。您可以使用下拉列表 InventoryIDonChange 事件,然后通过 Ajax 获取相应的值。

     $('#InventoryID').change(function () {
var value =$(this).val(); // selected InventoryID option
//get InventoryUsage values
$.ajax({
method: "POST",
url: "myfile.php",
data: { data: value },
success: function(data){
// Populate new dropdown $("#InventoryUsage")
// this is an example without knowing what is the returned data
var Newoptions = [];
for (var i = 0; i < data.length; i++) {
Newoptions.push('<option value="',
data[i].someValue, '">',
data[i].someName, '</option>');
}
$("#InventoryUsage").html(Newoptions .join(''));

}
});
});
});

然后在您的 PHP 文件中,您需要处理 $_POST['data'] ,然后查询您的数据库并返回将在上面填充的下拉选项(数组)...

编辑:

如果您确定该索引与 Inventory_Usage 匹配并且 InventoryUsage 下拉列表之前已填充,则您可以尝试使用更改和加载事件上的 InventoryID 下拉列表的索引来选择 InventoryUsage 选项...

尝试将此功能添加到您的选择中:

    <select name="InventoryID" onChange="set_inventory_usage()"></select>

然后将此脚本添加到页面的 HEAD 部分..

<head>  
<script type="text/javascript">
function set_inventory_usage(){

// Change to getElementById if it is the ID not the name
var Inventory_ID = document.getElementsByName('InventoryID')[0];

var Inventory_Usage = document.getElementsByName('InventoryUsage')[0];

// returns the index of the selected option in the InventoryID dropdown
var InventorySelected = Inventory_ID.selectedIndex ;


// Sets the Usage dropdown to the same index as the Inventory selected option

Inventory_Usage.selectedIndex = InventorySelected ;
}

window.onload = set_inventory_usage ;

</script>
</head>

关于javascript - 提交并生成动态 PHP 表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29597479/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com