Retrieving data from database with dropdown list PHP/MySQL/HTML
Question
what I'm trying to achieve is retrieving data from database with dropdown list.
I can get the name variable from database and I can show all the database elements with a table but I don't know how can I merge these two. I want to click a button and show the selected dropdown list item's all database elements/column data.
Here is the code that retrieves product names for dropdown list:
<?php
$mysqli = NEW MySQLi('localhost', 'root', '', 'mydb');
$resultSet = $mysqli->query("SELECT namepro FROM mytable");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>developer mode</title>
</head>
<body>
<select>
<?php
while($rows = $resultSet->fetch_assoc()){
$dropdown = $rows['namepro'];
echo "<option value='$dropdown'>$dropdown</option>";
}
?>
</select>
<button type="button">Click Me!</button>
</body>
</html>
And this is the code that shows all database elements:
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
</head>
<body>
<table>
<tr>
<th>name</th>
<th>size</th>
</tr>
<?php
$conn=mysqli_connect("localhost","root","","mydb");
$sql = "SELECT namepro, res FROM mytable";
$result = $conn -> query($sql);
if($result->num_rows > 0){
while($row=$result->fetch_assoc()){
echo "<tr><td>". $row["namepro"]. "</td><td>". $row["res"]. "</td></tr>";
}
echo "</table>";
}
else{
echo "0 result";
}
$conn ->close();
?>
</table>
</body>
</html>
I want to click a button and show the selected dropdown list item's all database elements/column data. How can I achieve this? Thank you.
1 answers
solution1
0 2019-05-04 15:29:55
You can use jquery & ajax to achieve above .whenever button is click your jquery click function will get executed ,which will get value of select box with class="select" and pass it to your php page , like below :
Your button :
<button type="button" class="btn">Click Me!</button>
<div id="show"></div> // here data from respone will be display
Jquery & Ajax :
<script>
$(document).ready(function () {
$(".btn").click(function () {
var value= $(".select").val();//getting value of select box with class="select"
$.ajax({
url: 'yourphppage',
method: 'POST',
data: {value : value},//sending value to yourphppage
success:function(data){
$("#show").html(data);//here response from server will be display
}
});
});
});
</script>
Php code :
<?php
$value=$_POST['value'];//getting value sent from ajax
$conn=mysqli_connect("localhost","root","","mydb");
$sql = "SELECT namepro, res FROM mytable where namepro='".$value."'";//passing in query
$result = $conn -> query($sql);
if($result->num_rows > 0){
echo "<table>
<tr>
<th>name</th>
<th>size</th>
</tr>";
while($row=$result->fetch_assoc()){
echo "<tr><td>". $row["namepro"]. "</td><td>". $row["res"]. "</td></tr>";
}
echo "</table>";
}
else{
echo "0 result";
}
$conn ->close();
?>
Hope this helps !
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.