如何根据所选的“编号”填写已禁用的表单字段。佩拉亚南'。这个“No.Pelayanan”是一个选择字段，所以当我选择（填写该字段）时，它会自动填写表格。我正在寻找有关如何执行此操作的任何参考。谢谢！
【问题讨论】：
标签： python django ajax autofill
这可以通过普通的 javascript 或者更方便地使用 jquery 来完成。我将继续使用纯 JavaScript。
您可以将字段的相应数据存储在 js 变量中，或根据您的要求调用 api，并在更改选择字段值时从那里更新字段。
您可以使用 javascripts inputObject.value 来设置输入字段的值，如 here 解释的那样
这是一个工作示例，仅供您参考如何做到这一点
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
crossorigin="anonymous"
/>
</head>
<body>
<div class="container">
<form>
<div class="form-group">
<label for="emailfield">Email</label>
<input
type="email"
class="form-control"
id="emailfield"
placeholder="name@example.com"
disabled
/>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1"
>Example select</label
>
<select class="form-control" id="userselect">
<option value="1">user 1</option>
<option value="2">user 2</option>
<option value="3">user 3</option>
<option value="4">user 4</option>
<option value="5">user 5</option>
</select>
</div>
<div class="form-group">
<label for="fn">First Name</label>
<input
type="text"
class="form-control"
id="fn"
placeholder="firstname"
disabled
/>
</div>
<div class="form-group">
<label for="ln">Last Name</label>
<input
type="text"
class="form-control"
id="ln"
placeholder="lastname"
disabled
/>
</div>
</form>
</div>
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"
></script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx"
crossorigin="anonymous"
></script>
<script>
let usersData = [
{
id: 1,
email: "u1@gmail.com",
fname: "fname-1",
lname: "lname-1",
},
{
id: 2,
email: "u2@gmail.com",
fname: "fname-2",
lname: "lname-2",
},
{
id: 3,
email: "u3@gmail.com",
fname: "fname-3",
lname: "lname-3",
},
{
id: 4,
email: "u4@gmail.com",
fname: "fname-4",
lname: "lname-4",
},
{
id: 5,
email: "u5@gmail.com",
fname: "fname-5",
lname: "lname-5",
},
];
document.getElementById('userselect').onchange = (e) => {
let selectedUser = usersData.find(userdata => userdata.id == e.target.value);
console.log(selectedUser);
document.getElementById('emailfield').value = selectedUser.email;
document.getElementById('fn').value = selectedUser.fname;
document.getElementById('ln').value = selectedUser.lname;
};
</script>
</body>
</html>如果您不了解引导程序，请忽略我使用的 css 类，因为它们仅用于演示。其他输入字段，例如下拉菜单、文本字段、复选框，可以使用 js 以类似的方式填充。
更多例子可以参考this
要了解如何使用 jquery 完成此操作，您可以 check this out
【讨论】：