0

necesito ayuda con un pequeño detalle que tengo, tengo un foreach el cual me recorre los datos, por cada fila que se recorre hay un boton y a ese boton le creé un atributo llamado id_curso. La idea es que cada vez que se le de clic al boton de cualquier fila mostrar un modal y en el un formulario y por ende en un input mostrar el valor de ese atributo.

Actualmente estoy utilizando jquery

<div class="form-group row justify-content-center" >
    <button class="btn btn-warning btneditarcurso" id_curso="'.$value["Id_curso"].'" 
       data-toggle="modal" data-target="#modalEditarNota" style="margin: 2.5px;">
       <i class="fas fa-edit"></i>
    </button>
</div>

En resumen solo necesito que al dar clic tomar ese valor y mostrarlo en un input.

Agradecería mucho me iluminen.

1 respuesta 1

2

Tu pregunta es muy amplia y solo colocas un pequeño fragmento de código correspondiente al botón creado dinámicamente, basándonos en lo que preguntas que solo es mostrar el valor del atributo id_curso en el modal, lo que debes hacer es:

  1. Agregar una clase al button ej. id_curso
  2. En js hacer uso del metodo attr() de jquery con el cual obtienes el valor del atributo de la siguiente manera $(this).attr("id_curso");
  3. Ahora ya solo muestra el valor de tu atributo en el input del modal ej. $("#txt_cursos").val(curso);

Te dejo un ejemplo funcional que espero te ayude.

$(document).ready(function() {
  $("#table_example").on("click", ".idCurso", function() {
    let curso = $(this).attr("id_curso");
    $("#txt_cursos").val(curso);
    console.log(curso);
  });
})
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>


<div class="container">
  <h2>Basic Table</h2>
  <table id="table_example" class="table">
    <thead>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Email</th>
        <th>Curso</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>John</td>
        <td>Doe</td>
        <td>[email protected]</td>
        <td><button class="btn btn-danger idCurso" id_curso="Curso 1" data-toggle="modal" data-target="#exampleModal">Curso 1</button></td>
      </tr>
      <tr>
        <td>Mary</td>
        <td>Moe</td>
        <td>[email protected]</td>
        <td><button class="btn btn-danger idCurso" id_curso="Curso 2" data-toggle="modal" data-target="#exampleModal">Curso 2</button></td>
      </tr>
      <tr>
        <td>July</td>
        <td>Dooley</td>
        <td>[email protected]</td>
        <td><button class="btn btn-danger idCurso" id_curso="Curso 3" data-toggle="modal" data-target="#exampleModal">Curso 3</button></td>
      </tr>
    </tbody>
  </table>
</div>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-4">
            <input id="txt_cursos" type="text" name="txt_cursos" value="" class="form-control">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

1

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.