在WordPress中使用Ajax存储图像

时间:2017-06-29 02:33:22

标签: php ajax wordpress

我在使用ajax存储图片时遇到问题。即使我添加了一些参数,例如processData: falsecontentType: false,我只是在控制台中获得0。我认为问题是将数据从ajax传递给php。这就是我尝试过的:

AJAX

我只是想先存储Image ......

jQuery(document).ready(function($) {

$(".report-mem-btn a#submit-repot-mem-btn").click(function(event){  
    event.preventDefault();
    var reason_for_report           = $('select#reason-for-report').val();
    var additional_info             = $('textarea#additional-info').val();
    var get_rtmedia_file_details    = $('.report-member-form').find('input#file-evidence');
    var current_user_id             = $('input#current_user_id').val();
    var displayed_user_id           = $('input#displayed_user_id').val();
    console.log(get_rtmedia_file_details[0].files[0]);

    var formData = new FormData();
    var individual_file = get_rtmedia_file_details[0].files[0];
    formData.append('action', 'report_member_action');
    formData.append("file", individual_file);

    jQuery.ajax({
        type : "post",
        url : report_mail.ajax_url,
        dataType: 'json',
        processData: false,
        contentType: false,

        data: formData, 

         success: function(response) {              
             console.log('test: '+response);
         }
      }) 
});

});

PHP

add_action( 'wp_ajax_nopriv_report_member_action', 'report_member_action' );
add_action( 'wp_ajax_report_member_action', 'report_member_action' );

function report_member_action(){

$uploadedfile               = $_FILES['file'];


foreach( $uploadedfile as $file ) {
    if( is_array( $file ) ) {
        $attachment_id = upload_user_file( $file );
    }
}


//var_dump($_FILES);

//echo $uploadedfile;

echo 'Successfully Reported a Member, Thank you!';

exit();

}



function upload_user_file( $file = array() ) {
require_once( ABSPATH . 'wp-admin/includes/admin.php' );
  $file_return = wp_handle_upload( $file, array('test_form' => false ) );
  if( isset( $file_return['error'] ) || isset( $file_return['upload_error_handler'] ) ) {
      return false;
  } else {
      $filename = $file_return['file'];
      $attachment = array(
          'post_mime_type' => $file_return['type'],
          'post_title' => preg_replace( '/\.[^.]+$/', '', basename( $filename ) ),
          'post_content' => '',
          'post_status' => 'inherit',
          'guid' => $file_return['url']
      );
      $attachment_id = wp_insert_attachment( $attachment, $file_return['url'] );
      require_once(ABSPATH . 'wp-admin/includes/image.php');
      $attachment_data = wp_generate_attachment_metadata( $attachment_id, $filename );
      wp_update_attachment_metadata( $attachment_id, $attachment_data );
      if( 0 < intval( $attachment_id ) ) {
        return $attachment_id;
      }
  }
  return false;
}

1 个答案:

答案 0 :(得分:0)

Ajax Jquery是这样的:

jQuery(".updateprofile").on('click',function () {
          alert('helloo updateprofile');
          jQuery('#updatprofloader').css('display','block');
          var formData1 = new FormData(jQuery('#updatprofl')[0]);
          jQuery.ajax({
                           type : "POST",
                           url : ajaxurl,
                           data : formData1,
                           processData:false,
                           contentType: false
                 }).done(function(response) { 

                            /* var data = jQuery.parseJSON(response); */
                            alert(response);
                 });

表格代码是这样的:

<form action="javascript:void(0)" id="updatprofl" enctype="multipart/form-data">

          <div class="form-group">
            <label for="displaynm">Display Name : </label>
            <input type="text" name="displaynm" class="form-control" id="displaynm">
          </div>
          <div class="form-group">
            <label for="aboutme">About Me : </label>
            <textarea class="form-control" name="aboutme"  id="aboutme" placeholer="About Me"></textarea>
          </div>

          <div class="form-group">
          <label for="aboutme">Profile pic : </label>
            <div class="input-group">
                <label class="input-group-btn">
                    <span class="btn btn-primary">
                        Browse&hellip; <input type="file" name="profpicupload" style="display: none;" multiple>
                    </span>
                </label>
                <input type="text" class="form-control" readonly>
            </div>
          </div>
          <input type="hidden" name="action" value="ajax_updateprofile" />
          <input type="submit" name="updateprofile" class="btn btn-default updateprofile" value="Update Profile"/>
        </form>

在Functions.php中

add_action('wp_ajax_ajax_updateprofile', 'ajax_updateprofile');
 add_action('wp_ajax_nopriv_ajax_updateprofile', 'ajax_updateprofile');
 function ajax_updateprofile(){
    global $wpdb;
         $disnm = $_POST['displaynm'];

        echo $disnm;

  exit;
 }

如果您想要上传代码,可以在此网址上查看我的答案:Front End Upload Images Wordpress