Laravel, übergeben Sie den Wert beim Drücken der Taste

Question

Ich habe einen modalen Pop-out, wenn Sie eine Taste drücken. Problem ist, wie übergibt man den Wert an das Modal?

Meine Tabelle wie in der Abbildung unten gezeigt. Wie Sie sehen können, hat jede Zeile eine andere ID. Ich wollte die ID einer bestimmten Reihe nach auf die Schaltfläche

meinen Code gedrückt bekommen:

@foreach($company as $cmp) 
<tr> 
    <td>{{ $cmp->number }}</td> 
    <td>{{ $cmp->name}}</td> 
    <td> <a type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" </td 
</tr> 

@endforeach 

Answer 1

Sie benötigen Schleife zu der Modal, sondern in einer separaten Ansicht, die id muss von Ihrem $cmpvar aufgerufen werden, um den HTML id des modalen und des Auslöserknopfes dynamisch zuzuweisen:

@foreach($company as $cmp) 
<tr> 
    <td>{{ $cmp->number }}</td> 
    <td>{{ $cmp->name}}</td> 
    <td> <a type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modal{{$cmp->id}}" </td 
</tr> 
@include('path.modal')//Path of the view of a modal 
@endforeach 

In einer separaten Ansicht:

<!-- modal.blade.php --> 
<div class="modal fade" id="modal{{$cmp->id}}"role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     ... 
     </div> 
    </div> 
</div> 

Answer 2

Ich nehme an, Sie Bootstrap für Ihre Layouts verwenden. Documentation schlägt vor, dass Sie data- Attribute binden, um Werte an Ihr Modal zu übergeben. Sie können jQuery verwenden, um das Ereignis show.bs.modal dafür zu behandeln.

Sie sollten Ihrer Schaltfläche einen eindeutigen Bezeichner hinzufügen. Zum Beispiel data-modal-id. Wie folgt aus:

@foreach($company as $cmp) 
<tr> 
    <td>{{ $cmp->number }}</td> 
    <td>{{ $cmp->name }}</td> 
    <td> 
     <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" data-modal-id="{{ $cmp->number }}">Button</button> 
    </td> 
</tr> 
@endforeach 

Und in Ihrem javascript:

$('#myModal').on('show.bs.modal', function (event) { 
    var button = $(event.relatedTarget); 
    var modal_id = button.data('modal-id');; 
    var modal = $(this); 
    // do whatever you want with your modal and modal_id 
});