php - Using AJAX in a WordPress plugin -

i'm trying create wordpress sample plugin based in ajax. read tutorial , did plugin, it's not working. new ajax. here code tried:

<?php class ajaxtest {      function ajaxcontact() {         ?>         <div id="feedback"></div>         <form name="myform" id="myform">             <li>                 <label fname>first name</label><input type="text" id="fname" name="fname" value=""/>             </li>             <li>                 <label lname>last name</label><input type="text" id="lname" name="lname" value=""/>             </li>             <input type="submit" value="submit" id="submit" name="submit"/>         </form>         <script type="text/javascript">             jquery('#submit').submit(ajaxsubmit);              function ajaxsubmit() {                  var newcontact = jquery(this).serialize();                  jquery.ajax({                     type: "post",                     url: "/wp-admin/admin-ajax.php",                     data: newcontact,                     success: function(data) {                         jquery("#feedback").html(data);                     }                 });                  return false;             }         </script>         <?php     }      function addcontact() {         $fname = $_post['fname'];         if ($fname != "") {             echo "your data is" . $fname;         } else {             echo "data entered wrong";         }          die();     }  }  function jquery_add_to_contact() {     wp_enqueue_script('jquery');  // enqueue jquery that's built wordpress }  add_action('wp_enqueue_scripts', 'jquery_add_to_contact'); add_action('wp_ajax_addcontact', array('ajaxtest', 'addcontact')); add_action('wp_ajax_nopriv_addcontact', array('ajaxtest', 'addcontact')); // not needed add_shortcode('cform', array('ajaxtest', 'ajaxcontact')); 

i used shortcode, didn't output. what's mistake?

wordpress environment

first of all, in order achieve task, it's recommended register enqueue jquery script push request server. these operations hooked in wp_enqueue_scripts action hook. in same hook should put wp_localize_script it's used include arbitrary javascript. way there js object available in front end. object carries on correct url used jquery handle.

please take to:

1. wp_register_script(); function
2. wp_enqueue_scripts hook
3. wp_enqueue_script(); function
4. wp_localize_script(); function

in main plugin file, add these.

add_action( 'wp_enqueue_scripts', 'so_enqueue_scripts' ); function so_enqueue_scripts(){   wp_register_script( 'ajaxhandle', get_template_directory() . 'path script file', array(), false, true );   wp_enqueue_script( 'ajaxhandle' );   wp_localize_script( 'ajaxhandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin_ajax.php' ) ) ); } 

file: jquery.ajax.js

this file makes ajax call.

jquery(document).ready( function($){   //some event trigger ajax call, can push whatever data server, passing "data" object in ajax call   $.ajax({     url: ajax_object.ajaxurl, // object instantiated in wp_localize_script function     type: 'post',     action: 'myaction' // function in functions.php triggered     data:{        name: 'john',       age: '38'     },     success: function( data ){       //do result server       console.log( data );     }   }); }); 

also add these files in plugin main file too.

finally, on functions.php file, there should function triggered ajax call. remember suffixes:

1. wp_ajax ( allow function registered users or admin panel operations )
2. wp_ajax_nopriv ( allow function no privilege users )

these suffixes plus action compose name of action:

wp_ajax_myaction or wp_ajax_nopriv_myaction

add_action( 'wp_ajax_myaction', 'so_wp_ajax_function' ); add_action( 'wp_ajax_nopriv_myaction' 'so_wp_ajax_function' ); function so_wp_ajax_function(){   //do whatever want data posted   //to send response have echo result!   echo $_post['name'];   echo $_post['age'];   wp_die(); // ajax call must die avoid trailing 0 in response }