How to transfer a value from a button identifier to click-to-enter?

Question

How to pass button identifier to hidden input?

I have a preview of the user list and create a delete button, I want to pass the button identifier to the hidden input inside the modal.

@foreach

<button type="button" id="{{$user->id}}" data-toggle="modal" data-target="#modal-delete" onclick="deleteUser();"> Delete </button>

@endforeach

Here is what I tried but didn't work.

function deleteUser(id) {
  $('input[name=user_id_modal]').val(id);

  alert(id);
}

<input type="hidden" name="user_id_modal"> ^ button id should go here.

Answer 1

You can pass userId to a function and change the value of the hidden input name as follows:

function deleteUser(id) {

  $("input[name='user_id_modal']").val(id);
  console.log("Input value set to: " + $("input[name='user_id_modal']").val());
  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button type="button" id="userId" onclick="deleteUser(this.id);"> Delete </button>

<input type="hidden" name="user_id_modal">

Run code

Answer 2

    @foreach

       <button type="button" id="{{$user->id}}" data-toggle="modal" data-target="#modal-delete" onclick="deleteUser({{$user->id}});"> Delete </button>

   @endforeach