Reply To: acf-form() in ajax call : how to fire the action ?

• Cloud Nine

• May 13, 2016 at 6:12 pm

Hello,

Thank your for your reply.

The modal is in the main page and the content is loaded with an ajax call. I use wordpress ajax :

php :

function load_acf_form_ajax() {

    // variables
    if (!empty($_POST['fields_key']) && !empty($_POST['user_id'])) {
        $fields_key = $_POST['fields_key'];
        $user_id = $_POST['user_id'];

        // formulaire ACF form
        $options = array(
            'post_id' => 'user_' . $user_id, // $user_profile,
            'fields' => array($fields_key),
            'form' => true,
            'submit_value' => 'Valider'
        );

        acf_form($options);
        
        
    } else {
        echo 'erreur';
    }

    get_template_part('templates/modal-edit-acf');

    die();
}

JS :

jQuery.post(
                        ajaxurl,
                        {
                            'action': 'load_acf_form_ajax',
                            'fields_key': $field_key,
                            'user_id': <?php echo $user_id_parameter; ?>
                        },
                        function (response, status) {
                            //console.log(response);
                            $('#modal_content').html(response);
                            console.log('status : ' + status);

                            if (status === 'success') {
                                console.log('acf.do_action');
//                                acf.do_action('ready', $('#modal_content'));
//                                acf.do_action('load', $('#modal_content'));
//                                acf.fields.wysiwyg.initialize();
                                acf.do_action('append', $('#modal_content'));
//                                $(document).trigger('acf/setup_fields', $('#modal_content'));
                            } else {
                                $('#modal_content').html(status);
                            }
                        }
                );

Eliot helped me to debug this.

It was simple (i don’t know how i could miss it).

The solution is : trigger the ‘append’ action within the ajax success function after you have appended your HTML

So, now it works but i still have issue with the wysiwyg editor, or the datepicker.

It is due to missing JS files on the page because form is run within an AJAX call.

I know i have to add acf_enqueue_uploader(); but it still doesn’t wok.

Regards,

Sébastien