I am making a pharmacy system in this this system I store client information in mysql database
What I want when user click on addNewOrder.php it shows a input field where user writes the name of the client to search in a database and pull out all its information like name of client , mobile number and address I use ajax to make live search and search result shows below the input field in a table form
I want when user click on a tr which shows in search result all information which show in table form
should be displayed in input field like name should be displayed in name input field and number displayed
in number input field and address should be displayed in address input filed for further processing
below it the code what I try. Help me how I can achieve this
this is my searchClient.php code
<?php
include ("config/config.php");
if(isset($_POST['search'])) {
$searchClient = $_POST['search'];
$searchStatement = " SELECT * FROM customers WHERE customer_name LIKE '%$searchClient%'";
$searchQuery = mysqli_query($conn, $searchStatement);
echo "
<table class='table table-hover'>
<tbody>
";
?>
<?php foreach ($searchQuery as $searchResult){ ?>
<tr onclick='fill("<?php echo $searchResult['customer_id'];?><br> <?php echo
$searchResult['customer_name'];?><br><?php echo $searchResult['customer_number'];?><br>
<?php echo $searchResult['customer_address']; ?>")'>
<th scope="row"><?php echo $searchResult['customer_name']; ?></th>
<td><?php echo $searchResult['customer_number']; ?></td>
<td><?php echo $searchResult['customer_address']; ?></td>
</tr>
<?php
}
}?>
and this my html and ajax code
<?php
include_once ("config/config.php");
?>
<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="bootstrap/bootstrap-4.5.3-dist/css/bootstrap.min.css" rel="stylesheet">
<link href="fontawesome-free-5.15.1-web/css/all.min.css">
<link href="site_css/main.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="DataTables/datatables.min.css"/>
<title>Add New Order</title>
</head>
<body>
<?php include("config/navBar.php"); ?>
<div class="container-fluid">
<div class="row">
<div class="col-md-4">
<div class="card mt-4 shadow p-3 mb-5 bg-white rounded">
<div class="card-body">
<div class="card-header bg-dark text-white">Search Client</div>
<form method="post">
<div class="form-group mt-4">
<input type="text" class="form-control js-search" placeholder="Search Client
Here"
id="searchClient" name="searchClient">
<div class="js-search-result"></div>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-8">
<div class="card mt-4 shadow p-3 mb-5 bg-white rounded">
<div class="card-header bg-dark text-white">
Client Information
</div>
<div class="card-body">
<p class="js-result-name"></p>
</div>
</div>
</div>
</div>
<?php include("config/scripts.php") ?>
<script>
function fill(value){
$(".js-result-name").html(value);
$(".js-search-result").hide();
$(".js-search").val("");
}
$(document).ready(function(){
$(".js-search").keyup(function (){
var searchItem = $(this).val();
$.ajax({
//url: "searchExample.php",
url: "searchClient.php",
type: "post",
data : {
search: searchItem,
},
//dataType: "json",
success: function(data){
$('.js-search-result').html(data).show();
}
});
});
});
</script>
</body>
</html>
question from:
https://stackoverflow.com/questions/65913574/how-to-show-data-into-a-input-group-after-click-on-a-tr-row-which-is-populated-w 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
