Laravel routes do not work with js

Question

I have a problem with my code. Don't know really what is wrong.

This route should display Token data from input, but submit button is just loading and nothing happens. Therefore with inspect element - token is generated. Here is route :

Route::get('buy', function(){
    return View('pages.add_creditcard');
});

Route::post('buy', function(){
 dd(Input::all());
});

Here is View (blade) :

{!! Form::open(['id' => 'billing-form', 'url' => '/buy', 'method' => 'post']) !!}

Card Number: CVC: Expiration Date: {!! Form::selectMonth(null, null, ['data-stripe' => 'exp-month']) !!} {!! Form::selectRange(null,date('Y'),date('Y')+10, null, ['data-stripe' => 'exp-year']) !!}

{!! Form::submit('buy now', ['id' => 'submit']) !!}

{!! Form::close() !!}

and here is js file :

(function() {

var StripeBilling = {
    init: function() {
        this.form = $('#billing-form');
        this.submitButton = this.form.find('input[type=submit]');
        this.submitButtonValue = this.submitButton.val();

        var stripeKey = $('meta[name="publishable-key"]').attr('content');

        Stripe.setPublishableKey(stripeKey);

        this.bindEvents();
    },

    bindEvents: function() {
        this.form.on('submit', $.proxy(this.sendToken, this));
    },

    sendToken: function(event) {
        this.submitButton.val('One Moment...').prop('disabled', true);

        Stripe.createToken(this.form, $.proxy(this.stripeResponseHandler, this));


        event.preventDefault();
    },

    stripeResponseHandler: function(status, response) {

        if(response.error) {
            this.form.find('.payment-errors').show().text(response.error.message);
            return this.submitButton.prop('disabled', false).val(this.submitButtonValue);
        }


        $('<input>', {
            type: 'hidden',
            name: 'stripeToken',
            value: response.id

        }).appendTo(this.form);

        //this.form[0].submit();


    }

};

StripeBilling.init();

})();

This form is fully working, but POST method does nothing. maybe js is the problem?

And when I change this.form = $('#billing-form') to this.form = $('.billing-form') POST is working. it generates a token and displays it on post page — codddeerz
With stripe.js, credit card information will not hit the server, you will get a token instead. — mdamia
Yes! But when i add credit card and hit submit button, it's loading and creates Token. Which i can see on inspect element as hidden element. but why this route::post is not working??? — codddeerz

mdamia mdamia · Accepted Answer · 2015-08-21T22:40:22

Stripe.js creates the token but you still have to create an ajax call to your post buy. try this

if(response.error) {
}else
{
  var token = response.id;
  var last4 = response.card['last4'];
  var stripeId = response.card['id']; 
  $.post('/stripe/account/proccess_payment', {
    stripeToken : token,
    last_four : last4,
    stripe_id : stripeId
   }).done(function(data){
      // your code here
   });
}

Laravel routes do not work with js

1 Answers