-1
I am developing a php registration page where it contains 2 fields, a dropdownlist select field whose name is "Category" and the other an input field with autocomplete functions whose name is "Product".
What I would like to do, if possible, is that when selecting a category in the dropdownlist, the input autocomplete field automatically loads records related to the selected category in question.
For example, if the "Butcher" category is selected, the autocomplete input field would only load the products related to the "Butcher" category when the product name is entered in the autocomplete input.
I have researched here some similar doubts, but I was not successful in finding a solution to this question:
Below follows the code I use. This code contains the php code to load the categories, which in this case loads correctly, and the other part the input field that also loads the records correctly, but I can’t find a way to put these fields as dynamic:
<body>
<div class="container">
<br>
<form method="post">
<div class="row">
<div class="col-md-4">
<label>Selecione a categoria</label>
<?php
include 'db.php';
$stmt = $connection->prepare('SELECT * FROM categorias');
$stmt->execute();
$results = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<select name="categoriaFK" id="categoriaFK" class="form-control">
<?php foreach($results as $row): ?>
<option value="<?= $row['categoriaID']; ?>"><?= $row['categoria']; ?></option>
<?php endforeach ?>
</select>
</div>
<div class="col-md-4">
<label>Digite o produto</label>
<input type="text" class="form-control" id="produtos"/>
</div>
<div class="col-md-4">
<input type="submit" class="btn btn-success btn-block mt-4" name="submit" value="SUBMIT"/>
</div>
</form>
</div>
</div>
<script>
$(function() {
$("#produtos").autocomplete({
source: "search.php",
});
});
</script>
</body>
In the case, as stated above, how can I improve the above code to streamline the two fields in question (category) and (products)? Thank you.
Hello Fabrício. Thank you for your feedback. Based on your explanation I made some adaptations to the code and arrived at the solution. I also got answers in Stack in English which in fact also matches what you mentioned here. Follow the link (https://stackoverflow.com/questions/59614107/how-to-populate-twitter-typeahead-based-on-select-box-value). Thank you :)
– Michel Xavier