Wordpress insert ,update,delete data with admin ajax

Wordpress insert ,update,delete data with admin ajax

First, I am going to add one form in wordpress, just create new page and then theme folder I am going to add one template as following………………

<?php /* Template Name: Productsetup */ ?>

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<script>

jQuery(document).ready(function($) {

         

});

function ajaxSubmit(){

alert();

var name= $('#name').val();

var email= $('#email').val();

var phone= $('#phone').val();

var url= $('#url').val();

var remarks= $('#remarks').val();

var data = {

                   'action': 'contactform',

                   'phone': phone,      // We pass php values differently!

                   'email': email,      // We pass php values differently!

                   'name': name,      // We pass php values differently!

                   'url': url,      // We pass php values differently!

                   'remarks': remarks      // We pass php values differently!

          };

          // We can also pass the url value separately from ajaxurl for front end AJAX implementations

          jQuery.post('http://localhost/wordpress_project/wp-admin/admin-ajax.php ', data, function(response) {

                   alert('Got this from the server: ' + response);

                   console.log(data);

          });

return false;

}

</script>

<div class="container"> 

    <h3>Quick Contact</h3>

    <h4>Contact us today, and get reply with in 24 hours!</h4>

    <fieldset>

      <input placeholder="Your name" type="text" name="name" id="name" tabindex="1" required autofocus>

    </fieldset>

    <fieldset>

      <input placeholder="Your Email Address" type="text" name="email" id="email" tabindex="2" required>

    </fieldset>

    <fieldset>

      <input placeholder="Your Phone Number" type="tel" name="phone" id="phone" tabindex="3" required>

    </fieldset>

    <fieldset>

     <!-- <input placeholder="Your Web Site starts with http://" type="url" tabindex="4" required>-->

            <input placeholder="Your Web Site starts with http://" type="text" id="url" name="url" tabindex="4" required>

    </fieldset>

    <fieldset>

      <textarea placeholder="Type your Message Here...." name="remarks" id="remarks" tabindex="5" required></textarea>

    </fieldset>

    <fieldset>

      <button name="submit" type="submit" onclick="ajaxSubmit()" id="contact-submit" data-submit="...Sending">Submit</button>

    </fieldset>

 <br/><br/>

<div id="feedback"></div>

<br/><br/>

 

</div>

And theme folder I will call those data into the function.php page:

/** insert data into mysql table **/

wp_enqueue_script('jquery');

add_action('wp_ajax_contactform', 'contactform');

add_action('wp_ajax_nopriv_contactform', 'contactform'); // not really needed

function contactform(){

global $wpdb;

$name = $_POST['name'];

$phone = $_POST['phone'];

$email = $_POST['email'];

$url = $_POST['url'];

$remarks = $_POST['remarks'];

if($wpdb->insert('customers',array(

'name'=>$name,

'phone'=>$phone,

'email'=>$email,

'url'=>$url,

'remarks'=>$remarks

))===FALSE){

echo "Error";

}

else {

echo "Customer '".$name. "' successfully added, row ID is ".$wpdb->insert_id;

}

die();

}