我尝试在用户在下拉列表中进行选择后填充两个文本字段。 下面的代码有效,但显然是该功能的手动工作。 我需要form.accounts和form.client的值来自选择框正在使用的查询。 有任何想法吗。 这应该是jquery - 不是很熟悉它。
<?php
$db = new mysqli("127.0.0.1", "root", "", "centrum");
$sql = "SELECT
accounts_client_accounts.accounts_client_account_id,
accounts_client_accounts.accounts,
accounts_client.client
FROM
accounts_client_accounts
INNER JOIN accounts_client ON accounts_client_accounts.accounts_client_id = accounts_client.accounts_client_id
ORDER BY accounts_client_account_id
";
if(!$result = $db->query($sql)){
die('There was an error running the query [' . $db->error . ']');
}?>
<form class="form-ui">
<span class="form-elements reqField">
<select class="dropdown" onchange="populateData(this)">
<option value="0">Choose Account</option>
<?php while($row = $result->fetch_assoc()){
echo "<option value='". $row['accounts_client_account_id']."'>".$row['accounts'];
}
?>
</select>
</span>
<span class="form-elements">
<input name="accounts" type="text" class="text" value="" />
</span>
<span class="form-elements reqField">
<input name="client" type="text" class="text" value="" />
</span>
</form>
<script>
function populateData(sel){
var form = sel.form,
value = sel.options[sel.selectedIndex].value;
switch(value){
case '1':
form.accounts.value = 'Account1';
form.client.value = 'Client1';
break;
case '2':
form.accounts.value = 'Account2';
form.client.value = 'Client2';
break;
case '3':
form.accounts.value = 'Account3';
form.client.value = 'Client3';
break;
default:
}
}
</script>
答案 0 :(得分:0)
您可以使用下拉选项的数据属性,并从中填充字段值。 这是代码:
<form class="form-ui">
<span class="form-elements reqField">
<select class="dropdown" onchange="populateData(this)">
<option value="0">Choose Account</option>
<?php while($row = $result->fetch_assoc()){
echo "<option data-account=".$row['accounts']." data-client=".$row['client']." value='". $row['accounts_client_account_id']."'>".$row['accounts'];
}
?>
</select>
</span>
<span class="form-elements">
<input name="accounts" type="text" class="text" value="" />
</span>
<span class="form-elements reqField">
<input name="client" type="text" class="text" value="" />
</span>
</form>
<script>
function populateData(sel){
var account = $(this).find(':selected').data('account'),
client = $(this).find(':selected').data('client');
form.accounts.value = account;
form.client.value = client;
}
}
</script>