如何根据选择 PHP/JQuery 自动填充 select 框
[英]How to auto-fill an select box based on the selection PHP/JQuery
问题描述
can someone teach me on how to auto fill an select box based on the selection from the other select box?
有人可以教我如何根据其他 select 框中的选择自动填充 select 框吗？
this is my first selection wherein the user will select in Orderlist Code.这是我的第一个选择，其中用户将在订单代码中输入 select。
<div class="form-group">
<label for="gross_amount" class="col-sm-2 control-label" style="text-align:left;">OL Code</label>
<div class="col-sm-6">
<select class="form-control" id="table_name" name="table_name">
<?php foreach ($orderlist_data as $key => $value): ?>
<option value="<?php echo $value['id'] ?>"><?php echo $value['ol_code'] ?></option>
<?php endforeach ?>
</select>
</div>
</div>
after the selection base on the Order list code i hope to auto fill this selection base on the selection in the orderlist code.在根据订单列表代码进行选择后，我希望根据订单列表代码中的选择自动填充此选择。
create.php创建.php
<select class="form-control select_group product" data-row-id="row_1" id="product_1" name="product[]" style="width:100%;" onchange="getProductData(1)" required>
<option value='maincat' selected>--Select Products--</option>
<?php foreach ($products as $k => $v): ?>
<option value="<?php echo $v['id'] ?>"><?php echo $v['name'] ?></option>
<?php endforeach ?>
</select>
edit.php编辑.php
<select class="form-control select_group product" data-row-id="row_<?php echo $x; ?>" id="product_<?php echo $x; ?>" name="product[]" style="width:100%;" onchange="getProductData(<?php echo $x; ?>)" required>
<option value=""></option>
<?php foreach ($products as $k => $v): ?>
<option value="<?php echo $v['id'] ?>" <?php if($val['product_id'] == $v['id']) { echo "selected='selected'"; } ?>><?php echo $v['name'] ?></option>
<?php endforeach ?>
</select>
here is an photo on the orderlist module这是订单列表模块上的照片
then i hope someone can teach me how to auto-fill the product selection based in the orderlist selection然后我希望有人能教我如何根据订单列表选择自动填写产品选择 if i press the "OLCODE-1E6E" in the orderlist code selection i want to automate my product selection and display the 2 items i set in the orderlist but does not have knowledge from it i hope someone can teach.
如果我在订单列表代码选择中按“OLCODE-1E6E”，我想自动选择我的产品并显示我在订单列表中设置的 2 个项目，但没有从中获得知识我希望有人可以教。
function getProd(row_id)
{
var orderlist_id = $("#olcode_"+row_id).val();
if(orderlist_id == "") {
//i don't know the correct way
} else {
$.ajax({
url: base_url + 'orderlist/getOrderListById',
type: 'post',
data: {orderlist_id : orderlist_id},
dataType: 'json',
success:function(response) {
//i don't know the correct way
}
});
}
}
2 个解决方案
解决方案1
0 2022-11-27 15:08:09
I think you can use the jquery autocomplete ui along with php to return all the values.我认为您可以使用 jquery自动完成ui 和 php 返回所有值。 If it doesn't work with the <select> tag then just swap it with an <input> so the user can type in the product and use the list of autocompletions to help.如果它不能与<select>标签一起使用，那么只需将它与<input>交换，这样用户就可以输入产品并使用自动完成列表来提供帮助。 I hope that is helpful.我希望这会有所帮助。
解决方案2
0 2022-11-29 17:56:16
You can do it like this:你可以这样做：
<,DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width. initial-scale=1"> <title>jQuery UI Autocomplete - Default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style:css"> <script src="https.//code.jquery.com/jquery-3.6.0:js"></script> <script src="https.//code.jquery.com/ui/1.13.2/jquery-ui,js"></script> <script> $(function() { // use php code to add the options var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala"; "Scheme" ]. $("#tags"):autocomplete({ source; availableTags }); }): </script> </head> <body> <p>The UI Widget</p> <form> <div class="ui-widget"> <label for="tags">Tags: </label> <input id="tags"> </div> </form> </body> </html>
Then, just type "ja" and java and javascript should appear below as options.然后，只需键入“ja”，java 和 javascript 就会作为选项出现在下方。 Use some php code to get the list of options.使用一些 php 代码来获取选项列表。 You can then use bootstrap or php to make sure they typed a valid product.然后，您可以使用 bootstrap 或 php 来确保他们输入的是有效产品。 Bootstrapv Validation引导验证
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.