获取文件上载表单的Ajax PHP响应

时间:2016-11-08 10:15:55

标签: php jquery ajax wordpress

我创建了一个带有文本字段的上传表单,用于在Wordpress中从前端创建自定义帖子。

请求正在运行,但在上传文件时,我无法在ajax中收到响应消息。如果没有上传文件且只设置了文本字段,那么我会收到回复。

这是我的ajax表格:

//upload-form.js
_submit: function (event) {
        event.preventDefault();

        this.$submitButton.prop('disabled', true);

        var $formdata = false;
        var $form = this.$form;

        if (window.FormData) {
            $formdata = new FormData();
        }
        var $files_data = this.$upload;

        if ($files_data.val() == '') {
            $formdata.append('fields', $form.serialize());
        } else {
            $.each($($files_data), function (i, obj) {
                $.each(obj.files, function (j, file) {
                    $formdata.append('files[' + j + ']', file);
                    $formdata.append('fields', $form.serialize());
                })
            });
        }

        $formdata.append('action', 'upload_form_submit');
        $formdata.append('nonce', upload.form_nonce);

        $.ajax({
            url: upload.ajaxurl,
            type: 'POST',
            data: $formdata,
            dataType: "json",
            async: false,
            success: this._success.bind(this),
            error: this._error.bind(this),
            cache: false,
            contentType: false,
            processData: false
        });

        return false;
    },

    _success: function (jsonResponse) {

        var response = jsonResponse;

        if (response.type == 'success') {

            // Clear fields
            this.$fields.val('');
            this.$submitButton.prop('disabled', true);

            // Show message
            if (response.message) {
                $('.response-success').text(response.message);
            }
        } else {
            this._error(response.message);
        }

        return jsonResponse;
    },

    _error: function (error) {

        this.$submitButton.prop('disabled', false);

        // Show message
        if (error) {

            if (typeof error === 'object') {
                $('.response-success').text(error.statusText);
            } else {

                // Custom error
                $('.response-success').text(error);

                this.$form.find('*[required]').each(function (i, elem) {
                    var $elem = $(elem);
                    if (!$elem.val()) {
                        $elem.parent().addClass('empty-field');
                    }
                });
            }

        }
    }

我的PHP回复

/**
 * Callback to validate AJAX request
 */
public function ajax_submit_form() {
    check_ajax_referer( 'form_submit', 'security' );

    if ( !isset( $_POST['fields'] ) ) {
        return;
    }

    $json = array();

    // Parse $.serialize()
    parse_str( $_POST['fields'], $this->_post_fields );

    // Check if required fields are not empty
    if ( $this->is_valid_data() ) {
        // save posts
        if ( $this->handle_frontend_new_post_form_submission() ) {
            $json['type']    = 'success';
            $json['message'] = $this->_notices['post_sent'];
        } else {
            $json['type']    = 'error';
            $json['message'] = $this->_notices['post_not_sent'];
        }
    } else {
        $json['type']    = 'error';
        $json['message'] = $this->_notices['empty_fields'];
    }


    die( wp_json_encode( $json ) );
}

0 个答案:

没有答案