JDubbleU JDubbleU - 11 months ago 66
PHP Question

Can't change title of modal using Laravel

I've created a resource database using Laravel, and have the option to (flag, edit, and/or delete) a resource. When I hit the 'flag' button a modal pops up for you to add input as to why you're flagging the resource. I'd like for the title of the modal to show which resource was clicked, and I have it working, but in this instance I cannot change the title of the modal regardless of which resource I flag. Here's some of my code, hopefully it'll be more clear.

Resource View

@foreach($resources as $resource) @foreach ($resource->locations as $location)

<td> <a class="btn btn-small btn-default" style="float:right; margin-right:5px;" href="{{ URL::to('resource/addToCart/' .$resource->Resource_ID) }}">+</a> {{ $resource->Name }}</td>
<td>{{ $resource->Description }}</td>
<td>{{ $location->Address }}</td>
<td>{{ $location->City }}</td>
<td>{{ $location->Zip_Code }}</td>
<td>{{ $location->County }}</td>
<button type="button" class=" msgBtn btn btn-default" style=" display:inline; margin-right:auto;"><a href="pages/editresources/{{$resource['Resource_ID']}}">Edit</a>
<button type="button" class=" msgBtn2 btn btn-default" id="flagged" data-toggle="modal" data-target="#flagResource" style="display:inline; margin-right:auto;"><a href="#">Flag</a>
<button type="button" class=" msgBtn3 btn btn-default" style="display:inline; margin-right:auto;"><a href="setdelete/{{$resource['Resource_ID']}}">Delete</a>


So, when the middle button is clicked, it brings up the modal which looks like this

Modal View

<div class="modal fade" id="flagResource"
tabindex="-1" role="dialog"
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close"
<span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"
id="flagged" style="text-align:center;"> {{ $resource->Name }}
<div class="modal-body">
{!! Form::open(['method' => 'POST', url('FlagsController@addFlag'), $resource->id ]) !!}
<div class="form-group">
{!! Form::label('reason', 'Reason for Flag: ') !!}
{!! Form::textarea('Reason', null, ['class' => 'form-control']) !!}

<div class="form-group">
{!! Form::label('comments', 'Other Comments: ') !!}
{!! Form::text('Comments', null, ['class' => 'form-control']) !!}

<div class="modal-footer">
<button type="button"
class="btn btn-default"
<span class="pull-right">
<button type="button" class="btn btn-primary" style="margin-left:5px;">

So whenever I click flag on ANY resource, It shows this:


I can't figure out why it keeps showing up that as my title. Any help would be great, thanks!

Answer Source

The modal uses this data:


You probably have the modal somewhere after your foreach in your code, so $resource is filled with data from the last row in this loop:

@foreach($resources as $resource) @foreach ($resource->locations as $location)
       <td> <a class="btn btn-small btn-default" style="float:right; margin-right:5px;" href="{{ URL::to('resource/addToCart/' .$resource->Resource_ID) }}">+</a> {{ $resource->Name }}</td>

What you should do is send more data to the modal so it can show the correct information. So in your loop you should attach more data for every row.

I am assuming you are using bootstrap for the modal. In version 3.2.0 you can do something like this to add this data:

<a href="#my_modal" data-toggle="modal" data-resource-id="{{ $resource->Resource_ID }}" data-resource-name="{{ $resource->Name }}">Flag</a>

And use javascript to get the variables and set them in your modal instead of using $resource->Name.

$('#my_modal').on('show.bs.modal', function(e) {
    var resourceId = $(e.relatedTarget).data('resource-id');
    var resourceName = $(e.relatedTarget).data('resource-name');