wordpress post while loop inside jquery

Question

i want to loop all post title inside javascript to build my gallery but it does not works i get strange output My code :

  <?php
        query_posts(array( 
            'post_type' => 'musings'
        ) );  
         while (have_posts()) : the_post(); 
        $title = the_title();
        $desc = the_content();
        $galleryslider .= "{
                        'title'         : '".$title."',
                        'description'   : '".$desc."',
                        'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
                        'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
                        'button_list'   :
                        [
                            { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                            { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
                        ],
                        'tags'          : ['Portrait']
                    },";
     endwhile;
     $galleryslider = rtrim($galleryslider,',');
    ?>
    <script type="text/javascript">
    $(function(){
        <?php echo $finalslider;?>
    });
    </script>

Expected out put

{
                'title'         : 'post 1 title',
                'description'   : 'post 1 desc',
                'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
                'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
                'button_list'   :
                [
                    { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                    { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
                ],
                'tags'          : ['Portrait']
            },{
                'title'         : 'post 2 title',
                'description'   : 'post 2 desc',
                'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
                'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
                'button_list'   :
                [
                    { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                    { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
                ],
                'tags'          : ['Portrait']
            }

Ouptut i get (wordress pages show title and desc above javasscript but value on title and desc inside javascrit is blank see below code)

{
                'title'         : '',
                'description'   : '',
                'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
                'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
                'button_list'   :
                [
                    { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                    { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
                ],
                'tags'          : ['Portrait']
            },{
                'title'         : '',
                'description'   : '',
                'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
                'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
                'button_list'   :
                [
                    { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                    { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
                ],
                'tags'          : ['Portrait']
            }

query_posts(array( 'post_type' => 'musing', ) ); has a comma that it shouldn't have I think. — bassxzero
– bassxzero, Commented Apr 11, 2015 at 3:59

Rasclatt · Accepted Answer · 2015-04-11 04:24:27Z

1

From the little I know about Wordpress, try either echoing the data right out or save to the output buffer and echo later. Also, you may have to return false on the the_title() in order to use strip_tags(). Also, $desc does not appear to be define.:

<?php
    ob_start();
    query_posts(array('post_type' => 'musing'));

    while (have_posts()) : the_post(); ?>
        {
            // the_title() can use a false to return the value for use with strip_tags (apparently)
            'title'         : '<?php echo stripslashes(the_title(false)); ?>',
            // Where is this $desc coming from?
            'description'   : '<?php echo $desc; ?>',
            'thumbnail'     : ['images/small/1.jpg', 'images/small/2.jpg'],
            'large'         : ['images/large/1.jpg', 'images/large/2.jpg'],
            'button_list'   : [
                { 'title':'Demo', 'url' : 'http://bonchen.net/' },
                { 'title':'Download', 'url':'http://porfolio.bonchen.net/'}
            ],
            'tags'          : ['Portrait']
        }, <?php
    endwhile;
    $data   =   ob_get_contents();
    ob_end_clean();
?>
<script type="text/javascript">
    $(function(){
            <?php echo $data; ?>
        });
</script>

edited Apr 11, 2015 at 4:24

answered Apr 11, 2015 at 4:13

Rasclatt

12.5k3 gold badges28 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Rasclatt Over a year ago

What do you mean? What other way would you like to do it?

mydeve Over a year ago

it means to say that using ob_get_contents is right way , can we do some changes in wp query to get results

Rasclatt Over a year ago

Using the output buffer just basically writes to memory before it writes to the page, then you assign the contents to a variable. It's basically the same thing you are doing, however, some of the wp functions echo which you can not assign to a variable. You can change the functions to return and not echo (according to the manual) then what you have "should" work

Rasclatt Over a year ago

What I have done is fine, there is nothing wrong with using it as is.

Mark Skeet · Accepted Answer · 2015-04-11 05:49:44Z

I don't believe you had to change quite so much of your code as you appear to have simply not been using the right Wordpress functions/not passing the right arguments to them. By default the_title() & the_content() cause display at run time.

To make use of them programmatically you need something like this:

<?php
        query_posts(array( 
            'post_type' => 'musings'
        ) );  
         while (have_posts()) : the_post(); 
        $title = the_title(false);
        $desc = get_the_content();
        $galleryslider .= "{

        ...

Your original code sample then echoes out a $finalslider variable - is that a typo? If not how is that getting set when you're using $galleryslider in the build up

Collectives™ on Stack Overflow

wordpress post while loop inside jquery

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related