Posted 4 years ago #
I want to get out a post of wordpress without a page reload using ajax. since jquery is the framework I am most familiar with and used for other DOM manipulation already, it would be my first choice.
should just be a link and a div. once the link is pressed, post #57 is beeing loaded into the div dynamically.
thanks for your help!
Posted 4 years ago #
Which end are you having trouble with: Writing a javascript call using jquery, or getting WP to return just one post?
Either way, start here:
Posted 4 years ago #
hi adam,
well honestly both ends. there are jquery tutorials how to start using its ajax functions but i don't know how to apply that knowledge to wordpress. so I am looking for a short code sample which demonstrates how to start the ajax setup and how to get one dedicated post out of the wordpress-database.
thanks for your help
Posted 4 years ago #
Hi adamrbrown & Julietjaxx,
I have the same question as Julietjaxx, how can I retrive a WordPress post using Jquery (without page reload)? I checked the links on the WordPress.org page but nothing really gives an easy to implement example using Jquery.
I would be very grateful, if someone could explain this to me or refer me to a good tutorial, specifically for implementation in WordPress.
Thank you!
Posted 3 years ago #
I (sort of) get how AJAX works, but I'm with the other guys in that I need to see an example of how to use AJAX *in WordPress* before I get it.
Can someone post an example of how they've used jquery and WP together to get the content of a post "on the fly"? It would be much appreciated.
Thanks!
Posted 3 years ago #
I haven't done this on my own site with jQuery but I've written a fair amount of jQuery AJAX code... and the code below has been tested on my development site.
I suggest reviewing the documentation on the "load()" function: http://docs.jquery.com/Ajax/load#urldatacallback
Keep in mind that instead of $() you'll want to use jQuery(). So the example on that page is
jQuery("#links").load("/Main_Page #p-Getting-Started li");
Exactly how you integrate a query in your site will depend a great deal on how your site is designed and what you're attempting to do. And for SEO, and any amount of pay-per-click advertising, you probably only want to do this as an "enhancement". For example, show a snippet of a post when someone mouseovers a link on an archive page. The jQuery examples tend to be simple, but if you peruse through them you'll discover bits and pieces you can combine.
To do that, you'll need to pair the load() function with an event handler and a hidden div that pops up, and another event handler for when the mouse moves away. But here's a simpler example, if you include this in your header.php just before the "</head>" line, when you mouse over a WordPress sidebar link, the link's content div should replace the ever-present "content" div already on your page (wait a second, it may not be instantaneous, and it only works on links inside the div with the id "sidebar"):
<script type="text/javascript" src="/wp-includes/js/jquery/jquery.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#sidebar a").mouseover(function () {
jQuery("#content").load(jQuery(this).attr("href") + " #content");
});
});
</script>Now, this code is crude... it doesn't care whether you've got an external or internal link, and the jQuery library include may be redundant... it's not the correct way to include it, for that I suggest the Codex. So I really don't recommend using it as is! But it's a working example that should work on most WordPress sites with standard Kubrick-style templates (that use the "sidebar" and "content" divs). Or, you can change the code to fit your site...
I highly recommend the book "jQuery in Action" if you really want to use jQuery on your WordPress site, or anywhere for that matter.
Posted 3 years ago #
I've been a good whole month trying to figure out how I can do something like Write Post's Custom Fields box.
Searched day and night hoping to find a tiny single tutorial on how to implement an Ajax function in 'Write Post' page for my WordPress theme. I seriously need more stuff than the codex to offer.
Ajax books are aplenty. I've got a few but its using it in WordPress that I'm stuck with. I don't even know where to start.
Can anyone help show me how I could write a simple Ajax function (not-plugin), even as simple as saving-loading a 'Hello-World' string? Please help, as I don't know where else I could turn to for help anymore.
Posted 3 years ago #
Start by looking at the code of similar plugins, or even the WordPress core code (because it does indeed use Ajax for various things including autosave). You won't find anything more accurate than the source code for a how-to, and if it's been done the code is out there... it might even already be on your hard drive.
I am making use of browsing pages using ajax but with Mootools in my blog, the concept is similar and not very difficult. Try targeting an ajax request with the url being your post url.
Posted 3 years ago #
I've been having the same troubles where I was sending a jQuery.ajax() post and it not actually sending any post data at all! I managed to fix it by appending an extra string on to the post URL (yeah, that old trick!). For example:
Within JS:
var now = new Date();
var time = Date.UTC(now.getFullYear(), now.getMonths(), now.getDate(), now.getHours(), now.getMinutes(), now.getSeconds(), now.getMilliseconds());
jQuery.ajax({
type: "POST",
data: "&var1=Hello&var2=there",
url: "http://example.com/?time="+time,
success: function(results) {
alert(results);
}
});Or this way since I've got my JS code within a PHP file:
jQuery.ajax({
type: "POST",
data: "&var1=Hello&var2=there",
url: "http://example.com/?time=<?=time(); ?>",
success: function(results) {
alert(results);
}
});I hope that helps someone. I wrote this code quickly in here so not too sure if the JS for the time constructor is correct!
This topic has been closed to new replies.
