wordpress add_action() issue in ajax call

Question

After a hole day finding solution for the issue, i didn't get what is exactly i am making the mistake. Please give your valuable answer for my issue and humble request not to block if you can't answer.

so i am trying Ajax Call in WordPress and getting issue "Fatal error: Call to undefined function add_action() in C:\xampp\htdocs\brandcart\wp-content\themes\twentyten\functions.php on line 51"

WordPress : 4.1.1 Theme : Twenty-ten

Here is my code:

in Twenty-ten page.php

<input type="hidden" name="GreetingAll" id="GreetingAll" value="Hello Everyone!" />
    <input type="submit" id="PleasePushMe" />
 <div id="test-div1">
 </div>

in Twenty-ten functions.php

add_action( 'init', 'add_myjavascript' );
function add_myjavascript(){
  wp_enqueue_script( 'ajax-implementation.js', get_bloginfo('template_directory') . '/script/ajax-implementation.js', array( 'jquery' ) ); 
  }
 // creating Ajax call for WordPress  
add_action( 'wp_ajax_nopriv_MyAjaxFunction', 'MyAjaxFunction22' );
 add_action( 'wp_ajax_MyAjaxFunction', 'MyAjaxFunction22' );    
  function MyAjaxFunction22(){
  //get the data from ajax() call
   $GreetingAll = $_POST['GreetingAll '];
   $results = "<h2>".$GreetingAll."</h2>";
  // Return the String
   die($results);
  }

and my ajax-implementation.js (which is in script directory in the theme)

jQuery(document).ready(function() {
  var GreetingAll = jQuery("#GreetingAll").val();
jQuery("#PleasePushMe").click(function(){ jQuery.ajax({
  type: 'POST',
  url: 'http://localhost/brandcart/wp-content/themes/twentyten/functions.php',
  data: {
  action: 'MyAjaxFunction',
  GreetingAll: GreetingAll,
  },
  success: function(data, textStatus, XMLHttpRequest){
  jQuery("#test-div1").html('');
  jQuery("#test-div1").append(data);
  },
  error: function(MLHttpRequest, textStatus, errorThrown){
  alert(errorThrown);
  }
  });
  });

});

Answer 1

You're sending your AJAX request to the wrong place. Of course calling functions.php directly will get you undefined function errors, because the WordPress API isn't loaded by functions.php ( it's the other way round ). A car doesn't make fuel go forward, fuel makes a car go forward, simply getting in the car won't make fuel magically appear, in the same way loading functions.php won't magically make all the WordPress APIs appear.

Also, using files in your theme as AJAX and form submission endpoints is a huge security hole. Even if you change theme, those endpoints are still there, and can still be used.

So instead, use the official ajax endpoint:

http://codex.wordpress.org/AJAX_in_Plugins

When you enqueue your script, also localise a variable to pass the url of the endpoint to your javascript:

// in JavaScript, object properties are accessed as ajax_object.ajax_url, ajax_object.we_value
wp_localize_script( 'ajax-script', 'ajax_object',
        array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );

Then in your javascript, the endpoint will be:

ajax_object.ajax_url

A final note

All your work will be destroyed on the next update of twentyten. Instead of modifying the twentyten theme, create a child theme and put your modifications there. This way you can update the default themes without loosing any changes