title: How to replace the creditCard option with nonce using Braintree?
body: <p>I have an application where I integrated braintree payment gateway. i am using custom form and not drop-in UI, i used creditCard parameter to do one time transaction from the clients credit card. I recently found that the creditCard parameter has been deprecated and a new parameter <code>paymentMethodNonce</code> has been introduced my previous code was </p>
  
  <pre><code>Braintree_Configuration::environment('sandbox');
  Braintree_Configuration::merchantId('xxxxxx');
  Braintree_Configuration::publicKey('xxxxxx');
  Braintree_Configuration::privateKey('xxxxxxxxxxxxxxxxx');
  
  $result = Braintree_Transaction::sale(array(
              'amount' =&gt; $price,
              'creditCard' =&gt; array(
                  'number' =&gt; $card_number,
                  'cardholderName' =&gt; $card_name,
                  'expirationDate' =&gt; $expirationDate,
                  'cvv' =&gt; $cvv
              )
  ));
  </code></pre>
  
  <p>According to the documentation I need to send a token within the form using a hidden input field to carry on the transaction, i added the token inside my form in the following way </p>
  
  <pre><code>&lt;input type="hidden" name="payment_method_nonce" id="payment_method_nonce" value="&lt;?=Braintree_ClientToken::generate()?&gt;" /&gt;
  </code></pre>
  
  <p>and on the other page where i submit the form i changed the code to the following using the documentation bt still i receive validation error that </p>
  
  <blockquote>
    <p>Payment method token is invalid.</p>
  </blockquote>
  
  <pre><code>$payment_method_nonce   =   $_POST['payment_method_nonce'];
  $result  = Braintree_Transaction::sale([
      'amount' =&gt; '25.00',
      'paymentMethodToken' =&gt; $payment_method_nonce,
      'options' =&gt; [
        'submitForSettlement' =&gt; True
      ]
    ]);
  </code></pre>
  
  <p><strong><em>Edited</em></strong></p>
  
  <p>Here is the updated code </p>
  
  <p>index.php</p>
  
  <pre><code> &lt;?php
      include 'db.php';
      include 'functions.php';
      require_once 'braintree-php-3.13.0/lib/Braintree.php';
      Braintree_Configuration::environment('sandbox');
      Braintree_Configuration::merchantId('xxxxxx');
      Braintree_Configuration::publicKey('xxxxxxx');
      Braintree_Configuration::privateKey('xxxxxx');
      $payment_method_nonce=  Braintree_ClientToken::generate();
  ?&gt;
  &lt;script type="text/javascript" src="../../public_html/js/jquery.js"&gt;&lt;/script&gt;
  &lt;script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/jquery.creditCardValidator.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/card.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="style.css"&gt;
  
  
  &lt;style&gt;
      label, input { display:block; }
      input.text { margin-bottom:12px; width:95%; padding: .4em; }
      fieldset { padding:0; border:0; margin-top:25px; }
      h1 { font-size: 1.2em; margin: .6em 0; }
      div#users-contain { width: 350px; margin: 20px 0; }
      div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
      div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
      .ui-dialog .ui-state-error { padding: .3em; }
      .validateTips { border: 1px solid transparent; padding: 0.3em; }
  &lt;/style&gt;
  
  
  &lt;script type="text/javascript"&gt;
      //    braintree dialouge
      var form;
      $(document).ready(function () {
          dialog = $("#dialog-form").dialog({
              autoOpen: false,
              height: 500,
              width: 500,
              modal: true,
              close: function () {
                  form[0].reset();
              }
          });
  
  //        form = dialog.find("form").on("submit", function (event) {
  //            event.preventDefault();
  //        });
  
          $("#create-user").button().on("click", function () {
              dialog.dialog("open");
          });
          console.log("Here");
  
  
  
      });
  
  &lt;/script&gt;
  
  &lt;button name="create-user" id="create-user"&gt;Open Dialouge&lt;/button&gt;
  &lt;div id="dialog-form" style="display:none;"&gt;
      &lt;form method="post"  id="paymentForm" action="cardprocess.php"&gt;
  
          &lt;ul&gt;
              &lt;li&gt;
                  &lt;label&gt;Card Number &lt;/label&gt;
                  &lt;input type="text" name="card_number" id="card_number"  maxlength="20" placeholder="1234 5678 9012 3456"/&gt;
              &lt;/li&gt;
  &lt;!--            &lt;li&gt;
                  &lt;label&gt;Name on Card&lt;/label&gt;
                  &lt;input type="text" name="card_name" id="card_name" placeholder="Card Holder Name"/&gt;
              &lt;/li&gt;--&gt;
              &lt;li class="vertical"&gt;
                  &lt;ul&gt;
                      &lt;li&gt;
                          &lt;label&gt;Expires&lt;/label&gt;
                          &lt;input type="text" name="expiry_month" id="expiry_month" maxlength="2" placeholder="MM" class="inputLeft" /&gt;
                          &lt;input type="text" name="expiry_year" id="expiry_year" maxlength="2" placeholder="YY" class="inputLeft" /&gt;
                      &lt;/li&gt;
                      &lt;li&gt;
                          &lt;label&gt;CVV&lt;/label&gt;
                          &lt;input type="text" name="cvv" id="cvv" maxlength="3" placeholder="123" class="inputLeft" /&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
              &lt;li&gt;
                  &lt;input type="submit" id="paymentButton" value="Proceed" disabled="true" class="disable"&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;div id="orderInfo"&gt;&lt;/div&gt;
  &lt;script src="https://js.braintreegateway.com/js/braintree-2.26.0.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
       braintree.setup('&lt;?=$payment_method_nonce?&gt;', 'custom', {
              id: "paymentForm",
              hostedFields: {
                  number: {
                    selector: "#card_number"
                  },
                  expirationMonth: {
                    selector: "#expiry_month"
                  },
                  expirationYear: {
                    selector: "#expiry_year"
                  },
                  cvv: {
                    selector: "#cvv"
                  },
            },
            onError:function (errorObj){
                console.log(errorObj.type);
                console.log(errorObj.message);
            }
          });
  &lt;/script&gt;
  </code></pre>
  
  <p>cardprocess.php</p>
  
  <pre><code>    &lt;?php
  
      include 'db.php';
      include 'functions.php';       
  
      $price = '1000';
  require_once 'braintree-php-3.13.0/lib/Braintree.php';
          Braintree_Configuration::environment('sandbox');
          Braintree_Configuration::merchantId('xxxx');
          Braintree_Configuration::publicKey('xxxx');
          Braintree_Configuration::privateKey('xxxxxxx');
      if ($_SERVER["REQUEST_METHOD"] == "POST") {
  
          $payment_method_nonce   =   $_POST['payment_method_nonce'];
  
  
  
  
          $result  = Braintree_Transaction::sale([
              'amount' =&gt; '25.00',
              'paymentMethodNonce' =&gt; $payment_method_nonce,
              'options' =&gt; [
                'submitForSettlement' =&gt; True
              ]
            ]);
  
          if ($result-&gt;success) {
              if ($result-&gt;transaction-&gt;id) {
                  $braintreeCode = $result-&gt;transaction-&gt;id;
                  echo "&lt;pre&gt;";
                  print_r($braintreeCode);
                  //updateUserOrder($braintreeCode, $session_user_id);
              }
          } else if ($result-&gt;transaction) {
              echo '{"OrderStatus": [{"status":"2"}]}';
          } else {
              print_r($result);
              echo '{"OrderStatus": [{"status":"0"}]}';
          }
      }
      ?&gt;
  </code></pre>
  
  <p>```</p>