通过Ajax加载Gravity Form会导致

时间:2017-10-30 15:27:03

标签: php jquery ajax wordpress gravityforms

我正在尝试通过Ajax加载重力表单。我在另一个javascript的用户操作期间加载了表单。只要表单上有日期字段,表单就会加载并完美提交。一旦我从表单中删除日期字段,我就会收到此错误:

未捕获的ReferenceError:未定义gformInitSpinner

我已经尝试了js error on gravity forms中建议的解决方案,但无法解决问题。

<?php 
function plc_ajax_get_form(){

    $available_forms = [
        'Create Opponent',
        'Simple'
    ];

# To Do:    
# make sure that the user has permission

    if (isset ($_POST['form']) && in_array ($_POST['form'], $available_forms)) {
        $f = PLCForms::get($_POST['form']);  // <- Custom method just to get the form id by name.
        # gravity_form_enqueue_scripts ($f->id, true); // This method doesn't work
        gravity_form ($f->id, true, false, false, false, true);
    }
    else {
        print 'No form found.';
    }   
    die;    
}
add_action ('wp_ajax_plc_get_form', 'plc_ajax_get_form');

Ajax脚本

(function ($) {

    window.testCall = function (form, name, val) {
        var data = {
            action: 'plc_get_form',
            security : PLCGetForm.security,
            form: form
        };

        $.post (PLCGetForm.ajaxurl, data, function (response) {
            $('body').append('<div class="lb-form" style="background: white;width: 100%;position: absolute;top: 50px;z-index:1000;">' + response + '</div>');

            $('.lb-form form input[name="' + name + '"]').val(val);

            processLBForm (form, testCallback);

        });
    };

    window.testCallback  = function (data) {
        console.log (data);
    };

    window.processLBForm = function (form, callback) {

        $('.lb-form form').submit(function (e){
            e.preventDefault();
            var data = {
                action: 'plc_gf_submit',
                security: PLCGFSumbit.security,
                form: form,
                data: $(this).serializeArray()
            };
            $.post (PLCGFSumbit.ajaxurl, data, function (response) {

                data = JSON.parse(response);
                $('.gform_ajax_spinner').remove();

                if (data.is_valid) {
                    $('.lb-form form .gform_heading, .lb-form form .gform_body, .lb-form form .gform_footer, .lb-form form .validation_error').remove();
                    var m = '';
                    if (typeof (data.confirmation_message) == 'string') {
                        m = data.confirmation_message;
                    }
                    else {
                        m = 'Your data was saved.';
                    }
                    m = '<div id="gform_confirmation_wrapper_2" class="gform_confirmation_wrapper "><div id="gform_confirmation_message_2" class="gform_confirmation_message_2 gform_confirmation_message">' + m + '</div></div>';
                    $('.lb-form form').append (m);
                    if (typeof (callback) === 'function') {
                        callback (data);
                    }
                }
                else if (typeof(data.validation_messages) == 'object') {
                    var m = '';
                    $('.lb-form form .validation_error').remove();
                    $('.lb-form form .validation_message').remove();
                    for (var key in data.validation_messages) {
                        // Skip loop if the property is from prototype
                        if (!data.validation_messages.hasOwnProperty(key)) continue;
                        $('.lb-form form input[name="input_' + key + '"]').parents('.gfield').addClass('gfield_error');
                        $('.lb-form form input[name="input_' + key + '"]').parents('.gfield').append('<div class="gfield_description validation_message">' + data.validation_messages[key] + '</div>');
                    }
                    $('.lb-form form .gform_heading').after ('<div class="validation_error">There was a problem with your submission. Errors have been highlighted below.</div>');
                    $('.lb-form form input[type="submit"]').click(function(){
                        $('.lb-form form').submit();
                    });
                }
                else {
                    $('.lb-form form .validation_error').remove();
                    $('.lb-form form .gform_heading').after ('<div class="validation_error">There was a problem with your submission. No validation messages were set.  Please contact your admin.</div>');
                    $('.lb-form form input[type="submit"]').click(function(){
                        $('.lb-form form').submit();
                    });
                }
            });
        });     
    };

})(jQuery);

初始化脚本

(function ($) {
    $(document).ready(function(){
        testCall('Simple', 'input_1', 'test');
    });
})(jQuery);

有没有人知道日期字段对脚本的不同做法是什么?非常感谢任何帮助,谢谢。

更新

带有日期字段的表单是页面上的另一个表单...我刚刚意识到它不是通过ajax调用的那个...所以我需要找到已经通过a加载的页面中的差异短代码,似乎使ajax形式起作用。将ajax添加到短代码中是行不通的。

[gravityform id="2" title="true" ajax="true"]

如果找到脚本,将会更新。感谢。

1 个答案:

答案 0 :(得分:0)

重力形式js未加载,因为我怀疑,但是从错误的位置调用 gravity_form_enqueue_scripts($ f-&gt; id,true); 。它需要从加载表单的页面调用,而不是在ajax的表单本身上调用。

function plc_enqueue_scripts_styles ($hook) {
    gravity_form_enqueue_scripts (16, true); // Ajaxed form id = 16
}
add_action ('wp_enqueue_scripts', 'plc_enqueue_scripts_styles');