CODEWITHSUNDEEP
phplaravel
AmarjaPatil4
AmarjaPatil4

Reputation: 1650

Unable to get id inside html modal of laravel's blade file

I am doing project in laravel. I have multiple records in databse which I have displayed in laravel's blade file using foreach loop. Each record have pending button. Whenever user clicks on pending button it opens a html modal. I want that record id inside the modal but it always take first record id. My blade file looks like,

 @foreach($providerData as $newprovider)
<h4>Name:{{$newprovider->name}}</h4>
 <button class="btn btn-default" data-toggle="modal" data-target="#Pendingnote">Pending</button>

{!! Form::model( $newprovider->id ,['method' => 'PATCH','action'=>['superadminController@pendingProvider', $newprovider->id]]) !!}

<div class="modal fade" id="Pendingnote" role="dialog">

    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Note {!! $newprovider->id !!}</h4>
            </div>
            <div class="modal-body">
                <input type="text" class="form-control" name="note" value="{{ old('note') }}">
            </div>
            <div class="modal-footer">
                {!! Form::submit('Add', ['class' => 'btn btn-default']) !!}
            </div>
        </div>
    </div>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
</div>    
{!! Form::close() !!}
@endforeach

Whichever record is clicked, it always returns $newprovider->id as first record's id. I don't know where I am getting wrong. Please help and thanks in advance.

Upvotes: 1

Views: 1856

Answers (2)

Claudio King
Claudio King

Reputation: 1616

Do these things in order to get the modals work.

Edit the button to:

<button class="btn btn-default" data-toggle="modal" data-target="#Pendingnote{{$newprovider->id}}">Pending</button>

And the modal container to:

<div class="modal fade" id="Pendingnote{{$newprovider->id}}" role="dialog">

Upvotes: 1

alepeino
alepeino

Reputation: 9761

All modal-triggering buttons have data-target="#Pendingnote", which means they all trigger the first modal with that id they can find.

You could try for instance removing the data-target attribute and trigger the modal with a bit of jQuery, like:

$('button[data-toggle]').on('click', function () {
  $(this).next('form').find('.modal').modal('show');
});

I would suggest anyway to have the forminside the modal instead. So the jQuery would be:

$('button[data-toggle]').on('click', function () {
  $(this).next('.modal').modal('show');
});

Lastly, take a look at this: http://getbootstrap.com/javascript/#modals-related-target

Upvotes: 0

Related Questions