How to get(search) record in table with ajax via dropdown?

How to get(search) record in table with ajax via dropdown?

get(search) record in table with ajax via dropdown

Use in main file which you will create

<script src="<?php echo plugin_dir_url(__FILE__);?>/js/jquery.min.js"></script>
<script>

jQuery(document).ready(function($){
$(".selectcustomer").change(function(){
var name = $(".selectcustomer").val();

/* alert(name); */
var data = {
'action' : 'showdata',
'custname' : name,
};
var ajaxurl = $(".ajaxurl").val();
jQuery.post(ajaxurl, data, function(response) {

console.log(response);
$(".customer-info").html(response);

});
});
});
</script>

<body>
<div class="wrapper">
<div class="wrap">
<form action="" method="post">
<div class="col-3">
<label>Customer Name</label>
<select class="selectcustomer" name="custname">
<option>Select Name</option>
<?php
global $wpdb;

$result = $wpdb->get_results ( "SELECT * FROM wp_jaspreetsingh" );
foreach ( $result as $printr )
{
echo"<option>$printr->person_name</option>";

}
?>
</select>
</div>
<div class="customer-info">
<div class="col-3">
<label>Customer Address</label>
<input type="text" name="customeraddress" placeholder="Customer Address" value="">
</div>
<div class="col-3">
<label>Contact Person</label>
<input type="text" name="contactperson" placeholder="Contact Person" >
</div>
<div class="col-3">
<label>Customer Email</label>
<input type="Email" name="email" placeholder="Email" value="">
</div>
<div class="col-3">
<label>Phone</label>
<input type="number" name="phone" placeholder="Phone" value="" >
</div>
</div>

</form>
</div>
</div>
<body>

Use in function.php file which is located in theme folder.

function showdata(){
$name=$_POST['custname'];

global $wpdb;
$result = $wpdb->get_results ( "SELECT * FROM wp_jaspreetsingh where person_name='$name' " );
foreach ( $result as $printr ) {

}
?>

<div class="customer-info">
<div class="col-3">
<label>Customer Address</label>
<input type="text" name="customeraddress" placeholder="Customer Address" value="<?Php echo $printr->address; ?>">
</div>
<div class="col-3">
<label>Contact Person</label>
<input type="text" name="contactperson" placeholder="Contact Person" >
</div>
<div class="col-3">
<label>Customer Email</label>
<input type="Email" name="email" placeholder="Email" value="<?Php echo $printr->email; ?>">
</div>
<div class="col-3">
<label>Phone</label>
<input type="number" name="phone" placeholder="Phone" value="<?Php echo $printr->phone; ?>" >
</div>
</div>

<?php
die();

}
add_action('wp_ajax_showdata','showdata');
add_action('wp_ajax_nopriv_showdata','showdata');

Comments