Как передать различные скрытые поля ввода на основе нажатой кнопки отправки

Question

У меня есть два скрытых поля ввода с тем же именем, но с разными id.Я хочу передать его через действие, основанное на другой кнопке отправки.Когда я нажимаю кнопку «нормального» процесса, она должна передавать значение скрытого поля #normalfee, а при нажатии на «срочный» - значение #urgentfee.

<form name="home" action="#" method="post">
  <input type="hidden" name="fee" id="normalfee" value="49">
  <input type="hidden" name="fee" id="urgentfee" value="99">
  <input type="submit" name="Normal Process">
  <input type="submit" name="urgent process">
</form>

Answer 1

В соответствии с формой Controls

Когда форма отправляется на обработку, некоторые элементы управления имеют имя в паре с текущим значением, и эти пары передаются с формой.

Вы можете проверить значение атрибута по нажатию кнопки, чтобы удалить атрибут имени, что в конечном итоге предотвратит отправку значения:

$('input[type=submit]').click(function(){
  $('#normalfee, #urgentfee').attr('name', 'fee');
  if($(this).attr('name') == 'Normal Process'){
    $('#urgentfee').removeAttr('name');
    $('#urgentfee').attr('disabled', 'disabled');
  }
  else{
    $('#normalfee').removeAttr('name');
    $('#normalfee').attr('disabled', 'disabled');
  }
  var passVal = $('form').serialize();
  alert(passVal);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="home" action="#" method="post">
  <input type="hidden" name="fee" id="normalfee" value="49">
  <input type="hidden" name="fee" id="urgentfee" value="99">
  <input type="submit" name="Normal Process">
  <input type="submit" name="urgent process">
</form>

Answer 2

Я бы использовал переключатель, чтобы выбрать состояние процесса, а затем вывести сумму на принимающей стороне.Таким образом, пользователи не могут изменять значение, и у вас есть только одна кнопка для отправки формы, при этом есть несколько вариантов выбора.

<form name="home" action="#" method="post">
  Fee type:<br>
  <input type="radio" name="fee" value="normalfee">Normal<br>
  <input type="radio" name="fee" value="ugrentfee">Urgent<br>
  <input type="submit" name="Process">
</form>

https://jsfiddle.net/hx16eawk/1/