how to open only one field

Navigation
0

I'm having the following problem when asking for jquery to open the form it ends up opening all at once to send a reply in the comment, but I need it to open just what I clicked as I do this. Follow the codes.

javascript 

$(document).ready(function(){

    $('.resposta').click(function(){
       var id = $(this).children('input').val();
       var resposta = $('.restposta').id;

    $('.resposta').fadeOut("fast");
    $('.resp').fadeIn("fast");

    });
    return false;
});

Php that takes the data from the bank 

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

                    $comentar = new Read;
              $comentar ->ExeRead('coment', 'WHERE video = :video ORDER BY id DESC LIMIT 4', "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;
                   echo "<p><small class='fontze1'>Comentado por:</small> {$nome} <small>Em:  </small> {$date} <small>As: </small> {$hora}</p>

                            <p>".nl2br($comentario)."</p><div class='btn btn-green 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>";


                endforeach;    

                endforeach;

                endforeach;

Edit: I also noticed that clicking on show more that appear on the page does not work the answer function does not open anything and was to be opened when clicked it does not perform any action

    
asked by anonymous 11.03.2017 / 18:14

1 answer

0

You should use this , otherwise it will apply to all resposta , just as you were able to do in the variables. 

$(document).ready(function(){

    $('.resposta').on('click', function(){

       var id = $(this).children('input').val();
       var resposta = $('.resposta').id;

       $(this).fadeOut('fast');
       $(this).parents('.coment').find('.resp').fadeIn('fast');

    });

});

If possible add the HTML rendered, this will be much less laborious, so the DOM does not need to inform PHP, just like HTML is. Your HTML looks like this: 

<input type='text' hidden='hidden' value='{$link}' id='link'>
<div class='comentar  fl-left'>
  <div class='coment com'>
    <a href='user?id={$id}'><img class='fl-left' src='".REQUIRE_PATH."/css/boot/icons/thumb.png'></a>
    <p><small class='fontze1'>Comentado por:</small> {$nome} <small>Em:  </small> {$date} <small>As: </small> {$hora}</p>
    <p>".nl2br($comentario)."</p>
    <div class='btn btn-green 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>

There is a div that is not closed!

Explanations:

You have a .resposta , which when clicked causes .resp to be displayed and .resposta to be removed.

What does .resposta and .resp have in common (besides the name)? Simple, they both belong to .coment , so you have two ways to do it :

  • $(this).parents('.coment').find('.resp'); takes the element of class this that is at the same level as coment .

Both reach the same goal, remembering that resp is the clicked element, IN THIS CASE.

Demonstration: 

$(document).ready(function() {

  $('.resposta').on('click', function() {

    var id = $(this).children('input').val();
    var resposta = $('.resposta').id;

    $(this).fadeOut('fast');
    $(this).siblings('.resp').fadeIn('fast');

  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='comentar  fl-left'>
  <div class='coment com'>
    <a href='user?id={id}'><img class='fl-left' src=''></a>
    <p><small class='fontze1'>Comentado por:</small> {nome} <small>Em:  </small> {date} <small>As: </small> {hora}</p>
    <p>{comentario}</p>
    <div class='btn btn-green fl-right resposta'><b>Responder</b><input type='hidden' value='{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>
</div>
<div class='comentar  fl-left'>
  <div class='coment com'>
    <a href='user?id={id}'><img class='fl-left' src=''></a>
    <p><small class='fontze1'>Comentado por:</small> {nome} <small>Em:  </small> {date} <small>As: </small> {hora}</p>
    <p>{comentario}</p>
    <div class='btn btn-green fl-right resposta'><b>Responder</b><input type='hidden' value='{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>
</div>
    
11.03.2017 / 19:59
Call to a member function prepare () on a non-object in /var/www/estudos/estudentsCRUD/classes/cliente.php l on line 24 Problem in recovering with Firebase