Problem z wysłaniem formularza przez ajax

Dla specjalistów Webmastering
#1

Witam.

Tworzę prostą webową aplikację do notatek. Mam problem z wysłaniem danych z formularza na serwer przez ajax. Proszę o wyrozumiałość gdyż jestem w tym początkujący.

fragment pliku odbierającego:

$q="INSERT INTO notes VALUES(null,'$_POST[ntitle]','$_POST[narticle]','$_POST[sel]','1')";
function save(){
global $pdo;
    global $q;
    $qa=$pdo->query($q);
}
$q1=save();
echo $q;

a tu fragment pliku index:

<script>
		function send_form(){
			var formElement = document.querySelector("form");
			var xml = new XMLHttpRequest();
			xml.open("POST", "./php/save.php", true);
			xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
			xml.send(new formElement);
			
		}
		</script>
    </head>
	<body>
	<section class="edit-form">
			<form id="form"action="./php/save.php" method="post" onsubmit="send_form();return false;">
		 <select class="form-button" name="sel" id="sel">
		 <?php
		 require("php/ntclas.php");
		 $ntcl=new notes();
		 $st="<option>";$end="</option>";
		 $x=$ntcl->ctlist($st,$end);
		 ?>
    </select>
					<input type="submit" class="form-button"name="zapisz" value="zapisz"></input >
				<input type="text" name="ntitle" id="ntitle"></input>
				<textarea name="narticle" rows="10" id="narticle" ></textarea>
			</form>
		</section>

proszę o wskazanie błędów(pewnie jest ich kilka). Gdy używam pliku save.php bez ajax wszystko działa.

#2

Problemem jest to, że wysyłasz cały formularz, a nie dane. Poczytaj o $.POST.

#3

A czego konkretnie mam się dowiedzieć? Poza tym to widzę, że proponujesz użycie jquery, a ja nie chcę go używać w tym projekcie.

Wiem, że problem jest z tym obiektem odpowiedzialnym za przetwarzanie danych z formularza na tablicę.

 

 

Problem rozwiązany.

<script>
		function send_form(){
			var formElement = document.querySelector("form");
			var request = new XMLHttpRequest();
			request.open("POST", "./php/save.php");
			request.send(new FormData(formElement));
			
		}
		</script>

 

#4

Czy aż tak trudno poszukać w internecie?

 

var http = new XMLHttpRequest();
var url = "./php/save.php";
var params = "ntitle="+ document.getElementsByName("ntitle")[0].value +"&narticle=" + document.getElementsByName("narticle")[0].value;
http.open("POST", url, true);

//Send the proper header information along with the request
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.setRequestHeader("Content-length", params.length);
http.setRequestHeader("Connection", "close");

http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(params);