Tuesday, August 27, 2013

Set CSS class from one page to another - WordPress, jQuery AJAX

Set CSS class from one page to another - WordPress, jQuery AJAX

In WP theme I have post.php (for single post item) and blog.php (for blog
layout). On single post, CSS classes are added to post div via jQuery (on
click).
How to get that classes (strings)from single post (post.php) and use them
in blog.php?
EG. Single post (post.php) print this html
<article class="single-post post-1">
<p>sometext</p>
<a>click</a>
</article>
<script>
jQuery("a").click(function(){
jQuery("article").addClass("singleClass");
});
</script>
Blog posts (blog.php)
<article class="blog-post post-1">
<p>sometext</p>
</article>
<article class="blog-post post-2">
<p>sometext</p>
</article>
And also to get class from single post 1 and add it to blog post 1, post 2
to post 2, etc. First time trying AJAX, so I'm not sure what to do. jQuery
in post.php
var postClass = voteText+'-'+voteNumber; //some variables declared earlier
jQuery.ajax({
type: "POST",
url: "ajax-class.php", //or /wp-admin/admin-ajax.php? This mean that
data is posted to this file?
data: { 'dataString': postClass },
cache: false,
success: function() {
alert("Classes: "+postClass); // alert goes fine
}
});
now I need to GET data from ajax-class.php?
<?php echo 'Classes: '. $_POST['postClass']; ?>
This is not working. If someone could just point me to right direction.
Documentation and stuff. Thanx

No comments:

Post a Comment