使用模态框更新方法 laravel

Question

不幸的是，我的更新方法有效，它总是更新错误的数据，在这种情况下，它总是更新我的数据库列表中的最后一个数据。我相信发生这种情况是因为我的模式框指向 $user->id，它总是指向最后一个 id，因为我在顶部使用了一个 for 循环，有没有办法将它指向选定的 id？

view.blade.php

<div class="well col-xs-9 col-sm-9 col-md-9 col-lg-9 col-xs-offset-1 col-sm-offset-1 col-md-offset-1 col-lg-offset-1">
    @foreach ($users as $user)
    <div class="row user-row">
    <!--div class="col-xs-3 col-sm-2 col-md-1 col-lg-1">
        <img class="img-circle"
             src="https://lh5.googleusercontent.com/-b0-k99FZlyE/AAAAAAAAAAI/AAAAAAAAAAA/eu7opA4byxI/photo.jpg?sz=50"
             alt="User Pic">
         </div-->
         <div class="col-xs-2 col-sm-3 col-md-4 col-lg-4">
            <h5 style="font-weight: bold">{{ $user->name }}</h5>
         </div>
         <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 dropdown-user" data-for=".{{ $user->id }}">
          <h5 class="glyphicon glyphicon-chevron-down text-muted pull-right">&nbsp;</h5>
      </div>
  </div>
  <div class="row user-infos {{ $user->id }}">
      <div class="col-xs-12 col-sm-12 col-md-10 col-lg-10 col-xs-offset-0 col-sm-offset-0 col-md-offset-1 col-lg-offset-1">
         <div class="panel panel-info">
            <div class="panel-heading">
               <h2 class="panel-title">User Information</h2>
           </div>
           <div class="panel-body">
               <div class="row">
                <div class=" col-md-10 col-lg-10 hidden-xs hidden-sm">
                   <div class="col-xs-5">User level:</div><div class="col-xs-5"> {{ $user->role->role_description }}</div>
                   <div class="col-xs-5">Email:</div> <div class="col-xs-5"> {{ $user->email }}</div>
                   <div class="col-xs-5">Phone number: </div> <div class="col-xs-5"> {{ $user->mobile }} </div>
                   <div class="col-xs-5">Office extension: </div> <div class="col-xs-5"> [ TO IMPLEMENT ]</div>
               </div>
           </div>
       </div>
       <div class="panel-footer">
          <button class="btn btn-sm btn-warning" type="button"
          data-toggle="modal" data-target="#form">Edit&nbsp;<i class="glyphicon glyphicon-edit"></i></button>
          <span class="pull-right">
             <button class="btn btn-sm btn-danger" type="button">Inactive&nbsp;<i class="glyphicon glyphicon-remove"></i></button>
         </span>
     </div>
 </div>
</div>
</div> 
@endforeach             
</div> 

@if(Session::has('flash_message'))
    <div class="alert alert-success col-xs-9 col-sm-9 col-md-9 col-lg-9 col-xs-offset-1 col-sm-offset-1 col-md-offset-1 col-lg-offset-1">
        {{ Session::get('flash_message') }}
    </div>
@endif

<div class="col-sm-offset-1 col-sm-2">

    <!-- Trigger the modal with a button -->
    <button type="button" class="btn btn-info btn-md" data-toggle="modal" data-target="#form">Register New User</button>

    <!-- Modal -->
    <div id="form" class="modal fade" role="dialog">
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
               <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title">User Information</h4>
              </div>
              <div class="modal-body">
                  <form class="form-horizontal" role="form" action="/manage_accounts/{{ $user->id }}" novalidate>
                   <input type="hidden" name="_method" value="PUT">
                   <input type="hidden" name="_token" value="{{ csrf_token() }}">
                   <div class="form-group">
                    <label class="control-label col-sm-3" for="name">Username:</label>
                    <div class="col-sm-5 @if ($errors->has('name')) has-error @endif"> 
                       <input type="text" class="form-control" type="hidden" id="name" name="name" placeholder="Enter username">
                       @if ($errors->has('name')) <p class="help-block">{{ $errors->first('name') }}</p> @endif
                   </div>
               </div>

...

Answer 1

您的模式正在引用 $user 对象，但它在您的 foreach 循环之外。

具体这一行：

<form class="form-horizontal" role="form" action="/manage_accounts/{{ $user->id }}" novalidate>

您可以为模态弹出按钮注册一个 onClick 事件，它会获取用户 ID 的隐藏输入字段并动态更新操作 URL。或者，您可以让操作 URL 相同并处理逻辑服务器端。这种方法将为您要更新的用户 ID 隐藏一个输入字段，但比处理 URL 结构要简洁得多。

编辑：

Javascript 示例：

<script type="text-javascript">
                    $(function() {
                      $('.btn--edit').on('click', function() {
                        var formAction = $('.form-horizontal').attr('action').replace(/(?!.*/).*, '');
                        var userId = $(this).closest('[name=user_id]').val();
                        $('.form-horizontal').attr('action', formAction + '/' + userId);
                      });
                    });
                    </script>

这需要您使用 class 名称 .btn 更新模态按钮--编辑

<button class="btn btn-sm btn-warning btn--edit" type="button" data-toggle="modal" data-target="#form">Edit&nbsp;<i class="glyphicon glyphicon-edit"></i></button>

这还需要您在 foreach 某处添加隐藏输入。我在用户信息 class.

之后选择

<input type="hidden" name="user_id" value="{{ $user->id }}" />

Answer 2

这就是我的更新方法的工作原理。

 <form class="form-horizontal" role="form" method="POST" action="/manage_accounts/" novalidate>
          <input type="hidden" name="_method" value="PUT">

Javascript:

<script type="text/javascript">
$(function() {

  $('.btn--edit').on('click', function(e) {
    var userId = $(this).attr('data-for');
    var formAction = "/manage_accounts/" + userId;

    $('.form-horizontal').attr('action', formAction);
  });
</script>

class 名称为 .btn 的模态按钮--编辑，

<button class="btn btn-sm btn-warning btn--edit" type="button" 
          data-toggle="modal" data-target="#update" data-for="{{$user->id}}">Edit&nbsp;<i class="glyphicon glyphicon-edit"></i></button>

使用模态框更新方法 laravel

Update method laravel using modal box

modal-dialog

laravel

laravel-5.1