I have the following code in HTML AJAX. What I want is to get the echo results from the php script on the same page that the ajax called not generating blank pages. Please check my code below:
<form id="form1" name="form1" method="post" action="/" enctype="multipart/form-data">
<select id="machine" name="machine" class="field" onChange='addaction(this.value)'>
<option value="" selected="selected">Choose..</option>
<option value="machine1.php">Machine 1</option>
<option value="machine2.php">Machine 2</option>
</select>
</fieldset>
<fieldset>
<legend><strong>Select a file to upload</strong></legend>
<input type="file" id="files" name="files[]" size="40" multiple="multiple" />
<br />
<p></p>
<input type="submit" value="Upload File" id="upload" />
<br />
<br />
</form>
<div id="information"></div>
</fieldset>
<fieldset>
<legend><strong>Uploaded Files</strong></legend>
<div id="uploaded"></div>
</fieldset>
<script type="text/javascript">
function addaction(actionvalue){
$("#form1").attr("action",actionvalue);
};
Any help would be much appreciated.
The php script part:
set_time_limit(0);
if(isset($_FILES['files']))
{
foreach($_FILES['files']['tmp_name'] as $key => $tmp_name)
{
$file_name = $key.$_FILES['files']['name'][$key];
$file_size = $_FILES['files']['size'][$key];
$file_tmp = $_FILES['files']['tmp_name'][$key];
$file_type = $_FILES['files']['type'][$key];
if($file_size > 10000000) //10mb
{
echo "<script>alert('File exceeds file size')</script>";
}
if($file_type == "text/plain")
{
$i = 0;
$file = fopen($file_tmp,"r");
while(($data = fgetcsv($file, 1000, "\t"))!=FALSE)
{
if($i > 0)
{
$data[0] = "";
$data[1] = "";
$data[3] = "";
$data[4] = "";
$data[5] = "";
unset($data[0],$data[1],$data[3],$data[4],$data[5]);
$line[] = $data;
}
$i++;
}
fclose($file);
$j = 0;
foreach($line as $value)
{
$newline = explode(" ",$value[6]);
$date = trim($newline[0]);
$time = trim($newline[2]);
$newtime = date("H:i",strtotime($time));
try{
$query = $con->prepare("INSERT IGNORE INTO temp_logs(EmpID, ValidDate, ValidTime)VALUES(:id,:ddate,:time)");
$query->bindParam(':id',$value[2]);
$query->bindParam(':ddate',$date);
$query->bindParam(':time',$time);
$query->execute();
}
catch(PDOException $e){
echo $e->getMessage();
exit;
}
$j++;
echo $j . " row(s) processed.";
echo str_repeat(' ',1024 * 64);
flush();
sleep(0);
}
}
echo "Process completed";
}
}
I tried this code but it seems it doesn't work:
$('body').on('click','#upload',function(e){
e.preventDefault();
var page = $('#machine option:selected').val();
var formData = new FormData($(this).parents('form')[0]);
$.ajax({
url: page,
type: 'POST',
xhr: function(){
var myXhr = S.ajaxSettings.xhr();
return myXhr;
},
success: function (data){
alert("Data Uploaded: "+data);
},
data: formData,
cache: false,
contentType: false,
processData: false,
});
return false;
});