2014-11-07 2 views
1

Здравствуйте, я столкнулся с проблемой при кодировании в Javascript и PHP (Ajax non jquery). Я пытаюсь загрузить файл через Ajax и обрабатывать его в PHP.Ajax действует как метод GET, хотя метод POST

Это мой код:

index.html

<html> 
<head> 
<title>PHP AJAX Upload</title> 

<script type="text/javascript"> 


function upload() { 
    // 1. Create XHR instance - Start 
    var dat= "bla"; 
    document.getElementById("div2").innerHTML = "working"; 
    if (window.XMLHttpRequest) { 
     xhr = new XMLHttpRequest(); 
    } 
    else if (window.ActiveXObject) { 
     xhr = new ActiveXObject("Msxml2.XMLHTTP"); 
    } 
    else { 
     throw new Error("Ajax is not supported by this browser"); 
    } 

    var rad = document.getElementById('fajl'); 
    var filee = rad.files[0]; 

    var formData = new FormData(); 
    formData.append('rad',filee) 
    formData.append('var',dat) 

    xhr.open('POST', 'upload.php'); 


    xhr.send(formData); 

    xhr.onload = function() { 
     if (xhr.readyState === 4 && xhr.status == 200) { 

       document.getElementById("div2").innerHTML = xhr.responseText; 
       //alert(xhr.readyState); 
       //alert(xhr.status); 
      }  
    } 
} 

</script> 
</head> 
<body> 

<form id="uploadForm" enctype="multipart/form-data"> 
<label>Upload File:</label><br/> 
<input name="rad" id="fajl" type="file" class="inputFile" /> 
<input type="submit" value="Submit" class="btnSubmit" onclick="upload()" /> 
<div id="div2"> 
</div> 

</form> 
</body> 
</html> 

upload.php

<?php 

if(is_array($_FILES)) { 
if(is_uploaded_file($_FILES['rad']['tmp_name'])) { 
$sourcePath = $_FILES['rad']['tmp_name']; 
$targetPath = "images/".$_FILES['rad']['name']; 
if(move_uploaded_file($sourcePath,$targetPath)) { 
echo ("uspjeh<br>"); 

}} 
} 
$podatak=$_POST['var']; 
echo "$podatak" 

?> 

Проблема заключается в том, что я не вижу ответа PHP скрипт в моем div2 элементе. Ajax ведет себя странно, и это меня озадачивает. Я добавил команду оповещения JavaScript в состояние xhr.readyState (теперь прокомментировано). Когда я это делаю, я вижу результат, но когда я закрываю диалоговое окно предупреждения, браузер автоматически перезагружает страницу и делает URL-адрес, как я использую метод GET (я использую POST), а затем вывод сервера исчезает. (Радиан в? Радиан = ... это имя моего входного элемента)

enter image description here

Когда я не использую команду предупреждения, то я не вижу выхода вообще, потому что страница перенаправляет очень быстро. Что я имею в виду?

ответ

1

Это потому, что вы используете кнопку отправки, и она отправляет форму. По умолчанию формы - это запросы GET. Вместо этого следует изменить только одну кнопку:

<input type="button" value="Submit" class="btnSubmit" onclick="upload()" /> 
+0

работает, спасибо :) –

1

Выполняется действие по умолчанию (подача).

Чтобы остановить это добавить return false в свой клик обработчика:

onclick="upload(); return false;" 
+0

спасибо вам обоим, если бы я мог принять оба ответа ... или, по крайней мере, до голосования, но я не» у меня еще есть репутация :) –

+0

Без проблем, рад, что я могу помочь вам – Steve

Смежные вопросы