Ajax in Wordpress form submission - php

Question

I'm following the page here - http://solislab.com/blog/5-tips-for-using-ajax-in-wordpress/#admin-ajax
So I have a simple form
<form role="form">
<div class="form-group">
<label class="">Name</label>
<input type="text" id="name" class="form-control" name="name" />
</div>
<div class="form-group">
<label class="">Email</label>
<input type="text" id="email" class="form-control" name="email" />
</div>
</form>
In functions.php I have
// embed the javascript file that makes the AJAX request
wp_enqueue_script( 'my-ajax-request', plugin_dir_url( __FILE__ ) . '/js/compiled/main.min.js', array( 'jquery' ) );
// declare the URL to the file that handles the AJAX request (wp-admin/admin-ajax.php)
wp_localize_script( 'my-ajax-request', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
add_action( 'wp_ajax_nopriv_myajax-submit', 'myajax_submit' );
add_action( 'wp_ajax_myajax-submit', 'myajax_submit' );
function myajax_submit() {
// get the submitted parameters
$name = $_POST['name'];
$email = $_POST['email'];
// generate the response
$response = json_encode( array( 'success' => true ) );
// response output
header( "Content-Type: application/json" );
echo $response;
// IMPORTANT: don't forget to "exit"
exit;
}
I'm using grunt to concatenate my js files which are then minified to /js/compiled/main.min.js
This minified file includes the js to validate the form and the post function.
The js
$atj(function(){
$atj('.js-training').click(function(e) {
//
e.preventDefault();
if(verfiyTrainingFields()) {
$atj.post(
MyAjax.ajaxurl,
{
action : 'myajax-submit',
firstName : $atj("#name").val(),
email : $atj("#email").val(),
},
function(response){
alert(response);
}
)
}
});
})
//Verfiy
function verfiyTrainingFields() {
var flag = true;
var name = $atj('#name');
var email = $atj('#email');
if(name.val().indexOf(' ') === -1 ){
name.parent().prepend('<p class="form-error">Please enter name, first space last</p>');
fadeOut();
flag = false;
}
if(!IsEmail(email.val())){
email.parent().prepend('<p class="form-error">Please enter valid email address</p>');
fadeOut();
flag = false;
}
return flag;
}
I'm getting an error in the console
Uncaught ReferenceError: MyAjax is not defined
UPDATE
add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
wp_register_script('scripts',get_template_directory_uri() . '/js/compiled/main.min.js', array('jquery'),1 ,true);
wp_enqueue_script('scripts');
//
wp_enqueue_script( 'my-ajax-request', plugin_dir_url( __FILE__ ) . '/js/compiled/main.min.js', array( 'jquery' ),'', true );
wp_localize_script( 'my-ajax-request', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ));
}