只有Javascript/Laravel的First ID适用于按钮

Question

我正在使用laravel，并且正在循环使用编辑按钮来显示我的所有用户。我想用javascript隐藏用户编辑表单，并在单击时显示它。这适用于数组中的第一个项目，但当我尝试编辑第二个用户时，按钮将不起作用。有没有办法直接用laravel在表单中插入id？我知道这是因为身份证被重申了，但我不知道如何解决这个问题。

users.index

@extends('layouts.admin')

@section('content')

<div class="col-sm-8">
<div class="panel">

@if($users)
@foreach($users as $user)
<p>{!! $user->name !!}</p>
<button class="btn btn-primary" id="edit-user"> Edit</button>
<hr>
<div class="edit-user">
<h1>Edit Users</h1>
{!! Form::open(['method'=>'POST', 'action'=>'AccountController@store']) !!}
<div class="form-group">
{!! Form::label('name', 'Client Name:') !!}
{!! Form::text('name', null, ['class'=>'form-control']) !!}
</div>
{{ csrf_field() }}
<div class="form-group">
{!! Form::label('start_access_date', 'start:') !!}
{!! Form::text('start_access_date', null, ['class'=>'form-control']) !!}
</div>
{{ csrf_field() }}

<div class="form-group">
{!! Form::label('end_access_date', 'end:') !!}
{!! Form::text('end_access_date', null, ['class'=>'form-control']) !!}
</div>
{{ csrf_field() }}

{{ csrf_field() }}
<div class="form-group">
{!! Form::submit('Edit Account', ['class'=>'btn btn-primary']) !!}
</div>
{!! Form::close() !!}

</div>
@endforeach
@endif

</div>
</div>
</div>
</div>
<script type="text/javascript">
$('.date').datepicker({  
format: 'mm-dd-yyyy'
});  
</script>  
<script>
$(document).ready(function(){
//if you wish to keep both the divs hidden by default then dont forget to hide //them           
$(".edit-user").hide();

$("#edit-user").click(function(){
$(".edit-user").toggle();
});
});

</script>
@endsection

Answer 1

也许你应该使用

<button class="btn btn-primary" class="edit-user-btn" data-id="{!! $user->id !!}"> Edit</button>

而不是

<button class="btn btn-primary" id="edit-user"> Edit</button>

然后javascript是这样的：

$(".edit-user-btn").click(function(){
// here You might use id for your form label
// var user_id = $(this).data("id");
$(".edit-user").toggle();

})；