Clever Geek Handbook

Different output inside modal (Laravel 5.4)

I have this code in my trip.blade.php. The problem is my workers $ t-> are out of modal, I fetch all my employees, but when I put my $ t-> employees in my modal, I can only get 1 Data. I cannot figure out any error in this scenario.

@foreach($trips as $t)
<tr> 
    <td>{{$t->id}}</td> 
    <td>{{$t->dateMilled_trip}}</td>
    <td>{{$t->ticket->ticketNumber_ticket}}</td>	
    <td>{{$t->truckNumber_trip}}</td>
    <td>{{$t->finalWeight_trip}}</td>
    <td>


    {{$t->employees}} -> Here it shows all the employees inside trip



        <a class="btn btn-info btn-xs" data-toggle="modal" data-target="#viewEmployeesAttendanceTicket">View Employees Attendance</a>
        <!-- Modal -->
        <div class="modal fade" id="viewEmployeesAttendanceTicket" tabindex="-1" role="dialog" aria-labelledby="James Order List">
            <div class="modal-dialog" role="document">
                <div class="modal-content">


                    {{$t->employees}} ->Here it show only 1 employee data




                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">{{$t->ticket->ticketNumber_ticket}} Attendances</h4>
                    </div>
                    <div class="modal-body">
                        <table class="table table-striped"> 
                            <thead> 
                                <tr> 
                                    <th>#</th> 
                                    <th>Employee Name</th>  
                                </tr>
                            </thead> 
                            <tbody>
                            @foreach($t->employees as $emp) ->same here [1 Data only]
                            <tr> 
                                <td>{{$emp->id}}</td> 
                                <td>{{$emp->name_employee}}</td> 
                            </tr> 
                            @endforeach 

                            </tbody> 
                        </table>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>    
    </td> 
    <td>
        <div class="btn-group" role="group" aria-label="...">
            <a class="btn btn-danger btn-xs">DELETE</a>
        </div>
    </td> 
</tr>
@endforeach
Run codeHide result


Screenshot enter image description here

+3


source to share


1 answer


short answer but not the best practice is to change these lines below

 <a class="btn btn-info btn-xs" data-toggle="modal" data-target="#viewEmployeesAttendanceTicket_{{$t->id}}">View Employees Attendance</a>
        <!-- Modal -->
        <div class="modal fade" id="viewEmployeesAttendanceTicket_{{$t->id}}" tabindex="-1" role="dialog" aria-labelledby="James Order List">

you can try this first if it works and then discuss the problem.



I've had this case before. what happens on your page, you make a lot of lines and in each of them you create a modal with id viewEmployeesAttendanceTicket

, so there are many modals with the same id viewEmployeesAttendanceTicket

, and when trying to display any of them, they will always display the same modal - the first one I think so you have two approaches. The first is to differentiate the modals as mentioned above, but this solution is not very good if you have a lot of strings as you will have so many modals loaded with data.

a smoother solution is to have one modal updateable jquery. if you need help writing please leave me a comment

+2


source






More articles:


All Articles