Upload post without refresh of page with AJAX and JQUERY

Question

Upload post without refresh of page with AJAX and JQUERY

Navigation

#1 by (4 votes)
#2 by (0 votes)
#3 by (0 votes)

7

I need help with Wordpress because I would like to load posts without refresh or reload of the page. I have a menu that returns posts of a certain category in a <div> to the left and I would like to be able to load in the <div> to the right the content referring to the hyperlink that was clicked. What's more, this is inside a fancybox, which is why there can be no reload. The HTML structure is this:

<div id="floatpost" role="main"> 
  <!-- section -->
  <section>
    <div class="rReleases">
      <div id="menu" class="rPosts">
        <ul>
            <?php
                $recent = new WP_Query("cat=7");
                while ($recent->have_posts()) : $recent->the_post();
            ?>
            <li>
              <p class="title">
                <?php the_time('j / m'); ?> - <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
              </p>
            </li>
            <?php
                endwhile;
            ?>
        </ul>
      </div>
      <div id="content" class="rPost">

      </div>
    </div>
  </section>
  <!-- /section --> 
</div>

jquery ajax wordpress

asked by anonymous 18.02.2014 / 16:09

3 answers

How to get the current location of the android device? What is the meaning of the acronyms SISD, SIMD, MISD, MIMD? What is your relationship with programming?

score 4 · Answer 1

I think this is what you need:

$('#menu a').on('click', function () {
  /* to-do: mostrar ao usuário que há conteúdo sendo carregado
  se não o ele irá clicar novamente pensando que ocorreu um erro */

  // carrega o conteúdo
  $('#content').load(this.href);

  // evita que o link seja aberto normalmente
  return false;
});

score 0 · Answer 2

0

An alternative:

$("a").click(function(e){
  $('#content').load(this.href);
  e.stopPropagation();
  e.preventDefault();
});

18.02.2014 / 19:12

score 0 · Answer 3

If you just want to load the page content and display next:

        $(document).ready(function(e) {

            $('#menu-lateral .post').click(function(e){
                var page = $(this).attr('href');

                $('#janela-direita').html('');

                $('#janela-direita').load(page, function(x, y, z){
                    $('#janela-direita').trigger('create');
                });
                e.preventDefault();
            });
        });