在Wordpress插件开发中使用JQuery发布从前端到后端的文件上传

时间:2018-09-13 08:47:54

标签: php jquery wordpress

我开发了一个wordpress插件,我有一个表单(简码),我想在其中将图像路径上传到数据库MySQL中并上传到文件夹中。而且我正在使用JQuery传递值,以便可以在后端使用它来插入数据库。我担心的是,应该使用什么将图像上传到自定义文件夹上传并将路径保存到数据库?我尝试使用FormData进行操作,但是没有用。

这是表单(form.php)的一部分:

    <div id="property-status"></div>
    <form id="add-form" method="post" action="" enctype="multipart/form-data">
        <div class="row">
         <div class="form-group">
                    <label>Select image to upload</label>
                    <input type="file" id="file_img" name="file_img" required/>
                </div>
 <button type="submit" class="btn btn-primary" name="submit" value="Submit" id="submit_form">Submit
                </button>
                <label id="label"></label>
            </div>
</form>

这是JQuery(main.js):

$("#add-form").on("submit", function (e) {
    e.preventDefault();

    $(this).hide();
    $("#property-status").html('<div class="alert alert-info text-center">Please wait!</div>');

    var selected = $("#radiobox input[type='radio']:checked");


    var form = {
        action: "r_submit_user_property",
        county: $("#county").val(),
        price: $("#price").val(),
        property_type: $("#property_type").val(),
        sale_rent: selected.val(),
        id: $("#custId").val(),


    };

    $.post(recipe_obj.ajax_url, form).always(function (response) {
        if (response.status == 2) {
            $('#property-status').html('<div class="alert alert-success">Property submitted successfully!</div>');
        } else {
            $('#property-status').html(
                '<div class="alert alert-danger">Unable to submit property. Please fill in all fields.</div>'
            );
            $("#add-form").show();
        }
    });

这是我从JQuery(r_submit_user_property)(process-form.php)传递的值的地方

function r_submit_user_property()
{

    global $wpdb;

    $output               = ['status' => 1];
    $id                   = $_POST['id'];
    $county               = sanitize_text_field($_POST['county']);
    $country              = sanitize_text_field($_POST['country']);
    $town                 = sanitize_text_field($_POST['town']);
    $postcode             = sanitize_text_field($_POST['postcode']);



    $data_array = [
        'county'               => $county,
        'country'              => $country,
        'town'                 => $town,
        'postcode'             => $postcode,
    ];


    $id_array = ['id' => $id];

    if ($id > 0) {
        $wpdb->update($wpdb->prefix . 'property', $data_array, $id_array, $format = null);
    } else {

        $wpdb->insert($wpdb->prefix . 'property', $data_array, $format = null);

    }
    $output['status'] = 2;
    wp_send_json($output);

}

1 个答案:

答案 0 :(得分:0)

如何使用Ajax以WordPress的形式上传文件。 有多种方法可以定义如何处理文件上传: 使用WordPress API – wp_handle_upload,它将使用已定义的

上传文件
  • 上传结构。默认结构是上传中的年/月 文件夹。

  • 使用WordPress API – media_handle_upload将上传文件 并在数据库中创建附件,以便上传的文件 可以在WordPress管理内看到

  • 使用纯PHP创建自定义上传器

https://www.ibenic.com/wordpress-file-upload-with-ajax/