¿Cómo modificar la función a continuación para obtener todos los elementos según la categoría seleccionada? Simplemente quiero obtener y mostrar información sin tener que hacer clic en un botón/envío. Por favor, guíe cómo se puede lograr esto. Estoy abierto a sugerencias.
<head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> function getProdNames(){ //How to alter this to fetch & display all the elements from col (product_name) based on the selected category. var product_name = $('#category').find(':selected').data('product_name'); $('#prodNames').val(product_name); } </script> </head>PHP:
<body> <form> <select id="category" name="category" onClick="getProdNames();> <option> <?php // Attempt select query execution $sql = "SELECT * FROM TABLE1"; if($result = $mysqli->query($sql)){ if($result->num_rows > 0){ while($r = $result->fetch_array()){ echo "<option data-productName='$r[2]' data-color='$r[3]' value='$r[1]'> $r[1] </option>";} } } ?> </option> </select> //Display Product Names based on the selected category here in the form of multi select list <input name="prodNames" id="prodNames" class="form-control"/>Salida deseada: si el usuario selecciona un juguete. Esto debería activar la función onClick para mostrar todos los nombres de productos asociados con esta categoría. Por lo tanto, el siguiente resultado basado en este ejemplo:
ABC DEF