JS - получить имя файла с Ajax

Question

Я пытаюсь получить расширение и имя файла с помощью Ajax.

Мой Аякса код выглядит следующим образом:

$.ajax({ 
    type: "POST", 
    url: url, 
    data: $("#updateMember").serialize(), 
    mimeType: "multipart/form-data", 
    contentType: false, 
    cache: false, 
    processData: false, 
    success: function (data) { 
     alert(data); 
    } 
}); 

В PHP У меня есть эта

$imageFileType = pathinfo($_FILES["input9"]["name"], PATHINFO_EXTENSION); 
echo $imageFileType; 

и мой HTML является

<form method="post" enctype="multipart/form-data" id="updateMember"> 
    <input id="input-9" name="input9" type="file" class="file file-loading" data-allowed-file-extensions='["png", "jpg", "gif", "jpeg"]' style="top: 0px;"> 
    <li class="menu__item"><input name="offerUpload" id="dashOffersBtn" class="menu__link menu_input btnDashboard" style="margin: 0 auto; height:20px;padding: 0;padding-bottom: 22px;width: 70%;" type="button" value="SAVE"></li> 
</form> 

, но это, кажется, не работает. Что я делаю не так?

Answer 1

Вы должны использовать FormData(), чтобы сделать это возможным, сериализацию или serializeArray() не поддерживает файл API, с помощью решения ниже:

Основного обновления для рабочего раствора

Я сделал обновление кнопки Сохранить-х тип с кнопкой представить, пожалуйста, используйте расположенную ниже HTML:

<form method="post" enctype="multipart/form-data" id="updateMember"> 
    <input id="input-9" name="input9" type="file" class="file file-loading" data-allowed-file-extensions='["png", "jpg", "gif", "jpeg"]' style="top: 0px;"> 
    <li class="menu__item"> 
    <input name="offerUpload" id="dashOffersBtn" class="menu__link menu_input btnDashboard" style="margin: 0 auto; height:20px;padding: 0;padding-bottom: 22px;width: 70%;" type="submit" value="SAVE"> 
    </li> 
</form> 

и использовать следующий код JQuery, чтобы заставить его работать

jQuery('#updateMember').submit(function(e){ 
      e.preventDefault(); 
      var data = new FormData(this); 
       $.ajax({ 
        type: "POST", 
        url: 'upload.php', 
        data: data, 
        mimeType: "multipart/form-data", 
        contentType: false, 
        cache: false, 
        dataType: "html", 
        processData: false, 
        success: function(data) { 
         alert(data); 
        } 
       }); 
     }); 

также использовать следующий код PHP для расширения:

$data = $_FILES['input9']; 
$data_ext = explode('/',$data['type']); 
$extension = $data_ext[1]; 
echo $extension; 

Мой тест index.php код

http://pastebin.com/L81xUbxL

Изменение Url Для вашей целевой URL.

Старого неработающий

var data = new FormData('#updateMember'); 
    $.ajax({ 
     type: "POST", 
     url: url, 
     data: data, 
     mimeType: "multipart/form-data", 
     contentType: false, 
     cache: false, 
     dataType: "html", 
     processData: false, 
     success: function(data) { 
      alert(data); 
     } 
    }); 

для получения расширения вы можете сделать это

$path_ = pathinfo($_FILES["input9"]["name"]); 
$extension = $path_['extension']; 
echo $extension;