how to do update using ajax jquery in wordpress?

Question

i am developing plugin where i have to update the single record onchanging the select option element , i tried using wordpres codex way ,but i am struck can please anyone help me out here, below is my code

 function ajaxFunction(str,id) { var payment_selected = str; var id=id; var queryString = '&id_took='+id+'&sel='+payment_selected; var data = { 'action' : 'my_action', 'payment_selected': payment_selected, 'id' : id }; jQuery.post(admin_url("admin-ajax.php"), data, function(response) { jQuery("#status").html(response); }); } 

 /* this is a php file , i used in the plugin where below html form appears */ <?php add_action( 'wp_ajax_nopriv_my_action', 'my_action' ); add_action( 'wp_ajax_my_action', 'my_action' ); function my_action() { global $wpdb; $id_selected = $_POST['payment_selected']; $id = $_POST['id']; $table_name_payment = $wpdb->prefix . "online_booking_system_model"; $result_pay = $wpdb->query($wpdb->prepare("UPDATE $table_name_payment SET payment_status = $id_selected WHERE id=$id")); echo "success"; ?> /* this is the html file */ foreach ($rows as $row) { ?> <table> <td><?php echo $row->payment_status; ?></td> <select name='payment_select' id="payment_select" onchange="ajaxFunction(this.value,<?php echo $row->id ?>)"> <option value="Payment Due">Payment Due</option> <option value="Payment completed">Payment Completed</option> </select> <?php } ?> <table> <div id="status"></div> 

Answer 1

function ajaxFunction(str,id) {
jQuery.ajax({
                url: '<?php echo admin_url('admin-ajax.php'); ?>',
                type: 'post',
                data: {
                    'action' : 'my_action',
                    'payment_selected': payment_selected,
                    'id'    : id  
                },
                success: function (response) {
                    if(response=='success'){ 
                    jQuery("#status").html(response);
                    }
                }
});
}

PHP Code,

add_action( 'wp_ajax_nopriv_my_action', 'my_action' );
add_action( 'wp_ajax_my_action', 'my_action' );

function my_action() {    
 global $wpdb;
 $id_selected = $_POST['payment_selected']; 
 $id = $_POST['id'];
 $table_name_payment = $wpdb->prefix . "online_booking_system_model";    
 $result_pay =  $wpdb->query($wpdb->prepare("UPDATE $table_name_payment SET payment_status = $id_selected WHERE id=$id"));
 echo "success";
}
?>

HTML code,

 <?php foreach ($rows as $row) { ?>  
 <table>
 <tr><td><?php echo $row->payment_status; ?></td>
 <select  name='payment_select' id="payment_select" onchange="ajaxFunction(this.value,<?php echo $row->id ?>)">   
        <option value="Payment Due">Payment Due</option>
        <option value="Payment completed">Payment Completed</option>
 </select> 
 <?php } ?>
 </td></tr>
 <table>
 <div id="status"></div>

Hope this will helps you.

Answer 2

well i tried in my own way its working fine for me, below is my answer

 function ajaxFunction(str,id) { var payment_selected = str; var id=id; var queryString = '&id_took='+id+'&sel='+payment_selected; var data = { 'action' : 'my_action', 'payment_selected': payment_selected, 'id' : id }; jQuery.post(ajaxurl, data, function(response) { jQuery("#status").html(response); }); } 

 /* write this php function outside of all the function*/ <?php add_action( 'wp_ajax_nopriv_my_action', 'my_action' ); add_action( 'wp_ajax_my_action', 'my_action' ); function my_action() { global $wpdb; $id_selected = $_POST['payment_selected']; $id = $_POST['id']; $table_name_payment = $wpdb->prefix . "online_booking_system_model"; // $result_pay = $wpdb->query($wpdb->prepare("UPDATE $table_name_payment SET payment_status = $id_selected WHERE id = $id")); $result_pay = $wpdb->update( $table_name_payment, //table array( 'payment_status' => $id_selected), //data array('id' => $id) //data format ); } ?> foreach ($rows as $row) { ?> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <td> <select name='payment_select' id="payment_select" onchange="ajaxFunction(this.value,<?php echo $row->id ?>)"> <option value="Payment Due">Payment Due</option> <option value="Payment completed">Payment Completed</option> </select> </td> <div id="status"></div> <?php } ?>