0

A continuación les muestro una tabla dinámica la cual lleno a través de un API, quisiera me apoyaran en lo siguiente.

    function llenarTabla() {
    document.querySelector('#tabla-usuarios 
       tbody').innerHTML = '';
         for (let i = 0; i < usuarios.length; i++) {
      document.querySelector('#tabla-usuarios 
        tbody').innerHTML +=
        `<tr>
    <td>${usuarios[i].nombre} </td>
    <td>${usuarios[i].fechaNacimiento}</td>
    <td>${usuarios[i].email}</td>
    <td>${usuarios[i].usuario}</td>
    <td>${usuarios[i].rol}</td>
    
    <input type="hidden" name="nombre" 
     value="${usuarios[i].nombre} ">
    <input type="hidden" name="fechaNacimiento" 
     value="${usuarios[i].fechaNacimiento}">
    <input type="hidden" name="email" 
     value="${usuarios[i].email} ">
    <input type="hidden" name="usuario" 
     value="${usuarios[i].usuario}">
    <input type="hidden" name="rol" 
       value="${usuarios[i].rol}">

    <td>
    <button type="button" 
     onclick="eliminar(${i})">X</button>
    <button type="button" 
      onclick="seleccionar(${i})">Seleccionar</button>
    <input type="submit" name="boton" value="Editar"> 
    </td>
    </tr>`;
      }
     }

Lo que quiero realizar es que al seleccionar a un usuario los datos de ese usuario se pasen otro formulario en el cual yo pueda mostrarlos en inputs de tipo texto.

La función llenarTabla la lleno a traves de la siguiente función

       function obtenerUsuarios() {
        axios({
        method: 'GET',
        url: 'http://dynns.com/api/App/consultausu',
       responseType: 'json'
        }).then(res => {
         console.log(res.data);
        this.usuarios = res.data;
         llenarTabla();
        }).catch(error => {
         console.error(error);
        });

              }
            obtenerUsuarios();

La funcion seleccionar por el mometo solo redirecciona, pero no sé como pasarle los datos para así enviarlos a la página que quiero

   function seleccionar(usuario) {
   console.log('Se seleccionó el usuario' + `${usuarios[usuario].usuario}`);

    axios({
    method: 'POST',
    url: window.location.href = 
   'http://localhost/LaudemAVE/sistema/actualizarUsuario.php',
   
      }).then(res => {
     console.log(res);

     }).catch(error => {
     console.error(error);
    });
      }
7
  • Por favor muestra la función seleccionar() para saber qué hace, o indica qué quieres que haga. ¿Como obtienes el array de usuarios? ¿tienen algún identificador? En mi caso, hace falta información para poder ayudarte.
    – quevedo
    Commented el 21 sept. 2020 a las 23:35
  • Ya he editado la pregunta amigo, espero puedas apoyarme Commented el 21 sept. 2020 a las 23:41
  • 1. en la plantilla asigna ponle ids a los tr para facilitar su acceso algo así: como <tr id="linea-${i}"> pues estás pasando ${i} como parámetro al método. De modo que lo consistente es usarlo para leer la línea seleccionada. (guarda copia de la pregunta, pues te voy a llevar de la mano)
    – quevedo
    Commented el 21 sept. 2020 a las 23:48
  • Gracias amigo, no sé si será mucho pedir que nos comuniquemos por gmail por favor, te dejo mi correo [email protected] Commented el 21 sept. 2020 a las 23:53
  • una pregunta console.log('Se seleccionó el usuario' + ${usuarios[usuario].usuario}); te muestra el usuario? Nos ahorramos muchuos pasos si la variable usuario es visible en el método.
    – quevedo
    Commented el 21 sept. 2020 a las 23:55

1 respuesta 1

0

Tienes dos problemas en la petición AJAX:

  1. En lugar de especificar solo la URL también estás modificando la ubicación del navegador: url: **window.location.href** = 'http://localhost/LaudemAVE/sistema/actualizarUsuario.php', no estoy seguro si realiza la petición AJAX o solo una redirección... ¿o ambas?
  2. No estás enviando parámetros
function seleccionar(usuario) {
   console.log('Se seleccionó el usuario' + `${usuarios[usuario].usuario}`);

    axios({
        method: 'POST',
        // Solo URL
        url: 'http://localhost/LaudemAVE/sistema/actualizarUsuario.php',
        // Enviar dato de usuario
        data: { usuario: usuarios[usuario].usuario }
      }).then(res => {
     console.log(res);

     }).catch(error => {
     console.error(error);
    });
 }

En PHP debes recibir sin problema el parámetro en $_POST['usuario'];, pero me queda la inquietud de pareces tener todos los usuarios cargados en un arreglo y, probablemente, no haya necesidad de una petición AJAX para mostrar el formulario.

1
  • Si exacto amigo, como tal es una tabla html, la cual genero dinamicamente en js, los datos están en un arreglo que se llama usuarios[]; voy a intentar la manera, solo le agrego los paramatros en donde esta tu comentario de //Enviar dato de usuario? Commented el 22 sept. 2020 a las 17:59

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.