... @for($i = 0; $i < 5; $i...">

How can I pass a parameter to modal on laravel 5.3?

My opinion is this:

<table class="table table-bordered">
    ...
    <tr>
        @for($i = 0; $i < 5; $i++) 
        <td id="image-view-li-{{$i}}" style="display: none" data-toggle="modal" data-target="#modal-option">
            <img id="image-view-{{$i}}" src="https://myshop.co.id/img/shop1.jpg" alt="">
        </td>

        @section('modal')
        @include('components.modal.option',['i'=>$i]) 
        @endsection
        @endfor
    </tr>
    ...
</table>

      

When I click the td button it is called by the modal

My modal looks like this:

<div id="modal-option" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <div class="form-horizontal">
                    <div class="form-group">
                        <a href="javascript:" id="image-edit-{{$i}}">
                            <span class="fa fa-pencil"></span>
                        </a>
                    </div>
                    <div class="form-group">

                        <a href="javascript:" class="text-danger" id="image-delete-{{$i}}">
                            <span class="fa fa-trash"></span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

      

I want to pass a parameter $i

to modal

For example I press td which has $ i = 3. Then it will pass the parameter $ i = 3 to the modal

I tried it like my code above

But, the $ id sent is always 0

How can I solve this problem?

Update

I found a solution

@for($i = 0; $i < 5; $i++) 
<td id="image-view-li-{{$i}}" style="display: none" data-toggle="modal" data-target="#modal-option-{{$i}}">
    <img id="image-view-{{$i}}" src="https://myshop.co.id/img/shop1.jpg" alt="">
</td>
@include('components.modal.option',['i'=>$i]) 
@endfor


<div id="modal-option-{{$i}}" class="modal" tabindex="-1" role="dialog">
    ...
</div>

      

Works

+3


source to share


2 answers


I am assuming you are loading modal javascript or jquery when you click on the td. Now, what do you think javascript will pick up the variable that was generated by PHP. You need to add an attribute on the td that contains the id and add logic in javascript so that when the td button is clicked, it will select the value of the attribute carrying the id. I hope you understand the concept



+1


source


Why should you wrap a modal modal section? Perhaps you need this solution?



<table class="table table-bordered">
    ...
    <tr>
        @for($i = 0; $i < 5; $i++) 
        <td id="image-view-li-{{$i}}" style="display: none" data-toggle="modal" data-target="#modal-option">
            <img id="image-view-{{$i}}" src="https://myshop.co.id/img/shop1.jpg" alt="">

            @include('components.modal.option',['i'=>$i])
        </td>
        @endfor
    </tr>
    ...
</table>

      

0


source







All Articles