英文:
How to fill combobox from php variable in html
问题
以下是您提供的代码的翻译部分：
第一个下拉选择框中有两个选项框，都是从数据库中填充的，并在网站上显示（目前正常工作）。
当用户在第一个选择框中选择一个项目时，我希望重置第二个选择框，并根据第一个选择框的值填充它。
我正在使用MVC处理程序来完成这个操作。
英文:
I have two selection boxes, both filled from database and displayed on a web site(that works for now).
When the user choose an item in first select dropdown, I want to reset second select dropdown and fill it with other values based on the first select dropdown value.
I am using an MVC handler to do this.
<div style="position:absolute;left:356px;top:110px;width:193px;height:17px;border:1px #C0C0C0 solid;z-index:150">
<select
name="cmb_listen_bearbeitung"
size="1"
id="cmb_listen_bearbeitung"
onchange="GetSelectedListenBearbeitungValue(this,list_list_eintraege)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="4">
<?php
if ($listen->num_rows > 0) {
mysqli_data_seek($listen, 0);
while ($row = mysqli_fetch_array($listen)) {
unset($listen_id, $bezeichnung);
$listen_id = $row['listen_id'];
$bezeichnung = $row['bezeichnung'];
if ($liste_ausgewaehlt == $listen_id) {
echo '<option value="' . $listen_id . '"selected>' . $bezeichnung . '</option>';
} else {
echo '<option value="' . $listen_id . '">' . $bezeichnung . '</option>';
}
}
mysqli_data_seek($listen, 0);
}
?>
</select>
</div>
<div style="position:absolute;left:356px;top:163px;width:193px;height:134px;border:1px #C0C0C0 solid;z-index:151">
<select name="list_list_eintraege"
size="10"
id="list_list_eintraege"
onchange="GetSelectedListenEintragValue(this)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="5">
<?php
if ($listeneintrag->num_rows > 0) {
while ($row = mysqli_fetch_array($listeneintrag)) {
unset($listen_id, $entry_short, $entry_long);
$listen_id = $row['listen_id'];
if ($listen_id == $liste_ausgewaehlt) {
$entry_short = $row['entry_short'];
$entry_long = $row['entry_long'];
echo '<option value="' . $entry_short . '">' . $entry_long . '</option>';
}
}
mysqli_data_seek($listeneintrag, 0);
}
?>
</select>
</div>
<div style="position:absolute;left:356px;top:110px;width:193px;height:17px;border:1px #C0C0C0 solid;z-index:150">
<select
name="cmb_listen_bearbeitung"
size="1"
id="cmb_listen_bearbeitung"
onchange="GetSelectedListenBearbeitungValue(this,list_list_eintraege)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="4">
<?php
if ($listen->num_rows > 0) {
mysqli_data_seek($listen, 0);
while ($row = mysqli_fetch_array($listen)) {
unset($listen_id, $bezeichnung);
$listen_id = $row['listen_id'];
$bezeichnung = $row['bezeichnung'];
if ($liste_ausgewaehlt == $listen_id) {
echo '<option value="' . $listen_id . '"selected>' . $bezeichnung . '</option>';
} else {
echo '<option value="' . $listen_id . '">' . $bezeichnung . '</option>';
}
}
mysqli_data_seek($listen, 0);
}
?>
</select>
</div>
<div style="position:absolute;left:356px;top:163px;width:193px;height:134px;border:1px #C0C0C0 solid;z-index:151">
<select name="list_list_eintraege"
size="10"
id="list_list_eintraege"
onchange="GetSelectedListenEintragValue(this)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="5">
<?php
if ($listeneintrag->num_rows > 0) {
while ($row = mysqli_fetch_array($listeneintrag)) {
unset($listen_id, $entry_short, $entry_long);
$listen_id = $row['listen_id'];
if ($listen_id == $liste_ausgewaehlt) {
$entry_short = $row['entry_short'];
$entry_long = $row['entry_long'];
echo '<option value="' . $entry_short . '">' . $entry_long . '</option>';
}
}
mysqli_data_seek($listeneintrag, 0);
}
?>
</select>
</div>
答案1
得分: 0
需要设置类并使用每个函数来重置除当前选择框之外的其他选择框。
以下是代码部分：
$(".yourclassname").click(function () {
var selected = $(this);
$(".yourclassname").each(function () {
if (selected != $(this)) {
$(this).reset();
}
});
});
英文:
Need to set class and use each function for reset other than the current selectbox.
Code is here :
$(".yourclassname").click( function(this){
var selected = $(this);
$(".yourclassname").each( function(this){
if(selected != $(this))
{
$(this).reset();
}
});
});
答案2
得分: 0
以下是您要翻译的内容：
基于我们在评论中的交流，我发布了一般性的代码
在多维数组中设置来自数据库的相关数据（我假设这是PHP，因为这应该是从数据库中获取的数据），如下所示：
Array
(
[<combobox1 option 1 value>] => Array
(
[0] => <combobox2 option 1 value> // 与combobox1选项1相关
[1] => <combobox2 option 2 value> // 与combobox1选项1相关
[2] => <combobox2 option 3 value> // 与combobox1选项1相关
// 以此类推
)
[<combobox1 option 2 value>] => Array
(
[0] => <combobox2 option 1 value> // 与combobox1选项2相关
[1] => <combobox2 option 2 value> // 与combobox1选项2相关
[2] => <combobox2 option 3 value> // 与combobox1选项2相关
// 以此类推
)
// 依此类推
)
JavaScript部分：
// 将PHP数组传递给JavaScript（我在这里称之为$full_data_array）
<?php foreach($full_data_array as $key => $value): ?>
let key = "<?= $key; ?>";
var optionsArray[key] =
<?php echo '["' . implode('", "', $value) . '"]' ?>
<?php endforeach; ?>
// 更新combobox2的onchange函数
function update_combobox2(){
var chosenField = document.getElementById('combobox1').value; // 来自combobox1的值
var comboBox2 = document.getElementById('combobox2');
optionsArray[chosenField].map( (option, i) => {
let opt = document.createElement("option");
opt.value = i; // 索引。您可以插入选项值
opt.innerHTML = option;
combobox2.append(opt);
});
}
HTML/PHP部分：
<select name="combobox1" id="combobox1" onChange="update_combobox2()">
// 您的选项（这也应该设置为上面数组中的键）
</select>
<select name="combobox2" id="combobox2">
// 您可以在这里添加一个默认的空选项
</select>
注意事项：
-
我已经很久没有使用jQuery了。使用它可能会得到更优雅的脚本。
-
这不是回答标题中描述的内容，而是我在评论中理解您需要的内容。要使用数据库数据填充
<select>的PHP代码，请查看这个问题的答案。
英文:
Based on our exchange in the comments, I'm posting a general code
Set your relevant data from the DB in a multidimensional array (I'm assuming this is PHP, because this should be data taken from the DB), like so:
Array
(
[<combobox1 option 1 value>] => Array
(
[0] => <combobox2 option 1 value> // relevant to combobox1 option 1
[1] => <combobox2 option 2 value> // relevant to combobox1 option 1
[2] => <combobox2 option 3 value> // relevant to combobox1 option 1
// and so on
)
[<combobox1 option 2 value>] => Array
(
[0] => <combobox2 option 1 value> // relevant to combobox1 option 2
[1] => <combobox2 option 2 value> // relevant to combobox1 option 2
[2] => <combobox2 option 3 value> // relevant to combobox1 option 2
// and so on
)
// and so forth
)
javascript part:
// passing the PHP array to javascript (I'm calling it $full_data_array here)
<?php foreach($full_data_array as $key => $value): ?>
let key = "<?= $key; ?>";
var optionsArray[key] =
<?php echo '["' . implode('", "', $value) . '"]' ?>;
<?php endforeach; ?>
// the onchange function that updates combobox2
function update_combobox2(){
var chosenField = document.getElementById('combobox1').value; // the value from combobox1
var comboBox2 = document.getElementById('combobox2');
optionsArray[chosenField].map( (option, i) => {
let opt = document.createElement("option");
opt.value = i; // the index. you can insert option value instead
opt.innerHTML = option;
combobox2.append(opt);
});
}
HTML/PHP part:
<select name="combobox1" id="combobox1" onChange="update_combobox2()">
// your options (that should also be set as keys in the array above)
</select>
<select name="combobox2" id="combobox2">
// you can throw in a default empty option here
</select>
NOTES:
-
I haven't used jQuery in a long while. You might get a more elegant script with it.
-
This does NOT answer what you described in the title, rather what I understood you needed from our exchange in the comments. For a PHP fill of
<select>with DB data, check this question's answers.
答案3
得分: 0
Here is the translated code without the translation of the code parts:
<form>
<input type="submit"
id="jQueryButton11"
name="btn_save_listen_bezeichnung"
value="Apply"
style="position:absolute;left:46px;top:325px;width:175px;height:32px;z-index:148"
tabindex="3">
<div id="bv_Text62" style="margin:0;padding:0;position:absolute;left:356px;top:89px;width:240px;height:15px;text-align:left;z-index:149;">
<font style="font-size:13px" color="#000000" face="Arial">List:</font>
</div>
<div style="position:absolute;left:356px;top:110px;width:193px;height:17px;border:1px #C0C0C0 solid;z-index:150">
<select
name="cmb_listen_bearbeitung"
size="1"
id="cmb_listen_bearbeitung"
onchange="update_list_list_eintraege()"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="4">
<?php
if ($listen->num_rows > 0) {
mysqli_data_seek($listen, 0);
while ($row = mysqli_fetch_array($listen)) {
unset($listen_id, $bezeichnung);
$listen_id = $row['listen_id'];
$bezeichnung = $row['bezeichnung'];
if ($liste_ausgewaehlt == $listen_id) {
echo '<option value="' . $listen_id . '" selected>' . $bezeichnung . '</option>';
} else {
echo '<option value="' . $listen_id . '">' . $bezeichnung . '</option>';
}
}
mysqli_data_seek($listen, 0);
}
?>
</select>
</div>
<div style="position:absolute;left:356px;top:163px;width:193px;height:134px;border:1px #C0C0C0 solid;z-index:151">
<select name="list_list_eintraege"
size="10"
id="list_list_eintraege"
onchange="GetSelectedListenEintragValue(this)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="5">
<?php
if ($full_data_array->num_rows > 0) {
while ($row = mysqli_fetch_array($full_data_array)) {
unset($listen_id, $entry_short, $entry_long);
$listen_id = $row['listen_id'];
if ($listen_id == $liste_ausgewaehlt) {
$entry_short = $row['entry_short'];
$entry_long = $row['entry_long'];
echo '<option value="' . $entry_short . '">' . $entry_long . '</option>';
}
}
mysqli_data_seek($full_data_array, 0);
}
?>
</select>
</div>
<script type="text/javascript">
// passing the PHP array to javascript (I'm calling it $full_data_array here)
<?php foreach($full_data_array as $key => $value): ?>
let key = "<?= $key; ?>";
var optionsArray[key] =
<?php echo '[' . implode(', ', $value) . ']'; ?>;
<?php endforeach; ?>
// the onchange function that updates combobox2
function update_list_list_eintraege(){
var chosenField = document.getElementById('cmb_listen_bearbeitung').value; // the value from combobox1
var comboBox2 = document.getElementById('list_list_eintraege');
comboBox2.empty();
optionsArray[chosenField].map( (option, i) => {
let opt = document.createElement("option");
opt.value = i; // the index. you can insert option value instead
opt.innerHTML = option;
comboBox2.append(opt);
});
}
</script>
</form>
Please note that I've kept the code structure and placeholders in the translation to maintain its functionality.
英文:
<form>
<input type="submit"
id="jQueryButton11"
name="btn_save_listen_bezeichnung"
value="Übernehmen"
style="position:absolute;left:46px;top:325px;width:175px;height:32px;z-index:148"
tabindex="3">
<div id="bv_Text62" style="margin:0;padding:0;position:absolute;left:356px;top:89px;width:240px;height:15px;text-align:left;z-index:149;">
<font style="font-size:13px" color="#000000" face="Arial">Liste:</font>
</div>
<div style="position:absolute;left:356px;top:110px;width:193px;height:17px;border:1px #C0C0C0 solid;z-index:150">
<select
name="cmb_listen_bearbeitung"
size="1"
id="cmb_listen_bearbeitung"
onchange="update_list_list_eintraege()"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="4">
<?php
if ($listen->num_rows > 0) {
mysqli_data_seek($listen, 0);
while ($row = mysqli_fetch_array($listen)) {
unset($listen_id, $bezeichnung);
$listen_id = $row['listen_id'];
$bezeichnung = $row['bezeichnung'];
if ($liste_ausgewaehlt == $listen_id) {
echo '<option value="' . $listen_id . '"selected>' . $bezeichnung . '</option>';
} else {
echo '<option value="' . $listen_id . '">' . $bezeichnung . '</option>';
}
}
mysqli_data_seek($listen, 0);
}
?>
</select>
</div>
<div style="position:absolute;left:356px;top:163px;width:193px;height:134px;border:1px #C0C0C0 solid;z-index:151">
<select name="list_list_eintraege"
size="10"
id="list_list_eintraege"
onchange="GetSelectedListenEintragValue(this)"
style="position:absolute;left:0px;top:0px;width:100%;height:100%;border-width:0px;font-family:Calibri;font-size:13px;"
tabindex="5">
<?php
if ($full_data_array->num_rows > 0) {
while ($row = mysqli_fetch_array($full_data_array)) {
unset($listen_id, $entry_short, $entry_long);
$listen_id = $row['listen_id'];
if ($listen_id == $liste_ausgewaehlt) {
$entry_short = $row['entry_short'];
$entry_long = $row['entry_long'];
echo '<option value="' . $entry_short . '">' . $entry_long . '</option>';
}
}
mysqli_data_seek($full_data_array, 0);
}
?>
</select>
</div>
<script type="text/javascript">
// passing the PHP array to javascript (I'm calling it $full_data_array here)
<?php foreach($full_data_array as $key => $value): ?>
let key = "<?= $key; ?>";
var optionsArray[key] =
<?php echo '["' . implode('", "', $value) . '"]' ?>;
<?php endforeach; ?>
// the onchange function that updates combobox2
function update_list_list_eintraege(){
var chosenField = document.getElementById('cmb_listen_bearbeitung').value; // the value from combobox1
var comboBox2 = document.getElementById('list_list_eintraege');
comboBox2.empty();
optionsArray[chosenField].map( (option, i) => {
let opt = document.createElement("option");
opt.value = i; // the index. you can insert option value instead
opt.innerHTML = option;
comboBox2.append(opt);
});
}
</script>
</form>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论