laravelのブレードファイルのHTMLモーダル内にIDを取得できません

Question

私はlaravelでプロジェクトをやっています。私は、laravelのブレードファイルにforeachループを使って表示されたデータベース内の複数のレコードを持っています。各レコードには、保留中のボタンがあります。ユーザがペンデングボタンをクリックするたびに、htmlモーダルが開きます。私はそのレコードIDをモーダル内に入れたいが、常に最初のレコードIDをとる。私のブレード・ファイルがクリックされたどちらの記録

@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 

、それは常に最初のレコードのidとして$ newprovider-> IDを返す、のように見えます。私はどこが間違っているのか分かりません。助けてくれてありがとう。

Answer 1

はモーダルの仕事を得るためにこれらの事を行います。

編集ボタンへ：へ

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

そしてモーダルコンテナ：私はこれで.on（shown.bs.modal）関数を呼び出す方法

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

Answer 2

すべてのモーダルトリガーボタンはdata-target="#Pendingnote"です。つまり、すべてのモーダルトリガーボタンは、それらのすべてが見つけられるidで最初のモーダルをトリガーします。私が代わりにモーダル内部formを持つことがとにかくお勧めし

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

：

あなたはdata-target属性を削除たとえばしようとするように、jQueryのビットでモーダルを引き起こす可能性があります。だから、jQueryのは、次のようになります。

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

最後に、このを見てみましょう：http://getbootstrap.com/javascript/#modals-related-target