Get Woocommerce customer details by AJAX and populate it to Gravity Forms form

Question

I need to get customer details (customer data available on a profile page) and populate it on Gravity Form form when needed.

So far I realized I need something like described here, but for some reason my javascript is not returning data as expected. Here is my code:

jQuery(document).ready(function() {
    // form pre-population when "I am the Insured* entity" checkbox is checked
    if ( !globals.logged_in ) { 
        jQuery('li#field_1_160').remove();
    } else {
        jQuery('#choice_1_160_1').change(function() {
            console.log('customer data: change ');
            if(jQuery(this).is(":checked")) {
                console.log('customer data: checked ');

                var data = {
                    user_id:      globals.userID,
                    type_to_load: 'billing',
                    action:       'woocommerce_get_customer_details',
                    // security:     woocommerce_admin_meta_boxes.get_customer_details_nonce
                };

                jQuery.ajax({
                    url: globals.ajax_url,
                    data: data,
                    type: 'POST',
                    success: function( response ) {
                        var info = response;
                        console.log('customer data: ' + response);
                    },
                    error: function() {
                        console.log('An error occurred');
                    }
                    });
            } else {
                console.log('customer data: unchecked ');
            }
        });
    } 
});

And here is what I get in console when I click the checkbox (id choice_1_160_1):

wpchris.com.js?ver=1.0:68 customer data: change 
wpchris.com.js?ver=1.0:71 customer data: checked 
wpchris.com.js?ver=1.0:87 customer data: -1

I believe the problem is somewhere with the line I commented out:

// security:     woocommerce_admin_meta_boxes.get_customer_details_nonce

and I did this because it runs into an error:

Uncaught ReferenceError: woocommerce_admin_meta_boxes is not defined

I saw in the Woocommerce code that it uses woocommerce_admin_meta_boxes object in few places (for example in woocommerce\assets\js\admin\meta-boxes-order.js:119) but for some reason I can't.

Any help would be appreciated.

score 1 · Accepted Answer · answered Jul 23 '15 at 12:29

OK, the solution is pretty simple - on PHP side I just need to use wp_create_nonce() to create and add it as variable to javascript:

   $globals = array(
       'userID' => $userID,
       'get_customer_details_nonce' => wp_create_nonce('get-customer-details')
   );

   wp_localize_script( 'wpchris-customization-js', 'globals', $globals );

Now, on Javascript part I can use this nonce:

       var data = {
            user_id:      globals.userID,
            type_to_load: 'billing',
            action:       'woocommerce_get_customer_details',
            security:     globals.get_customer_details_nonce
        };

Get Woocommerce customer details by AJAX and populate it to Gravity Forms form

1 Answers1