Радиокнопки не отправляются при наличии числового поля

Question

Я пытаюсь создать простую веб-форму, которая состоит из пары кнопок-флажков и числового поля.Это представлено с кнопкой.По какой-то причине, когда поле ввода номера присутствует, форма отправит 0,00.Если я что-то наберу в поле номера, оно пропустит все, что я наберу, но если я выберу одно из чисел и оставлю поле ввода пустым, будет отправлено 0,00.Кажется, я не могу понять, почему.

Если я удаляю код, все работает нормально.

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="paypal">
      <div class="donation_container">
        <input name="cmd" type="hidden" value="_donations"> 
        <input name="business" type="hidden" value="info@***.org"> 
        <input name="item_name" type="hidden" value="Donation">
        <input name="no_shipping" type="hidden" value="1"> 
        <input name="no_note" type="hidden" value="1"> 
        <input name="currency_code" type="hidden" value="USD"> 
        <input name="tax" type="hidden" value="0.00"> 
        <input name="lc" type="hidden" value="US"> 
        <input name="bn" type="hidden" value="PP-DonationsBF"> 
        <div class="donate_call_to_action">
          <div class="donate_call_to_action_text">Become ***
          </div>
        </div>
        <div class="donation_buttons">
          <label class="donation_label"> 
            <input name="amount" type="checkbox" value="1000.00">
            <div>$1000</div>
          </label>
          <label class="donation_label">
            <input name="amount" type="checkbox" value="500.00">
            <div>$500</div>
          </label>
          <label class="donation_label">
            <input name="amount" type="checkbox" value="100.00">
            <div>$100</div>
          </label>
          <label class="donation_label">
            <input name="amount" type="checkbox" value="50.00">
            <div>$50</div>
          </label>
          <div class="custom_donation">
            <i>$</i>
            <input name="amount" type="number">
          </div>
        </div>
      </div>
      <div class="donation_button">
        <button type="submit" formmethod="post" class="btn btn-primary" alt="PayPal - The safer, easier way to pay online!" name="submit">Donate</button> 
        <img src="https://www.paypal.com/en_US/i/scr/pixel.gif" alt="" width="1" height="1" border="0">
      </div>
    </form>

ОБНОВЛЕНИЕ:

Оказывается, я могу только один раз передать значение с атрибутом name = amount.Наличие поля ввода type = number поля AND приводит к тому, что кнопка donate отправляет несколько «сумм».Даже если поле ввода было пустым, оно отправляло бы нулевое значение, например, количество = 50,00 и количество = Решение было немного jQuery, чтобы отключить атрибут имени для поля ввода.Если поле ввода равно 0 или длина значения равна 0, сценарий удалит атрибут name.

<script>
      (function ($) {
        $(document).ready(function() {
          	$( "form" ).submit(function( event ) {
    			    alert($(this).serialize());
    			    event.preventDefault();
  			    });
        });
        $("#other_amount").removeAttr("name"); //on load, remove the name attribute. Default action.
        $( "#other_amount" ).blur(function() {
        	if(($(this).val().length == "0") || ($(this).val() == "0")){
          		$(this).removeAttr("name");
            } else {
            	$(this).attr("name", "amount");
            }
        });
      })(jQuery);
</script>

Answer 1

Ваше числовое поле имеет то же имя amount, что и флажки. Измените имя числового поля на что-то уникальное.

<input name="othername" type="number">

---

EDIT

Я добавил немного jquery, чтобы вы могли видеть, что он отправляет значения флажков и числовых полей. Должно быть что-то еще, что не указано в предоставленном вами коде.

$(document).ready(function() {
   $( "form" ).submit(function( event ) {
    alert($(this).serialize());
    event.preventDefault();
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="paypal">
  <div class="donation_container">
    <input name="cmd" type="hidden" value="_donations"> 
    <input name="business" type="hidden" value="info@***.org"> 
    <input name="item_name" type="hidden" value="Donation">
    <input name="no_shipping" type="hidden" value="1"> 
    <input name="no_note" type="hidden" value="1"> 
    <input name="currency_code" type="hidden" value="USD"> 
    <input name="tax" type="hidden" value="0.00"> 
    <input name="lc" type="hidden" value="US"> 
    <input name="bn" type="hidden" value="PP-DonationsBF"> 
    <div class="donate_call_to_action">
      <div class="donate_call_to_action_text">Become ***
      </div>
    </div>
    <div class="donation_buttons">
      <label class="donation_label"> 
        <input name="amount" type="checkbox" value="1000.00">
        <div>$1000</div>
      </label>
      <label class="donation_label">
        <input name="amount" type="checkbox" value="500.00">
        <div>$500</div>
      </label>
      <label class="donation_label">
        <input name="amount" type="checkbox" value="100.00">
        <div>$100</div>
      </label>
      <label class="donation_label">
        <input name="amount" type="checkbox" value="50.00">
        <div>$50</div>
      </label>
      <div class="custom_donation">
        <i>$</i>
        <input name="other_amount" type="number">
      </div>
    </div>
  </div>
  <div class="donation_button">
    <button type="submit" formmethod="post" class="btn btn-primary" alt="PayPal - The safer, easier way to pay online!" name="submit">Donate</button> 
    <img src="https://www.paypal.com/en_US/i/scr/pixel.gif" alt="" width="1" height="1" border="0">
  </div>
</form>