I have user details from DB and print using blade loop with button for edit. now I want, if I click button I need user details for the button which is clicked for user.
i tried with hidden input filed <input type="hidden" value="{{$user->email}}" name="email">
in my controller I just print the value from form submit. but I am getting only last user.
See below, I hope you will understand..
<div class="content-wrapper">
<div class="flex-center position-ref full-height">
<form action="{!!url('/delete')!!}" method="post"> {!!csrf_field()!!}
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Role</th>
</tr>
</thead>
<tbody>
@foreach($users as $user)
<tr>
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td> <input type="hidden" value="{{$user->email}}" name="email">
<td>{{$user->role}}</td>
<td>
<div class="btn-group">
<button type="submit" class="btn btn-primary btn-sm" name="edit" >Edit</button>
<button type="submit" class="btn btn-primary btn-sm" name="delete" >Delete</button>
<button type="submit" class="btn btn-primary btn-sm" name="make" >Make Admin</button>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</form>
</div>
</div>
Assuming that you want to go to edit page with a user's details when you click edit button.
<a href="{{ route('your_route_name',$user->id) }}" class="test-btn btn btn-primary btn-sm">Edit</a>
I think that's because you are using same name "email" for all user's hidden field. It is getting overridden, since form is same .
Instead, add the form
tag inside your loop and remove the one before table.
@foreach($users as $user)
<form action="{!!url('/delete')!!}" method="post"> {!!csrf_field()!!}
<tr>
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td> <input type="hidden" value="{{$user->email}}" name="email">
<td>{{$user->role}}</td>
<td>
<div class="btn-group">
<button type="submit" class="btn btn-primary btn-sm" name="edit" >Edit</button>
<button type="submit" class="btn btn-primary btn-sm" name="delete" >Delete</button>
<button type="submit" class="btn btn-primary btn-sm" name="make" >Make Admin</button>
</div>
</td>
</tr>
</form>
@endforeach
Or, you can put a single hidden email field outside your loop and assign it's value using JS before submitting.
Step 1: Add data attribute (data-email
) to your buttons to get email. Also add a common class name to capture click event. (See JS part)
<button type="button" class="test-btn btn btn-primary btn-sm" name="edit" data-email="{{$user->email}}" >Edit</button>
<button type="button" class="test-btn btn btn-primary btn-sm" name="delete" data-email="{{$user->email}}" >Delete</button>
<button type="button" class="test-btn btn btn-primary btn-sm" name="make" data-email="{{$user->email}}" >Make Admin</button>
Step 2: Move email
hidden field outside the loop with value as blank.
<form action="{!!url('/delete')!!}" method="post" id="test-form"> {!!csrf_field()!!}
<input type="hidden" value="" name="email" id="email">
Step 3: Add JS to capture click event on the buttons and assign the value of the clicked button's email to the email text field.
$(".test-btn ").on("click",function(e){
//assign the email value from button to variable
email = $(this).attr(data-email);
//assign the email value to email hidden field
$("#email").value(email);
//submit the form
$("#test-form").submit();
});