Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Category Posts order ASC + jQuery Mobile + Alpha List Dividers WordPress

  • SOLVED

Hello Experts

I'll explain my issue. Not really an issue but would be an awesome touch to my project.

I'm building a wordpress website using the jQuery mobile framework.

On my archive page, for my specific category, I'm currently running this loop. This loop is set to display all my posts in the 'exhibitors' category, ordered by the post title in alphabetical order.




<ul data-role="listview" data-theme="<?php jqtheme_mainlist(); ?>" data-inset="true">

<?php
// get posts from category 'exhibitors' and display them alphabetical order of post title
if (is_category(array('exhibitors')))
{
$posts = query_posts($query_string .
'&orderby=title&order=asc&posts_per_page=-1');
}
if (have_posts()) : while (have_posts()) : the_post(); ?>

<li>

<a href="<?php the_permalink() ?>">

<?php the_post_thumbnail('thumbnail', array('class' => 'ui-li-icon')); ?>

<?php the_title(); ?>

<span class="ui-li-count">
<?php
// this returns a custom field from my post
if ( get_post_meta($post->ID, 'Stand Number', true) ) { ?>
<?php echo get_post_meta($post->ID, 'Stand Number', true); ?>
<?php } ?>
</span>

</a>

</li>

<?php endwhile; endif;?>

</ul>



The above looks like this with a thumbnail.. http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/lists/lists-count.html

Simple, works a beaut. Looks like a long list of names in alphabetical order.


But my BIG question is to take this loop one step further, but I have a feeling it may be impossible.

I want my list to look like this.. http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/lists/lists-divider.html


The <li> that I need to somehow inject into the loop on every beginning of a letter change looks like this.



<li data-role="list-divider">A</li>




Can this be done? Any help would be awesome! Thanks in advance.

Answers (1)

2011-06-22

Utkarsh Kukreti answers:


<ul data-role="listview" data-theme="<?php jqtheme_mainlist(); ?>" data-inset="true">

<?php
// get posts from category 'exhibitors' and display them alphabetical order of post title
if (is_category(array('exhibitors')))
{
$posts = query_posts($query_string .
'&orderby=title&order=asc&posts_per_page=-1');
}
$last_initial = "";
if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php
$current_initial = get_the_title();
$current_initial = strtoupper($current_initial[0]);
if($current_initial != $last_initial) {
$last_initial = $current_initial;
?>
<li data-role="list-divider"><?php echo $current_initial; ?></li>
<?php
} ?>
<li>

<a href="<?php the_permalink() ?>">

<?php the_post_thumbnail('thumbnail', array('class' => 'ui-li-icon')); ?>

<?php the_title(); ?>

<span class="ui-li-count">
<?php
// this returns a custom field from my post
if ( get_post_meta($post->ID, 'Stand Number', true) ) { ?>
<?php echo get_post_meta($post->ID, 'Stand Number', true); ?>
<?php } ?>
</span>

</a>

</li>

<?php endwhile; endif;?>

</ul>


Josh Cranwell comments:

Absolutely perfect dude. This has helped me a lot!

I can't work out how to pay you? When I click resolve, it says something about going to the community pot?

How do I get you to receive the prize? Thanks


Utkarsh Kukreti comments:

I'm not sure. I think you have to vote for my answer.

http://www.wpquestions.com/page/static/name/About

<blockquote>When the Asker receives a sufficient answer to their question, they vote for the Expert who supplied the answer. The Eligible Voting Community has the opportunity to vote on the question till 2am the next day. The votes are tallied, averaged, and the prize distributed accordingly.</blockquote>


Josh Cranwell comments:

voted, thanks for your help.