0

Estoy usando Laravel 5.4 con una base de datos en MariaDB, y para el frontend uso el framework Materialize.css y ahora como bien dice el titulo, tengo una tabla con registros de usuarios. Y la tabla la lleno con el siguiente codigo laravel.

<table class="bordered highlight table-responsive">
    <thead>
        <tr class="table-users">
            <th>ID</th>
            <th>Tipo de Usuario</th>
            <th>Primer Nombre</th>
            <th>Primer Apellido</th>
            <th>UserName</th>
            <th>Editar</th>
        </tr>
    </thead>
    <tbody>
        @foreach($permisions as $permision)
            <tr>
                <td>{{ $permision->user->id }}</td>
                <td>{{ $permision->user->userType->name }}</td>
                <td>{{ $permision->user->f_name }}</td>
                <td>{{ $permision->user->f_lastname }}</td>
                <td>{{ $permision->user->username }}</td>
                <td><a href="#updateUser" class="btn-floating btn-small waves-effect waves-light blue"><i class="material-icons">mode_edit</i></a></td>
            </tr>
        @endforeach
   </tbody></table>

De forma que lo llena asíintroducir la descripción de la imagen aquí

Ahora en el boton de editar, llamo a un modal de materialize y entonces yo tengo mi estructura html. Nota: les pongo una parte de dos input, que quiero que de esos dos inputs segun la informacion me los envie al modal.

@foreach($permisions as $permision)
<div class="row">
    <div class="input-field col s12 m6">
        <i class="material-icons prefix">account_circle</i>
        <input value="{{ $permision->user->f_name }}" title="Solo puede ingresar letras en este campo." id="Primer nombre" type="text" class="validate" required>
        <label for="Primer nombre">Primer nombre:</label>
    </div>

    <div class="input-field col s10 m6 push-s1">
        <input value="{{ $permision->user->s_name }}" title="Solo puede ingresar letras en este campo." id="Segundo nombre" type="text" class="validate" required>
        <label for="Segundo nombre">Segundo nombre:</label>
    </div>
</div>@endforeach

Entonces que sucede con esto, intento mandar los datos, lo cual si lo hace pero, hay un problema como ya se sabran o se han dado cuenta, repite todos los datos que tengo en mi tabla, y pone a cada usuario, de cual me los muestra así:introducir la descripción de la imagen aquí

Como ven repite todos los datos, obviamente se que lo hace asi por el @foreach de laravel, si alguien me puede ayudar de manera que solo me agarre segun la fila donde yo di click para editar el usuario. Que si le doy al boton de la primera fila, en este caso el modal deberia de mandarme solo el primer nombre: Oscat y segundo nombre: Ernesto, y asi depende de que fila se le da click al boton de editar. De ante mano muchas gracias. O tambien si tienen otra forma de hacerlo con Javascript pues tambien esta bienvenido. Gracias por leer

1 respuesta 1

3

Bueno, el problema es que estás haciendo un foreach dentro del modal y esta hace que recorra todos los registros, la solución sería lo siguiente.

<table class="bordered highlight table-responsive">
    <thead>
        <tr class="table-users">
            <th>ID</th>
            <th>Tipo de Usuario</th>
            <th>Primer Nombre</th>
            <th>Primer Apellido</th>
            <th>UserName</th>
            <th>Editar</th>
        </tr>
    </thead>
    <tbody>
        @foreach($permisions as $permision)
        <tr>
            <td>{{ $permision->user->id }}</td>
            <td>{{ $permision->user->userType->name }}</td>
            <td>{{ $permision->user->f_name }}</td>
            <td>{{ $permision->user->f_lastname }}</td>
            <td>{{ $permision->user->username }}</td>
            <td><a href="#updateUser{{ $permision->user->id }}" class="btn-floating btn-small waves-effect waves-light blue"><i class="material-icons">mode_edit</i></a></td>
        </tr>
        <div id="#updateUser{{ $permision->user->id }}" class="modal">
            <div class="modal-content">
                <div class="row">
                    <div class="input-field col s12 m6">
                        <i class="material-icons prefix">account_circle</i>
                        <input value="{{ $permision->user->f_name }}" title="Solo puede ingresar letras en este campo." id="Primer nombre" type="text" class="validate" required>
                        <label for="Primer nombre">Primer nombre:</label>
                    </div>

                    <div class="input-field col s10 m6 push-s1">
                        <input value="{{ $permision->user->s_name }}" title="Solo puede ingresar letras en este campo." id="Segundo nombre" type="text" class="validate" required>
                        <label for="Segundo nombre">Segundo nombre:</label>
                    </div>
                </div>
            </div>
        </div>
        @endforeach
    </tbody>
</table>

Ponemos el modal dentro del foreach de la tabla, es decir recorrerá todos los registros y al momento de activar una ventana modal lo llamaremos mediante el href="#updateUser{{ $permision->user->id }}", que coincida.

Ahora es una mala practica poner una ventana modal de esa manera, puedes crear un nuevo archivo update-modal.blade.php, y llamar a este archivo.

Dentro de update-modal.blade.php:

    <div id="#updateUser{{ $permision->user->id }}" class="modal">
        <div class="modal-content">
            <div class="row">
                <div class="input-field col s12 m6">
                    <i class="material-icons prefix">account_circle</i>
                    <input value="{{ $permision->user->f_name }}" title="Solo puede ingresar letras en este campo." id="Primer nombre" type="text" class="validate" required>
                    <label for="Primer nombre">Primer nombre:</label>
                </div>

                <div class="input-field col s10 m6 push-s1">
                    <input value="{{ $permision->user->s_name }}" title="Solo puede ingresar letras en este campo." id="Segundo nombre" type="text" class="validate" required>
                    <label for="Segundo nombre">Segundo nombre:</label>
                </div>
            </div>
        </div>
    </div>

Y en tu archivo actual.

<table class="bordered highlight table-responsive">
    <thead>
        <tr class="table-users">
            <th>ID</th>
            <th>Tipo de Usuario</th>
            <th>Primer Nombre</th>
            <th>Primer Apellido</th>
            <th>UserName</th>
            <th>Editar</th>
        </tr>
    </thead>
    <tbody>
        @foreach($permisions as $permision)
        <tr>
            <td>{{ $permision->user->id }}</td>
            <td>{{ $permision->user->userType->name }}</td>
            <td>{{ $permision->user->f_name }}</td>
            <td>{{ $permision->user->f_lastname }}</td>
            <td>{{ $permision->user->username }}</td>
            <td><a href="#updateUser{{ $permision->user->id }}" class="btn-floating btn-small waves-effect waves-light blue"><i class="material-icons">mode_edit</i></a></td>
        </tr>
        @include('carpeta.update-modal') 
        @endforeach
    </tbody>
</table>

Prácticamente haría lo mismo, pero se ve mejor ordenado.

1
  • Gracias por tu respuesta! Y si tienes razón que no es una buena practica al no usar otra ruta con laravel para manejar su MVC el 25 may. 2017 a las 19:47

Tu Respuesta

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

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