Javascript Ajax FormData

Question

나는이 코드를 사용하여 양식 값을 PHP 파일로 보내는 방법을 설명합니다.

<form role="form" id="upload_form" method="post" enctype="multipart/form-data"> 

    <div class="form-group"> 
    <label for="formlabel">Title</label> 
    <input class="form-control" name="title" id="title" placeholder="Enter Software Name" type="text" value="<?php if(isset($title)){echo $title;}?>" required> 
    </div> 

    <div class="form-group"> 
    <label>Short Meta Description atleast 155 words</label> 
    <textarea class="form-control" name="shortdec" id="shortdec" rows="3" required><?php if(isset($shortdec)){echo $shortdec;}?></textarea> 
</div> 


    <div class="form-group"> 
    <label>File input</label> 
    <input name="softpost" id="softpost" type="file" required> 
</div> 


    <input type="button" value="Upload File" onclick="uploadFile()"> 
     <progress id="progressBar" value="0" max="100" style="width:300px;"></progress> 
     <h3 id="status"></h3> 

나는 또한 제목과 shortdec id 값을 보내려하지만, 자바 스크립트 파일 작업 파일 데이터 벌금

도 수행하는 방법을 가르쳐주십시오 그것을

var formdata = new FormData(); 
    formdata.append("softpost", file); 

Answer 1

내가 바로 당신을 이해한다면, 당신은 파일과 함께 "정상적인"것들을 보내고 싶다.

음, 슈퍼 쉬운 : 그거야

formdata = new Formdata(); 
formdata.append('softpost', file) 
formdata.append('name', 'My super file') 

은!

매트

당신은이 작업을 수행 할 수

Answer 2

,

jQuery를

$("form#upload_form").submit(function(){ 
    //Fetch Form Data i.e it will include all the form elements including file and other form inputs 
    var formData = new FormData($(this)[0]); 
    .........AJAX CALL........... 
    return false; 
}); 

자바 스크립트

var form = document.getElementById("upload_form"); 
var formData = new FormData(form); 

그냥 new FormData($(this)[0]);를 사용 양식 필드를 가져 와서 정상적인 AJAX 호출을 진행하십시오. 이제 백엔드 PHP 코드에서 제목, 파일 및 설명 요소를 가져올 수 있습니다. [jQuery.ajax와 다중/formdata 전송]의