I’m new to ajax, but I really want to learn. I have set up a form (formidable pro) which is submitted via ajax. In the submit button I have on onclick function:
<div class="frm_submit">
<input id="btn-max-hyp" onclick="add_customer()" type="submit" value="[button_label]" [button_action] />
<img class="frm_ajax_loading" src="[frmurl]/images/ajax_loader.gif" alt="Sending"/>
</div>
My custom js file:
jQuery(document).ready(function($){
$('#form_maxhyp').on("submit", add_customer);
function add_customer () {
var form_maxhyp = $(this).serialize();
$.ajax({
type:"POST",
url: frontendajax.ajaxurl,
data: form_maxhyp,
success: function(data)
{
$("#test").html(data);
}
});
return false;
}
});
And last the code in my function.php
<?php
add_action( 'wp_enqueue_scripts', 'add_frontend_ajax_javascript_file' );
function add_frontend_ajax_javascript_file()
{
wp_enqueue_script( 'ajax_custom_script', get_stylesheet_directory_uri() . '/ajax-javascript.js', array('jquery') );
wp_localize_script( 'ajax_custom_script', 'frontendajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));
}
add_action('wp_ajax_add_customer', 'add_customer');
add_action('wp_ajax_nopriv_add_customer', 'add_customer');
function add_customer($entry_id, $form_id)
{
if ( $form_id == 6 )
{
global $wpdb, $frmdb;
$form1 = '6';
$value = $_POST['item_meta'][222];
/* a lot of if and else statements */
/* Echo values */
echo "'".$value. "'";
}
die();
}
I want to set the value to my div.
In the console log I get an error: ReferenceError: add_customer is not defined.
Probably it’s something really simple that I’m just not seeing. What I’m I doing wrong here?
in your custom js file you have this :
jQuery(document).ready(function($){
$('#form_maxhyp').on("submit", add_customer);
in this case
add_customer
is read as a variable.change it to this:
jQuery(document).ready(function($){
$('#form_maxhyp').on("submit", add_customer());
to make the call to your function!