1

Tengo un pequeño problema para saber cual es el list group seleccionado en una web hecha con PHP esencialmente.

En la parte izquierda se aprecia un list group, la idea es saber cual tengo seleccionado (ya sea por console.log o algo similar)...

Adjunto código a continuación:

<div class="row">
      <div class="col-4">
        <div class="list-group" id="channel" name="channel" role="tablist">

          <?
          $query1 = mysqli_query($conn,"SELECT * FROM chat1 WHERE id_em='".$id."'  OR id_rec='".$id."' ");
          while($row = mysqli_fetch_array($query1)){
            ?>
          <a class="list-group-item list-group-item-action" name="cod" value="<?php echo $row["cod"]; ?>" data-toggle="list" href="#list-home"><?php echo $row["cod"]; ?></a>
         <?
     }
       ?>

        </div>
      </div>
      <div class="col-8">

        <div class="tab-content" id="nav-tabContent">
          <div class="tab-pane fade show active" id="list-home" role="tabpanel" aria-labelledby="list-home-list">...1</div>

              </div>
      </div>
    </div>

Lo que hace es que simplemente hace un row al phpmyadmin y obtiene los códigos 171-170, 172-170 y 171-175.

Entonces yo tengo el siguiente js para identificarlo pero no funciona al parecer:

 $("#channel").click(function(){
   socket.emit('change channel',$("#channel").val());
});

Al hacer clic haga tal cosa.
Pero lo que sucede es que al hacer click funciona pero luego si quiero cambiar a otro código como el 171-170 por ejemplo, no los diferencia.

De hecho es lógico porque al decirle .click hace click en cualquiera y funciona, pero no los diferencia.

Antes hice un select option con esto mismo y en el código de js, puse el evento de en vez de .click, era .change(function()...

1 respuesta 1

0

Puedes intentar capturar el click en los <a> asi:

$("#channel a").click(function(){
   console.log($(this).attr('value'));
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="row">
      <div class="col-4">
        <div class="list-group" id="channel" name="channel" role="tablist">

          
          <a class="list-group-item list-group-item-action" name="cod" value="171-170" data-toggle="list" href="#list-home">172-170</a>
          <a class="list-group-item list-group-item-action" name="cod" value="172-170" data-toggle="list" href="#list-home">172-170</a>

        </div>
      </div>
      <div class="col-8">

        <div class="tab-content" id="nav-tabContent">
          <div class="tab-pane fade show active" id="list-home" role="tabpanel" aria-labelledby="list-home-list">...1</div>

              </div>
      </div>
    </div>


 

1
  • 1
    gracias! funcionó perfectamente Commented el 16 ago. 2018 a las 1:42

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.