Forum for discussing general topics related to Couch.
3 posts Page 1 of 1
I have an ajax infinity code using jquery and php, but i did'nt get the number of correctly. How to do this?
Here is the code:

My article list at the homepage:
Code: Select all
<cms:pages masterpage='article.php' limit='9'>
<cms:embed 'listing.html'/>
</cms:pages>

get_post.php code
Code: Select all
<?php require_once( '../admin/cms.php' ); ?>
<cms:php>
    if($_POST['get'] == 'posts' && isset($_POST['number'])) {
        if($_POST['number'] == '1') {
            echo '
           
            <cms:pages masterpage='article.php' offset='9' limit='9'>
            <cms:embed 'listing.html'/>
            </cms:pages>
               
                ';
        } elseif ($_POST['number'] == 2) {
            echo '
               
            <cms:pages masterpage='article.php' offset='18'>
            <cms:embed 'listing.html'/>
            </cms:pages>

                ';
        }
    }
</cms:php>
<?php COUCH::invoke(); ?>

jquery code:
Code: Select all
define( [
    'require',
    'jquery',
    'plugins/isotope'
], function( require, $, Isotope ) {

    require( [
        'plugins/bridget'
    ], function( jQueryBridget ) {

        jQueryBridget( 'isotope', Isotope, $ );

        var $sect_wrap = $('.sh-section__wrap'),
            $more_btn = $('.sh-footer__more-btn'),
            posts_number = 1;

        $(function () {
            $sect_wrap.isotope({
                itemSelector: '.sh-section__item',
                layoutMode: 'masonry',
            }).addClass('sh-section__isotope-init');
        });

        function send_ajax() {
            $.ajax({
                data: 'get=posts&number=' + posts_number,
                type: 'POST',
                url: 'php/get_posts.php',
                timeout: 5000,
                cache: false,
                success: function (data) {

                    var $elem = $(data);

                    $sect_wrap.isotope()
                        .append( $elem )
                        .isotope( 'appended', $elem )
                        .isotope('layout');

                    posts_number++;

                    if(posts_number > 2) {
                        $more_btn.addClass('sh-footer__more-btn-disable');
                    }
                },
                error: function (jqXHR, exception) {

                    if (jqXHR.status === 0) {
                        console.log('Not connect.\n Verify Network.');
                    } else if (jqXHR.status == 404) {
                        console.log('Requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        console.log('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        console.log(jqXHR.responseText);
                    } else if (exception === 'timeout') {
                        console.log('Time out error.');
                    } else if (exception === 'abort') {
                        console.log('Ajax request aborted.');
                    } else {
                        console.log('Uncaught Error.\n' + jqXHR.responseText);
                    }
                }
            });
        };

        $more_btn.on('click', function (e) {

            if(posts_number > 2 || $more_btn.hasClass('sh-footer__more-btn-disable')) {
                e.preventDefault();
                return false;
            }

            send_ajax();

            e.preventDefault();
            return false;
        });

        $(window).on('scroll', function () {
            var body_b = $('body').get(0).getBoundingClientRect().bottom,
                wind_h = window.innerHeight;

            if(posts_number > 2 || $more_btn.hasClass('sh-footer__more-btn-disable')) {
                return;
            }

            if(body_b < wind_h + 10)
                send_ajax();
        });
    });
});


I always didn't get post number correctly, it always copying the number of post to 50 post or more. if i use normal php without couch tag it get the post number right. How to implement this in couch?

Thank you.
Hi,

I am sure we can get by without having to use raw PHP.
Could you please post the original (working) PHP sample you are trying to base your code on?

As an aside,. we have an AJAX infinite post solution that retrofits into existing HTML. Perhaps you'd like to evaluate that too for your needs - viewtopic.php?f=8&t=8440

KK wrote: Hi,

I am sure we can get by without having to use raw PHP.
Could you please post the original (working) PHP sample you are trying to base your code on?

As an aside,. we have an AJAX infinite post solution that retrofits into existing HTML. Perhaps you'd like to evaluate that too for your needs - viewtopic.php?f=8&t=8440

Here's the working code:
HTML to display normal HTML before we called the ajax:
Code: Select all
<div class="sh-section__wrap row">
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="single_post.html" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-02.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Envato_Studio</a>
                                <span class="sh-section__passed">2 hours ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Special beta pricing's almost over, don't miss out. Head to <a href="single_post.html">http://enva.t</a> to check it out & sign up. Don’t forget o subscribe.</p>
                            <div class="sh-section__image">
                                <a href="single_post.html"><img src="images/microphone-1209816_1920.jpg" alt=""></a>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
</div>

Raw get_post.php:
Code: Select all
<?php
    if($_POST['get'] == 'posts' && isset($_POST['number'])) {
        if($_POST['number'] == '1') {
            echo '
            <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-02.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Envato_Studio</a>
                                <span class="sh-section__passed">2 hours ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Special beta pricing\'s almost over, don\'t miss out. Head to <a href="#">http://enva.t</a> to check it out & sign up. Don’t forget o subscribe.</p>
                            <div class="sh-section__image">
                                <a href="#"><img src="images/microphone-1209816_1920.jpg" alt=""></a>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-03.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Best Jokes</a>
                                <span class="sh-section__passed">20 min ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>About 4,000 years ago:</br>God: I shall create a great plague and every living thing on Earth will die!</br>Fish: *Winks at God and slips him a $20 note*</br>God: Correction, I shall create a great flood!</p>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-02.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Envato</a>
                                <span class="sh-section__passed">13 hours ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Some things you may not have considered about the legal side of borrowing content from other creators.</p>
                            <div class="sh-section__image">
                                <a href="#"><img src="images/girl-1561943_960_720.jpg" alt=""></a>
                                <div class="sh-section__image-info">
                                    <div>The Potential Legal Consequences of content</div>
                                    <p>We share everything you need to consider before installing that plugin..</p>
                                    <span>envato.com</span>
                                </div>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-04.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Bastion</a>
                            <span class="sh-section__passed">1 hours ago</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Checkout our new product grid images.</p>
                        <div class="sh-section__images row">
                            <div class="col-sm-6"><a href="#"><img src="images/cat-1652822_1920.jpg" alt=""></a></div>
                            <div class="col-sm-6"><a href="#"><img src="images/cat-1634369_1920.jpg" alt=""></a></div>
                            <div class="col-sm-6"><a href="#"><img src="images/frog-1530803_960_720.jpg" alt=""></a></div>
                            <div class="col-sm-6"><a href="#"><img src="images/plums-1649602_1920.jpg" alt=""></a></div>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-06.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">ETC Show</a>
                                <span class="sh-section__passed">2 Days ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Gaming News is stupid!! - T.U.G.S</p>
                            <div class="sh-section__media sh-video">
                                <div class="sh-video__player">
                                    <video poster="images/mt-fuji-1346096_1920.jpg">
                                        <source src="videos/video-1.mp4" type=\'video/mp4; codecs="avc1.42E01E, mp4a.40.2"\'></source>
                                    </video>
                                    <div class="sh-media__btn"></div>
                                </div>
                            </div>
                            <script>
                                require([\'app\'], function () {
                                    require([\'modules/player\']);
                                });
                            </script>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-07.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Aaron Paul</a>
                            <span class="sh-section__passed">1 Days ago</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>This track is so sick yo!</p>
                        <div class="sh-section__media sh-audio">
                            <div class="sh-audio__player">
                                <audio>
                                    <source src="videos/video-1.mp4" type=\'video/mp4; codecs="avc1.42E01E, mp4a.40.2"\'></source>
                                </audio>
                                <img src="images/light-bulb-1640438_960_720.jpg" alt="">
                                <div class="sh-media__btn"></div>
                            </div>
                            <div class="sh-audio__info">
                                <div>Statement Music</div>
                                <p>Jeremy Vancaulart - Malevolent State Of Trance</p>
                                <span>-4:30</span>
                                <div class="sh-audio__range">
                                    <img src="images/media/media-range.png" alt="">
                                </div>
                            </div>
                        </div>
                        <script>
                            require([\'app\'], function () {
                                require([\'modules/player\']);
                            });
                        </script>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-08.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Andrei Stefan</a>
                                <span class="sh-section__passed">1 Sep 2016</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Illustrator in 60 seconds: How to create a folded document icon.</p>
                            <div class="sh-section__image">
                                <a href="#"><img src="images/grassland-1425427_1920.jpg" alt=""></a>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-09.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Sergei Nikolav</a>
                            <span class="sh-section__passed">Reposted 10 mins ago</span>
                        </div>
                        <a href="#" class="sh-section__link-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                    </div>
                    <div class="sh-section__repost">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-08.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Andrei Stefan</a>
                                <span class="sh-section__passed">1 Sep 2016</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Special beta pricing\'s almost over, don\'t miss out. Head to <a href="#">http://enva.t</a> to check it out & sign up. Don’t forget o subscribe.</p>
                            <div class="sh-section__image">
                                <a href="#"><img src="images/milky-way-1063305_960_720.jpg" alt=""></a>
                            </div>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-10.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">evl_racoorn</a>
                                <span class="sh-section__passed">2 days ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <ul class="sh-section__code">
                                <li><span><</span>div style="width:660px;text-align:center;margin:20px auto 0"></li>
                                <li><span><</span>div class="container style-flat"></li>
                                <li><span>  <</span>kbd>transform-style: flat;</kbd></li>
                                <li><span>    <</span>div class="top"></li>
                                <li><span>      <</span>div class="bottom"><span><</span>/div></li>
                                <li><span>  <</span>/div></li>
                                <li><span><</span>/div></li>
                            </ul>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-11.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Kurtis Lamar</a>
                            <span class="sh-section__passed">2 sep 2016</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Who will be playing battlefield 1 this month?</p>
                        <div class="sh-section__voting sh-voting">
                            <form action="#">
                                <label>
                                    <input type="radio" name="voting" checked>
                                    <span></span>
                                    <div class="sh-voting__range">
                                        <div style="width: 85%;"></div>
                                        <p>Yea, I will be playing</p>
                                    </div>
                                </label>
                                <label>
                                    <input type="radio" name="voting">
                                    <span></span>
                                    <div class="sh-voting__range">
                                        <div style="width: 46%;"></div>
                                        <p>Maybe later</p>
                                    </div>
                                </label>
                                <label>
                                    <input type="radio" name="voting">
                                    <span></span>
                                    <div class="sh-voting__range">
                                        <div style="width: 75%;"></div>
                                        <p>Nope</p>
                                    </div>
                                </label>
                                <label>
                                    <input type="radio" name="voting">
                                    <span></span>
                                    <div class="sh-voting__range">
                                        <div style="width: 35%;"></div>
                                        <p>Too costly for PC</p>
                                    </div>
                                </label>
                                <label>
                                    <input type="radio" name="voting">
                                    <span></span>
                                    <div class="sh-voting__range">
                                        <div style="width: 12%;"></div>
                                        <p>Waiting for a price drop</p>
                                    </div>
                                </label>
                            </form>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
               
                ';
        } elseif ($_POST['number'] == 2) {
            echo '<!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-13.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Animation_World</a>
                                <span class="sh-section__passed">3 Sep 2016</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>How I feel about mondays</p>
                            <div class="sh-section__image sh-section__image-gif">
                                <a href="#"><img src="images/man-1483479_1920.gif" alt=""></a>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-12.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">memoangeles</a>
                            <span class="sh-section__passed">3 hours ago</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>I don’t do exclusive work at the moment, sorry about that :( </p>
                        <div class="sh-section__image">
                            <a href="#"><img src="images/food-1631727_1920.jpg" alt=""></a>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-14.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">hungryburger</a>
                                <span class="sh-section__passed">SPONSORED</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Feeling hungry today? grab a <a href="#">#hungryburger</a></p>
                            <div class="sh-section__image">
                                <a href="#"><img src="images/bach-flowers-1472825_960_720.jpg" alt=""></a>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-15.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">PC Gamer</a>
                            <span class="sh-section__passed">1 hours ago</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Checkout our new product grid images.</p>
                        <div class="sh-section__compare sh-compare">
                            <div class="sh-compare__images">
                                <div><a href=""><img src="images/bill-1606319_1920.jpg" alt=""></a></div>
                                <div><a href=""><img src="images/cashbox-1642989_1920.jpg" alt=""></a></div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6 sh-compare__left">
                                    <span>AMD Radeon R9 390X</span>
                                    <span class="sh-compare__price">$699</span>
                                </div>
                                <div class="col-sm-6 sh-compare__right">
                                    <span>GeForce GTX 980 Ti</span>
                                    <span class="sh-compare__price">$749</span>
                                </div>
                            </div>
                            <div class="sh-compare__architecture">GPU Architecture <i></i></div>
                            <div class="sh-compare__section">
                                <p>Core Speed</p>
                                <div class="row">
                                    <div class="col-sm-6 sh-compare__left">
                                        <div class="sh-compare__progress-red"
                                             style="width: 68%;"></div>
                                        <span>1050 MHz</span>
                                    </div>
                                    <div class="col-sm-6 sh-compare__right">
                                        <div class="sh-compare__progress-green"
                                             style="width: 90%;"></div>
                                        <span>1607 MHz</span>
                                    </div>
                                </div>
                            </div>
                            <div class="sh-compare__section">
                                <p>Memory</p>
                                <div class="row">
                                    <div class="col-sm-6 sh-compare__left">
                                        <div class="sh-compare__progress-green"
                                             style="width: 90%;"></div>
                                        <span>8192 MB</span>
                                    </div>
                                    <div class="col-sm-6 sh-compare__right">
                                        <div class="sh-compare__progress-green"
                                             style="width: 80%;"></div>
                                        <span>8192 MB</span>
                                    </div>
                                </div>
                            </div>
                            <div class="sh-compare__section">
                                <p>L2 Cache</p>
                                <div class="row">
                                    <div class="col-sm-6 sh-compare__left">
                                        <div class="sh-compare__progress-red"
                                             style="width: 50%;"></div>
                                        <span>1024 KB</span>
                                    </div>
                                    <div class="col-sm-6 sh-compare__right">
                                        <div class="sh-compare__progress-green"
                                             style="width: 98%;"></div>
                                        <span>2048 KB</span>
                                    </div>
                                </div>
                            </div>
                            <div class="sh-compare__section">
                                <p>Shader Processing Units</p>
                                <div class="row">
                                    <div class="col-sm-6 sh-compare__left">
                                        <div class="sh-compare__progress-green"
                                             style="width: 98%;"></div>
                                        <span>2816</span>
                                    </div>
                                    <div class="col-sm-6 sh-compare__right">
                                        <div class="sh-compare__progress-red"
                                             style="width: 70%;"></div>
                                        <span>2560</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-03.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Best Jokes</a>
                                <span class="sh-section__passed">20 min ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>About 4,000 years ago: God: I shall create a great plague and every living thing on Earth will die!</p>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-07.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Aaron Paul</a>
                                <span class="sh-section__passed">1 Days ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Got a chance to read this new book today, seemed pretty great.</p>
                            <div class="sh-section__rating sh-rating">
                                <div class="row">
                                    <div class="col-md-4">
                                        <div class="sh-rating__image">
                                            <a href="$"><img src="images/blog-rating.png" alt=""></a>
                                        </div>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="sh-rating__info">
                                            <span>Jonathan Smith</span>
                                            <p>Spirit’s Voice : Part 1 of the Volume</p>
                                            <div class="sh-rating__progress">
                                                <div class="tt-progress"
                                                     data-value="0.75">
                                                    <strong></strong>
                                                </div>
                                                <span>Great</span>
                                            </div>
                                            <script>
                                                require([\'app\'], function () {
                                                    require([\'modules/progress\']);
                                                });
                                            </script>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-17.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Subscribe Form</a>
                            <span class="sh-section__passed">3 sep 2016</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Get 10% OFF when you sign up</p>
                        <div class="sh-section__image">
                            <a href="#"><img src="images/question-form.jpg" alt=""></a>
                        </div>
                    </div>
                    <div class="sh-section__options">
                        <a href="#" class="sh-btn-icon"><i class="icon-Email"></i></a>
                        <span>Email Address</span>
                        <a href="#" class="sh-section__options-btn sh-btn-icon"><i class="icon-Submit_Tick"></i></a>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                        <div class="sh-section__head">
                            <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-16.png" alt=""></a>
                            <div>
                                <a href="#" class="sh-section__name">Question Form</a>
                                <span class="sh-section__passed">3 hours ago</span>
                            </div>
                            <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                        </div>
                        <div class="sh-section__content">
                            <p>Is it okay for my 5 year old autistic cousin with violent tendencies to play GTA V?</p>
                        </div>
                        <div class="sh-section__options">
                            <span>Add your answer</span>
                            <a href="#" class="sh-section__options-btn sh-btn-icon"><i class="icon-Submit_Tick"></i></a>
                        </div>
                        <div class="sh-section__footer">
                            <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                            <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                            <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                            <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                            <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                            <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                        </div>
                    </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-07.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Mobile App</a>
                            <span class="sh-section__passed">1 Days ago</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Battery Saving Pro app out today</p>
                        <div class="sh-section__offer sh-offer">
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="sh-offer__image">
                                        <a href="$"><img src="images/battery.jpg" alt=""></a>
                                    </div>
                                </div>
                                <div class="col-md-8">
                                    <div class="sh-offer__info">
                                        <span>iOS Application</span>
                                        <p>Battery Life Saver Pro</p>
                                    </div>
                                    <div class="sh-offer__btns">
                                        <a href="#" class="btn">iOS</a>
                                        <a href="#" class="btn">Android</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="sh-section__options">
                        <a href="#" class="sh-btn-icon"><i class="icon-Email"></i></a>
                        <span>Email Address</span>
                        <a href="#" class="sh-section__options-btn sh-btn-icon"><i class="icon-Submit_Tick"></i></a>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
                <!--section-->
                <div class="sh-section__item col-lg-6">
                    <div class="sh-section">
                    <div class="sh-section__head">
                        <a href="#" class="sh-section__avatar sh-avatar"><img src="images/avatars/avatar-12.png" alt=""></a>
                        <div>
                            <a href="#" class="sh-section__name">Dress Owesom</a>
                            <span class="sh-section__passed">3 Sep 2016</span>
                        </div>
                        <a href="#" class="sh-section__link sh-btn-icon"><i class="icon-Link"></i></a>
                    </div>
                    <div class="sh-section__content">
                        <p>Get 20% off on our products untill october 12</p>
                        <div class="sh-section__image">
                            <a href="#"><img src="images/dress_owesom.jpg" alt=""></a>
                            <div class="sh-section__image-curtain">
                                <div class="sh-section__image-curtain-text">
                                    <p>Bluetooth Speakers</p>
                                    <span>$15.99</span>
                                </div>
                                <a href="#" class="sh-btn">Buy Now</a>
                            </div>
                        </div>
                    </div>
                    <div class="sh-section__footer">
                        <a href="#" class="sh-section__btn-upvote sh-btn-icon"><i class="icon-Upvote"></i></a>
                        <a href="#" class="sh-section__btn-downvote sh-btn-icon"><i class="icon-Downvote"></i></a>
                        <a href="#" class="sh-section__btn-repost sh-btn-icon"><i class="icon-Repost"></i></a>
                        <a href="#" class="sh-section__btn-like sh-btn-icon"><i class="icon-Favorite_Full"></i><span>1,274</span></a>
                        <a href="#" class="sh-section__btn-comment sh-btn-icon"><i class="icon-Comment_Full"></i><span>982</span></a>
                        <a href="#" class="sh-section__btn-share sh-btn-icon"><i class="icon-Share"></i></a>
                    </div>
                </div>
                </div>
               
                ';
        }
    }
?>


Thank you for your respond KK.
3 posts Page 1 of 1