Ajax request using mootools not working
- by benny
Hi everyone,
I try loading content into a div with this tutorial. Unfortunately, this simply loads the HTML file as a new page.
This is the javascript that should do the job
window.addEvent('domready', function() {
$('runAjax').addEvent('click', function(event) {
event.stop();
var req = new Request({
method: 'get',
url: $('runAjax').get('href'),
data: { 'do' : '1' },
onRequest: function() { alert('The request has been made, please wait until it has finished.'); },
onComplete: function(response) { alert('Response received.); $('container').set('html', response); }
}).send();
$('runAjax').removeEvent('click');
});
});
this is the link that should initiate the function
<a href="about.html" id="runAjax" class="panel">Profil</a>
and this is the div-structure of index.html. i want the content to be loaded into the "container"-div
<div id="view">
<div id="sidebar">
mib
</div>
<div id="container">
<div id="logo">
<!--img src="img/logo.png"-->
</div>
<div align="center" id="tagline">
content
</div>
</div>
</div>
I dont really care what script i use as long as its compatible with MooTools 1.2, because i need it for a sliding top panel and it would be a lot more work to change it to a jquery panel for example.