data-toggle ajax,javascript - jQuery AJAX data-toggle - Stack Overflow

Have a situation where I am using the jquery ".load()" method to load content into div's on my page using AJAX connections. At the moment at the end of the page I have to have a document.ready function and have to specify each and every single AJAX div manually with a load statement.

Loading...

Loading...

$(document).ready(function() {

$("#div1").load("path/to/file.php");

$("#div2").load("path/to/file.php");

});

Instead what I would like to do is work with the jQuery selector and the data- parameters in HTML5. I already use these for a number of other sections which are used to capture onclick events however having trouble with using the same technique for the AJAX load method.

What I currently have is...

Loading...

Loading...

$(document).ready(function() {

$("[data-toggle='pagelet']").load($(this).data("url"));

});

But it doesn't work. I know using the data-toggle and data-url paramaters work because when I resort to adding a click handler at first and embed the ajax load method on the click handler then it works when I click on the div's in question.

Can anyone give me an idea where I am going wrong and point me in the right direction.

Thanks