Stripe checkout

For the past two days I've been trying to figure how Stripe works and get it to work.. I got up to this point where I'm able to create a new customer, I can see it in my Stripe dashboard. The problem is, when I try to charge the customer I'm getting : "Cannot charge a customer that has no active card"

I've seen that many people had this issue before but I couldn't solve it from their answer..

VIEW:

            <select id="amount" style="width: 20%; margin-bottom: 20px;" name="amount">
              <option value="30">$30</option>
              <option value="50">$50</option>
              <option value="100">$100</option>
              <option value="200">$200</option>
              <option value="300">$300</option>
              <option value="500">$500</option>
            </select>

            <form class="app-form" style="margin-bottom: 0px;" method="POST">
              {{ csrf_field() }}
               <p><button type="submit" id="customButton">Pay</button></p>
            </form>
            <script>
            // checkout handler
            var handler = StripeCheckout.configure({
                key: 'pk_test_MMVkYEJHIA29tUeNEPsrXwnR',
                image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
                token: function(token) {
                    /* Use the token to create the charge with a server-side script.
                     You can access the token ID with `token.id`
                     Pass along various parameters you get from the token response
                     and your form.*/
                    var myData = {
                            token: token.id,
                            _token: "{{ csrf_token() }}",
                            email: token.email,
                            amount: Math.round($("#amount").val() * 100),
                    };
                    /* Make an AJAX post request using JQuery,
                       change the first parameter to your charge script*/
                    $.post("/add-funds", myData,function (data) {
                        // if you get some results back update results
                        $(".app-form").hide();
                        $(".results").html("Your charge was successful");
                    }).fail(function () {
                        // if things fail, tell us
                        $(".results").html("I'm sorry something went wrong");
                    });
                }
            });
            $(".app-form").on('submit', function (e) {
                // Open Checkout with further options
                handler.open({
                    name: 'Stripe.com',
                    description: '2 widgets',
                    amount: Math.round($("#amount").val() * 100)
                });
                e.preventDefault();
            });
            // Close Checkout on page navigation
            $(window).on('popstate', function () {
                handler.close();
            });
            </script>

CONTROLLER:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Auth;

class WalletController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */

    public function index()
    {
        return view('user.wallet.index');
    }

     public function postPayWithStripe(Request $request)
     {
         return $this->chargeCustomer($request->input('amount'), $request->input('stripeToken'));
     }

     public function chargeCustomer($amount, $token)
     {
        \Stripe\Stripe::setApiKey('sk_test_xv2XpHb1ou8uR0xYniv1RPuB');

         if (!$this->isStripeCustomer())
         {
             $customer = $this->createStripeCustomer($token);
         }
         else
         {
             $customer = \Stripe\Customer::retrieve(Auth::user()->stripe_id);
         }

         return $this->createStripeCharge($amount, $customer);
     }
     public function createStripeCharge($amount, $customer)
     {
         try {
             $charge = \Stripe\Charge::create(array(
                 "amount" => $amount,
                 "currency" => "brl",
                 "customer" => $customer->id,
                 "description" => "Add funds to your account",
             ));
         } catch(\Stripe\Error\Card $e) {
             return redirect()
                 ->route('index')
                 ->with('error', 'Your credit card was been declined. Please try again or contact us.');
         }

         return $this->postStoreAmount($amount);
     }

     public function createStripeCustomer($token)
     {
        \Stripe\Stripe::setApiKey('sk_test_xv2XpHb1ou8uR0xYniv1RPuB');

         $customer = \Stripe\Customer::create(array(
             "description" => Auth::user()->email,
             "source" => $token
         ));

         Auth::user()->stripe_id = $customer->id;
         Auth::user()->save();

         return $customer;
     }

    /**
     * Check if the Stripe customer exists.
     *
     * @return boolean
     */
     public function isStripeCustomer()
     {
         return Auth::user() && \App\User::where('id', Auth::user()->id)->whereNotNull('stripe_id')->first();
     }

     public function postStoreAmount($amount)
     {
        $userBalance = Auth::user()->balance;
        $userBalance = $userBalance + $amount;

        Auth::user()->save();

        session()->flash('message', 'You just added funds to your account.');
        return redirect()->route('index');
     }
}

As I mentioned, I'm able to create a new customer but I can't charge the user.. Any suggestions?