Form name attribute causing the issue in IE

Question

When I submit the form values to 2check out payment gateway I got PE101 error(i.e Require values not passed). After debugged my code I come to know that PE101 error causing issue only in IE because of name attribute has empty value. Same code working in Chrome but when I tried in IE, Edge it's causing the issue. can anyone please tell me why 2check out payment gateway not taking the form values without name attribute that in from IE.

              $("#idNavPremimum").click(function() {
                alert("k");
                $("input[name*='quantity']").val("88");
                $("input[name*='li_0_price']").val("99");
                $("input[name*='email']").val("uday.a@gmail.com");
                $("#payment").submit();
        
              });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
            <form id="payment" action='https://sandbox.2checkout.com/checkout/purchase' method='post'>
              <div class="form-group">

                <label for="quantity" class="col-md-1 control-label">No. of users</label>
                <div class="col-md-2">
                  <!----------------------This control causing the issue--------------------->
                  <input type="text" maxlength="3" class="form-control specialCharRestrict" id="quantity" name="">
                  <!----------------------This control causing the issue ends--------------------->
                </div>
                <label for="ddlPriceCalcMonths" class="col-md-1 control-label">No. of months</label>
                <div class="col-md-2">
                  <select id="ddlPriceCalcMonths" class="form-control clsPriceValDetails" disabled>
                    <option value="1">1</option>
                    <option value="3">3</option>
                    <option value="6">6</option>
                    <option value="12">12</option>
                  </select>
                </div>
                <label for="txtTotalPrice" class="col-md-1 control-label">Total price</label>
                <div class="col-md-2">
                  <input type="text" class="form-control clsPriceVal" id="txtTotalPrice" readonly/>
                </div>
                <!--<input type='hidden' name='sid' value='901286127' />-->
                <input type='hidden' name='sid' value='901286127' />
                <input type='hidden' name='mode' value='2CO' />
                <input type="hidden" name="currency_code" value="USD" />

                <input type='hidden' name='li_0_type' value='product'>
                <input type='hidden' name='li_0_name' value='Webstation Premium'>
                <input type='hidden' name='li_0_price' value='20'>
                <input type='hidden' name='li_0_quantity' value='2'>
                <input type='hidden' name='li_0_tangible' value='N'>
                <input type='hidden' name='email' value='uday.a@gmail.com'>
                <input type='hidden' name='fixed' value='Y' />
                <input type='hidden' name='x_receipt_link_url' value='http://webstation.osmosystems.com/' />

              </div>

            </form>
            <div class="form-group">
              <button class="button-style btnPos" type='button' data-toggle="modal" data-target="#divwebstationForm" id="idNavPremimum"><i class="fa fa-android fa-fw"></i> BUY NOW <i class="fa fa-cloud-download fa-fw"></i></button>
            </div>

Answer 1

This is due to IE implementation of forms behaviour.

As per MS specs name parameter is mandatory for inputs like text. IE when form is submitted takes into consideration inputs without name property - meaning those are included in the Content-Length header of the Request as well as the FormData contains empty row.

On the other hand Chrome, FF if they encounter input without name they just ignore it.

To sum it up - to make it work on IE you will need to put name property.