jquery request giving error

0
I have the following problem: I have a page where I put the comments everything right there loads up 5 comments so far everything works what happens is that in these 5 comments has a button that you click and appears in fadeIn the field to by answer so far all right, but when I click on show more comments he pucha from another page and the ones that come when I click on reply does not work do not know why.

source code:

javascript

$('.resposta').click(function(){
        var id = $(this).children('input').val();
        alert(id);
        $(this).fadeOut("fast");
        $(this).parents('.coment').find('.resp').fadeIn("slow");

        $('form[name="responder"]').submit(function(){
           return false; 
        });

        return false;
    });

page php where already displays the 5 comments

<?php 
                       /*
                     **********************************************
                     **********************************************
                     ***********Função para exibição dos***********
                     ****************comentarios*******************
                     **********************************************/

                        $comentar = new Read;
                  $comentar ->ExeRead('coment', 'WHERE video = :video ORDER BY id DESC LIMIT 5', "video={$sei[1]}");
                  foreach ($comentar->getResult() as $big):
                      extract($big);
                  $image = new Read;
                  $image ->ExeRead('users', 'WHERE id = :id', "id={$big['user']}");
                  foreach ($image->getResult() as $imx)
                      extract ($imx);
                /*
                     **********************************************
                     **********************************************
                     *********Fim da função de exibição************
                     ***************de comentarios*****************
                     **********************************************/
                  echo "<input type='text' hidden='hidden' value='{$link}' id='link'>";
                  ?>
                    <div class='comentar  fl-left'>
                        <div class='coment com' >

                                <?php 

                    if($foto == "" || $foto == "uploads/"):
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='".REQUIRE_PATH."/css/boot/icons/thumb.png'></a>";
                    else:
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='{$imx['foto']}'></a>";
                    endif;
                    ?>
                   <p><small class='fontze1'>Comentado por:</small> <?=$nome?> <small>Em:  </small> <?=$date?> <small>As: </small> <?=$hora?></p>

                   <div class="comentando">
                       <p><?=nl2br($comentario)?></p></div>
                       <div class='fl-right resposta'>Responder<input type='hidden' value='<?=$big[id] ?>' name='idcoment'>
                       </div>
                       <div class=' resp' style='display:none'>
                           <form method='post'><textarea></textarea>  

                               <input class='btn btn-green' type='submit' value='responder' name='responder'>
                           </form>
                       </div>
                   </div>


                        <?php
                    endforeach;    

                    endforeach;

                    endforeach; 
                    ?>
                    <center><div id='load' class='btn btn-blue btn-full'>Mostar mais comentários</div></center> <div class='clear'></div>
                  </div>

page where it is puchado show more

<?php
include '../_app/Config.inc.php';

// Função do jquery para listar os comentários
if(filter_input(INPUT_POST, 'acao') ==  'comentarios'){

    $video = filter_input(INPUT_POST, 'video');
    $numcom = filter_input(INPUT_POST, 'numcom');

    $readCount = new Read ();
    $readCount ->ExeRead('coment', "WHERE video = :video LIMIT $numcom,4", "video={$video}");

    echo $readCount->getRowCount();

}

// Função do jquery para exibir mais comentários

if(filter_input(INPUT_POST, 'acao') ==  'morecoment'){
    $video = filter_input(INPUT_POST, 'video');
    $numcom = filter_input(INPUT_POST, 'numcom');

    $readCount = new Read ();

    $readCount ->FullRead("SELECT * FROM coment WHERE video = :video ORDER BY id DESC LIMIT $numcom,3", "video={$video}" );


        foreach ($readCount->getResult() as $cat):
        extract($cat);
        $image = new Read;
                  $image ->ExeRead('users', 'WHERE id = :id', "id={$cat['user']}");

                  foreach ($image->getResult() as $imx):
                      extract ($imx);
                  echo "<div class='coment com' style='display:none'>";
                    if($foto == "" || $foto == "uploads/"):
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='".REQUIRE_PATH."/css/boot/icons/thumb.png'></a>";
                    else:
                        echo  "<a href='user?id={$id}'><img class='fl-left' src='{$imx['foto']}'></a>";
                    endif;
                       ?>
                       <p><small class='fontze1'>Comentado por:</small> <?=$nome?> <small>Em:  </small> <?=$date?> <small>As: </small> <?=$hora?></p>

                                <div class="comentando">
                       <p><?=nl2br($comentario)?></p></div>
                       <div class='fl-right resposta'>Responder<input type='hidden' value='<?=$big[id] ?>' name='idcoment'>
                       </div>
                       <div class=' resp' style='display:none'>
                           <form name='responder' method='post'><textarea></textarea>  

                               <input class='btn btn-green' type='button' value='responder' name='responder'>
                           </form>
                       </div></div>

                        <?php


                   endforeach;           
               endforeach;           
}
    
asked by anonymous 13.03.2017 / 18:49

1 answer

0

When you run jQuery there at the beginning, it finds all the "response" class divs and applies the events you programmed in the answer function, right?

But when you load more comments, it does not do that again, because it's already done once (in the first 5 comments that were already on the page).

That is: you need to run this script on the new responses.

But there is a problem

If you run this same selector, it will put two events in the first five comments, because jQuery uses setEventListener to record the click event. That is, it will run twice and occupy more memory for nothing, plus it may give headache later. To solve this, create a function that does two things: remove all events from the objects and then put them back in.

function addEventosRespostas() {
   $('.resposta')
       .off("click")
       .on("click", function(){
         ...
       });
}

Something else Avoid using .click() because it's getting out of the most current jQuery (it should have gone already, I have time to hear it). The standard nowadays is .on()

References

link

link

    
13.03.2017 / 19:15