2016-04-01 15 views
0

要件応答ファイルをダウンロードします。投稿テキストファイルと

私は、ファイルの種類の入力を持つPHPファイル内のフォームを提出する必要があります。私はこのテキストファイルを投稿するにはjQuery ajaxが必要です。processFile.php

processFile.phpはこのテキストファイルを入力として受け取り、処理後にクライアントでダウンロードしたいcsvファイルを返します。

私は多くの投稿を見ましたが、何も私を助けてくれません。

HTML:

<form id="utilityForm" class="utilityForm4" method="POST" enctype="multipart/form-data" style="margin-top:25px"> 
     <input type="file" name="image" id="image"/> 
     <br/><input type="submit" name="download" class="submit" value="Submit"/> 
    </form> 

のjQuery:

$(document).ready(function(){ 
     $(".submit").click(function(e){ 
var urlstring = "processFile.php" 
      var form_data = new FormData($(this)[0]); 
      $.ajax({ 
       url : urlstring, 
       type: "POST", 
       data : postData, 
       success:function(result){ 
         var uri = 'data:application/csv;charset=UTF-8,' + encodeURIComponent(result); 
         window.open(uri, 'result.csv'); 
       }, 
       error: function(jqXHR, textStatus, errorThrown) 
       { 
        alert('failed'); 
        echo (errorThrown); 
       } 
      }); 
     }); 
}); 

私はネット上で与えられたソリューションの何百ものを試してみましたが、どれも作業していません。

+0

表示されているエラーは何ですか? – ahb

答えて

1

ここで私は完全な作業例を提供しています:

HTMLファイル:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function (e) { 
    $("#uploadimage").on('submit',(function(e) { 
     e.preventDefault(); 

     $.ajax({ 
     url: "ajax_php_file.php", // Url to which the request is send 
     type: "POST",    // Type of request to be send, called as method 
     data: new FormData(this), // Data sent to server, a set of key/value pairs (i.e. form fields and values) 
     contentType: false,  // The content type used when sending data to the server. 
     cache: false,    // To unable request pages to be cached 
     processData:false,  // To send DOMDocument or non processed data file it is set to false 
     success: function(result) // A function to be called if request succeeds 
     { 
       e.preventDefault(); //stop the browser from following 
       window.location.href = 'upload/'+result; 
     } 
     }); 
    })); 

// Function to preview image after validation 

}); 
</script> 
</head> 

<body> 

<form id="uploadimage" action="" method="post" enctype="multipart/form-data"> 
<a href='#' id="tmpcsv" style="display:none">Download</a> 
<input type="file" name="file" id="file" required /> 
<input type="submit" value="Upload" class="submit" /> 
</form> 
</body> 

PHPファイル:

<?php 
if(isset($_FILES["file"]["type"])) 
{ 
    $temporary = explode(".", $_FILES["file"]["name"]); 
    $file_extension = end($temporary); 

    if (file_exists("upload/" . $_FILES["file"]["name"])) 
    { 
     echo $_FILES["file"]["name"] . " <span id='invalid'><b>already exists.</b></span> "; 
    } 
    else 
    { 
     $sourcePath = $_FILES['file']['tmp_name']; // Storing source path of the file in a variable 
     $targetPath = "upload/".$_FILES['file']['name']; // Target path where file is to be stored 
     move_uploaded_file($sourcePath,$targetPath) ; // Moving Uploaded file 
     echo $_FILES["file"]["name"]; 
    } 
} 
else 
{ 
    echo "<span id='invalid'>***Invalid file Size or Type***<span>"; 
} 
?> 

は、任意のファイルをアップロードしてください。 これはあなたにとって便利ですか?

+0

お返事ありがとうございます。しかし、大きな問題は、入力ファイルがprocessFile.phpに送信されていないことです。 jQueryは何らかの形でファイルタイプの入力をPHPファイルに投稿できません。 –

+0

ありがとうございました。それは若干のマイナーチェンジで動作しました。もう一度ありがとう:) –

+0

ようこそ。私の答えがあなたにとって有用だったなら押してください。 – KinjalB

関連する問題