블레이드 (Laravel) 템플릿 루프 안에 확인 모달 (부트 스트랩) 추가하기

Question

나는 현재 사용자 테이블 내의 원하는 사용자의 삭제 버튼을 클릭 할 때 좋은 확인 화면을 만들려고합니다. 내 문제는 부트 스트랩 모달을 사용하여 사용자를 삭제할 수 없다는 것입니다. 모달이 루프 안에 배치되지 않은 경우 마지막 사용자를 삭제하지만 루프 내부에 발견 된 항목만큼 모달을 인쇄합니다. .

내 코드는 다음 (그것이 있어야 루프, 외부 모달를 배치!)입니다

<div class="panel panel-default"> 
    <div class="panel-body"> 
     <div class="row"> 
      <div class="col-md-9"> 
       <table class="table table-striped table-bordered"> 
        <thead> 
         <tr> 
          <td>Usuario</td> 
          <td>Nombre</td> 
          <td>Apellido</td> 
          <td>Email</td> 
          <td>Acceso</td> 
         </tr> 
        </thead> 
        <tbody> 
         @foreach($users as $key => $value) 
          <tr> 
           <td>{{ $value->username }}</td> 
           <td>{{ $value->first_name }}</td> 
           <td>{{ $value->last_name }}</td> 
           <td>{{ $value->email }}</td> 
           <td>{{ $value->role }}</td> 
           <td> 
            <a class="btn btn-small btn-success" href="{{ URL::to('usuarios/' . $value->id) }}">Mostrar</a> 
            <a class="btn btn-small btn-warning" href="{{ URL::to('usuarios/' . $value->id . '/edit') }}">Editar</a> 
            <a class="btn btn-small btn-danger" href="#" data-toggle="modal" data-target=".delete-user-modal">Borrar</a> 
           </td> 
          </tr> 
         @endforeach 
        </tbody> 
       </table> 
      </div> 
      <div class="col-md-3"> 
       <a class="btn btn-small btn-info" href="#" data-toggle="modal" data-target=".create-user-modal">Crear usuario</a><br /> 
       {{ HTML::ul($errors->all()) }} 
      </div> 
     </div> 
    </div> 
</div> 

<div class="modal fade delete-user-modal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" > 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
       <h4 class="modal-title">Eliminar usuario</h4> 
      </div> 
      <div class="modal-body"> 
       <p>¿Estás seguro que deseas elminar el usuario <strong>{{ Auth::User()->username }}</strong>?</p> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button> 
       &nbsp; 
       {{ Form::open(array('url' => 'usuarios/' . $value->id, 'class' => 'pull-right')) }} 
        {{ Form::hidden('_method', 'DELETE') }} 
        {{ Form::submit('Borrar', array('class' => 'btn btn-primary')) }} 
       {{ Form::close() }} 
      </div> 
     </div> 
    </div> 
</div> 

public function destroy($id) 
{ 
    // buscar y eliminar usuario 
    $user = User::find($id); 
    $user->delete(); 

    // redirigir a usuarios con mensaje mensaje 
    return Redirect::to('usuarios'); 
} 

Answer 1

쉽게 모달로 {{$ 가치 -> ID}} 추가하여 고정 결국 CSS 클래스 '를 사용하여 루프 내부를 클릭했을 때만 열 수 있습니다. 다음과 같이 코드를 간다 :

<a class="btn btn-small btn-danger" href="#" data-toggle="modal" data-target=".delete-user-modal{{ $value->id }}">Borrar</a> 

<div class="modal fade delete-user-modal{{ $value->id }}" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" > 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <h4 class="modal-title">Eliminar usuario</h4> 
     </div> 
     <div class="modal-body"> 
      <p>¿Estás seguro que deseas eliminar el usuario <strong>{{ $value->username }}</strong>?</p> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button> 
      &nbsp; 
      {{ Form::open(array('url' => 'usuarios/' . $value->id, 'class' => 'pull-right')) }} 
       {{ Form::hidden('_method', 'DELETE') }} 
       {{ Form::submit('Borrar', array('class' => 'btn btn-primary')) }} 
      {{ Form::close() }} 
     </div> 
    </div> 
</div>