Formulier continue verzenden en direct ontvangen (jQuery / Ajax)
Code (php)
Nu wil ik tijdens het typen steeds dit formulier (alleen de textarea eigenlijk) wordt verzonden naar corrector.php.
Die geeft HTML terug.
Die HTML wil ik in p#output stoppen.
Nu lukt het wel om om met .ajax wat te versturen.
Maar opvragen lukt niet.
En al helemaal niet automatisch (mag bij onkeyup, maar liever met een interval van 500ms).
Kan iemand mij even helpen?
Ik zal nu even de code die ik heb opzoeken...
Toevoeging op 20/09/2012 17:23:41:
Komt ie:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$.Ajax({
type: "POST",
url: "corrector.php",
data: "input="+$("#input").text(),
success: function(msg){
alert( "Data Saved: " + msg );
}
});
var input = $("#input").text();
var request = $.ajax({
url: "corrector.php",
type: "POST",
data: {input : input},
dataType: "html"
});
request.done(function(msg) {
$("#output").html( msg );
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
type: "POST",
url: "corrector.php",
data: "input="+$("#input").text(),
success: function(msg){
alert( "Data Saved: " + msg );
}
});
var input = $("#input").text();
var request = $.ajax({
url: "corrector.php",
type: "POST",
data: {input : input},
dataType: "html"
});
request.done(function(msg) {
$("#output").html( msg );
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
Dit doet trouwens niets. Ook niet bij verzenden formulier.
Toevoeging op 20/09/2012 18:21:20:
Iemand? Aangezien topic alweer omlaag geschoven is?
<html>
<head>
<script src="test.js" type="text/javascript" ></script>
</head>
<body>
<form id="my_form" action="" method="post">
<textarea id="my_textarea" name="my_textarea" onkeypress="postcontent(event, this.value);"></textarea>
<input name="send" type="submit" value="Verzenden"/>
</form>
<div id="output">
</div>
</body>
</html>
<!-- test.ajax.php =================================================================== -->
<!-- test.js ======================================================================== -->
function Posthttp(target, url, data) {
var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById(target).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open('POST',url,false);
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send(data);
}
function postcontent(evt, value) {
var charCode = (evt.which) ? evt.which : event.keyCode
value = value + String.fromCharCode(evt.keyCode);
Posthttp("output", "test.ajax.php", "my_text="+value);
}
Toevoeging op 20/09/2012 18:49:39:
opdelen in drie bestanden dus.
test.php de pagina met een textarea en een div voor de output.
test.ajax.php wordt aangeroepen door de functie Posthttp(). Posthttp() wacht vervolgens op antwoord van de server en zet de output dat dus door test.ajax.php gemaakt is in de div.
test.js is je javascript file. Ik ben er groot voorstander van om je javascript in een apart bestand te houden.
gr frank