Включить автозаполнение при использовании размещенных полей оплаты - PullRequest
Новая
       13

Включить автозаполнение при использовании размещенных полей оплаты

0 голосов
/ 04 июля 2018

Мне интересно, возможно ли включить автозаполнение кредитной карты, хранящейся в браузере, например, с использованием простого html, в браузере отображается опция автозаполнения сохраненных данных кредитной карты. 

<form method="post" id="usrForm">
  <h4>Do not use a real card</h4>
  <label for="nameoncard">Name on Card</label>
  <input type="text" id="nameoncard" name="nameoncard" autocomplete="cc-name">
  <label for="ccnumber">Credit Card Number</label>
  <input type="text" id="ccnumber" name="ccnumber" autocomplete="cc-number">
  <label for="cc-exp-month">Expiration Month</label>
  <input type="number" id="cc-exp-month" name="cc-exp-month" autocomplete="cc-exp-month">
  <label for="cc-exp-year">Expiration Year</label>
  <input type="number" id="cc-exp-year" name="cc-exp-year" autocomplete="cc-exp-year">
  <label for="cvv2">CVV</label>
  <input type="text" id="cvv2" name="cvv2" autocomplete="cc-csc">
  <input type="submit" value="Submit" name="submit">
</form>

Мы используем форму с полями для размещенных платежей, что-то вроде этого: 

<div class="panel panel-default bootstrap-basic">
  <form class="panel-body" action="your-form-handling-page" method="POST" id="checkout-form" onsubmit="return do_when_clicking_submit_button()">
    <div class="row">
       <div class="form-group col-md-12">
          <label for="cardholder-name">Name on Card</label>
          <input type="text" class="form-control" id="cardholder-name" placeholder="Full Name">
          <span class="helper-text"></span>
       </div>
       <!--Hosted Field for CC number-->
       <div class="form-group col-md-12">
          <label for="card-number">Card Number</label>
          <div class="input-group">
            <div class="form-control" id="card-number" data-bluesnap="ccn"></div>
            <div id="card-logo" class="input-group-addon"><img src="https://files.readme.io/d1a25b4-generic-card.png" height="20px"></div>
         </div>
         <span class="helper-text" id="card-help"></span>
       </div>
             <!--Hosted Field for CC EXP-->
       <div class="form-group col-xs-7">
          <label for="exp-date">Exp. Date</label>
          <div class="form-control" id="exp-date" data-bluesnap="exp"></div>
          <span class="helper-text"></span>
       </div>
            <!--Hosted Field for CC CVV-->
            <div class="form-group col-xs-5">
         <label for="cvv">Security Code</label>
         <div class="form-control" id="cvv" data-bluesnap="cvv"></div>
         <span class="helper-text"></span>
      </div>
    </div>  

        <button class="btn btn-success btn-lg col-xs-6 col-xs-offset-3" type="submit" id="submit-button">Pay Now</button>

        </form>

</div>

<!--BlueSnap Hosted Payment Fields JavaScript file-->
        <script type="text/javascript" src="https://sandbox.bluesnap.com/services/hosted-payment-fields/v1.0/bluesnap.hpf.mini.js"></script>

Было бы здорово, если бы браузер предлагал автозаполнение.

Я что-то упускаю здесь очевидное? Любая помощь будет принята с благодарностью.

1 Ответ

0 голосов
/ 05 июля 2018

Я работаю на BlueSnap. К сожалению, в самих размещенных полях отключено автозаполнение, поэтому это не будет работать независимо от того, что вы добавляете в div в своем клиентском коде (если вы осмотрите поле, вы увидите autocomplete = "off"). Я открыл ошибку в нашей системе, чтобы поддержать это, так как я понимаю, почему это важная функция. Спасибо за публикацию этого.

...