Ik heb al wat kleine dingetje gedaan met AJAX, maar nu stuit ik op het volgende probleem:
Bij de vorige scripts die ik gemaakt had, was de actie van de server het verwijderen of het wijzigen van iets in een database, maar nu is het wat ingewikkelder.
Als ik alleen iets wil doen in de database is de responsetext een heel simpel zinnetje van bijvoorbeeld: 'het object is succesvol verwijderd uit de database'.
Nu in mijn geval wil ik een stuk van een pagina opnieuw opbouwen dmv bijvoorbeeld innerHTML.
Voor de duidelijkheid post ik even mijn AJAX-functie:
var xmlHttp;
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
function startAjaxRequest(url,data) {
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleStateChange;
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlHttp.send(data);
}
function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
alert(xmlHttp.responseText)
}
else{
alert('Er is een fout opgetreden: (' + xmlHttp.status + ') ' + xmlHttp.responseText)
}
}
}
met de volgende functie wil ik de pagina overnieuw opbouwen:
function next_blog(blogid){
startAjaxRequest('php-ajax-actions.php?action=next_blog','blog_id=' + blogid)
alert (xmlHttp.responseText)
//hier alle commando's om de pagina overnieuw op te bouwen
}
Maar nu heb ik opeens niet meer de beschikking over de variabele xmlHttp.responseText. Moet ik nu in elke functie waar ik de pagina mee wil veranderen de hele xmlrequest functie in uittypen of is er een andere manier?
Alvast bedankt!
Ik weet wel wat een class is, maar snapte niet waar joop naar toewilde, maar ben nu wel zover dat ik een class heb gemaakt van de hele AJAX-functie:
function Ajax(){
var xmlHttp;
this.createXMLHttpRequest = function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
this.startAjaxRequest = function startAjaxRequest(url,data,functie) {
action = functie
toggle_element('loading')
this.createXMLHttpRequest();
xmlHttp.onreadystatechange = this.handleStateChange;
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlHttp.send(data);
}
this.handleStateChange = function handleStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
action(xmlHttp.responseText)
toggle_element('loading')
}
else{
alert('Er is een fout opgetreden: (' + xmlHttp.status + ') ' + xmlHttp.responseText)
}
}
}
function draw_blog_action(xmltekst){
var result = xmltekst.split('[end]')
var id = result[0]
var datum = result[1]
var titel = result[2]
var tekst = result[3]
document.getElementById('blog_titel').innerHTML = titel
document.getElementById('blog_datum').innerHTML = datum
document.getElementById('blog_tekst').innerHTML = tekst
if(current_blog == 0){
document.getElementById('click_vorige').style.visibility = 'hidden'
}
else{
document.getElementById('click_vorige').style.visibility = 'visible'
}
if(current_blog == (tot_aant_blogs - 1)){
document.getElementById('click_volgende').style.visibility = 'hidden'
}
else{
document.getElementById('click_volgende').style.visibility = 'visible'
}
}
}
om dit uit voeren gebruik ik:
function draw_blog(blogid){
var ajax_ding = new Ajax();
ajax_ding.startAjaxRequest('php-ajax-actions.php?action=change_blog&type=js','blog_id=' + blogid,'draw_blog_action')
}
draw_blog_action is de naam van de functie met de commando's voor wat ik wil gaan doen, maar hoe voer ik deze functie dan uit? In de functie handlestatechange kan ik de naam van de functie gewoon alerten, dus ik heb hem tot mijn beschikking,maar hoe voer ik hem nu ook daadwerkelijk uit?
Ik hoop dat het een beetje duidelijk is. Alvast bedankt!
Simon
Bedankt allen, het probleem is opgelost.
@Jan: Ik snap niet precies wat je bedoelt, mijn probleem was eigenlijk heel simpel kwam ik net achter, ik had een string, maar die moest uitgevoerd worden als javascript, javascript heeft dezelfde functie die in php zit, namelijk 'eval'. Werkt nu prima.
Ik kan nu een ajax-request doen op de volgende manier:
var Ajax_request = new Ajax();
Ajax_request.startAjaxRequest( [URL] , [DATA] , [naam van functie ,of een javascriptcode, die uitgevoerd moet worden, na de request]).
het is handiger om draw_blog_action(xmltekst) niet in de class te zetten maar gewoon apart.
ajax_ding.startAjaxRequest('php-ajax-actions.php?action=change_blog&type=js','blog_id=' + blogid, draw_blog_action)
ook hoeven er geen quotes om deze parameter
Bedankt allen, het probleem is opgelost.
@Jan: Ik snap niet precies wat je bedoelt, mijn probleem was eigenlijk heel simpel kwam ik net achter, ik had een string, maar die moest uitgevoerd worden als javascript, javascript heeft dezelfde functie die in php zit, namelijk 'eval'. Werkt nu prima.
Ja, op die manier. In je post zei je alleen uitgevoerd, maar je bedoelde geƫvalueerd dus ;-)