0

Tengo el siguiente problema, tengo una lista de elementos con diferentes id (simula ser una lista dinámica donde los datos viene de una base), y debo activar el botón de eliminar. Mi solución fue la siguiente:

$( "#button" ).click(function() {
    $( this ).closest('section').addClass('btn-remove');
  });

Aqui el html

            <section class="row mt-3 mb-3 reg" id="1">
              <div class="col-1 text-center align-self-center" div>
                <p>01/06/19</p>
              </div>
              <div class="col-lg-3 col-md-4 text-center align-self-center">
                <p>Martin</p>
              </div>
              <div class="col-2 text-center align-self-center">
                <p>32654065</p>
              </div>
              <div class="col-3 text-center align-self-center">
                <p>3794254368</p>
              </div>
              <div class="col-1 text-center align-self-center">
                <p>01/07/96</p>
              </div>
              <div class="col-lg-1 col-md-6 text-center align-self-center">
                <button class="btn btn-primary" type="button" id="button">Eliminar</button>
              </div>
              <div class="col-lg-1 col-md-6 text-center align-self-center">
                <button class="btn btn-primary" type="button" id="accion"><a href="#">Atendido</a></button>
              </div>
            </section>
<section class="row mt-3 mb-3 reg" id="2">
              <div class="col-1 text-center align-self-center" div>
                <p>05/03/12</p>
              </div>
              <div class="col-lg-3 col-md-4 text-center align-self-center">
                <p>Damian</p>
              </div>
              <div class="col-2 text-center align-self-center">
                <p>21143056</p>
              </div>
              <div class="col-3 text-center align-self-center">
                <p>3794213567</p>
              </div>
              <div class="col-1 text-center align-self-center">
                <p>03/12/89</p>
              </div>
              <div class="col-lg-1 col-md-6 text-center align-self-center">
                <button class="btn btn-primary" type="button" id="button">Eliminar</button>
              </div>
              <div class="col-lg-1 col-md-6 text-center align-self-center">
                <button class="btn btn-primary" type="button" id="accion"><a href="#">Atendido</a></button>
              </div>
            </section>

Mi problema es que el botón solo reacciona con el primero, en este caso el paciente denominado "Martin".

Lo único que hace el botón es añadir la siguiente clase display:none

1
  • Primero, tienes id que se repiten, esto no es valido, es incorrecto. Si necesitar agruparlos de algún modo puedes usar una clase para los botones. El selector $("#ID") te devuelve el primer elemento y el único que debería de tener ese id. Ademas de esto no es lo mismo eliminar que ocultar, para eliminar un elemento puedes usar .remove()
    – x3k
    Commented el 9 dic. 2019 a las 14:40

1 respuesta 1

0

creo que esto ya lo han respondido muchas veces pero ahí va.

[id^='someId']

Dará las que empiecen con someId

[id$='someId']

Dará las que terminen con someId

[id*='someId']

Dará todos los Nodos que contengan someId

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.