0

I am studying Laravel now and I am creating an Ajax Registration form. But it can't access the URL in my ajax process. I have an error like this:

XMLHttpRequest cannot load file:///C:/wampwwwlaravelblogpublic. Cross origin requests are only supported for HTTP. jquery-1.10.2.js:8706

Here's my sample codes:

Controller

public function index()
{   

    /*Login*/
    $title = Lang::get('login.panel_title');
    $username = Lang::get('login.username');
    $password = Lang::get('login.password');

    /*Registration*/
    $reg_username = Lang::get('register.username');
    $reg_lastname = Lang::get('register.lastname');
    $reg_firstname = Lang::get('register.firstname');
    $reg_gender = Lang::get('register.gender');
    $reg_email = Lang::get('register.email');
    $reg_birthday = Lang::get('register.birthday');

    $reg_month = Lang::get('register.months');
    $reg_password = Lang::get('register.password');
    $reg_conf_password = Lang::get('register.conf_password');

    $reg_path = public_path();

    return View::make('login', 
        array(
            'title'         => $title, 
            'username'      => $username,
            'password'      => $password,
            'reg_username'  => $reg_username,
            'reg_lastname'  => $reg_lastname,
            'reg_firstname' => $reg_firstname,
            'reg_gender'    => $reg_gender,
            'reg_email'     => $reg_email,
            'reg_birthday'  => $reg_birthday,
            'reg_month'     => $reg_month,
            'reg_password'  => $reg_password,
            'reg_conf_password' => $reg_conf_password,
            'reg_path'      => $reg_path
        )
    );

}

VIEW

<script type="text/javascript">

    $(document).ready(function() {

        $('#register-user').on('click', function(){

            console.log('clicked');

            var url_link = '{{ $reg_path }}';

            var $reg_username = $('input[name=reg_username]').val();
            var $reg_lastname = $('input[name=reg_lastname]').val();
            var $reg_firstname = $('input[name=reg_firstname]').val();
            var $reg_email = $('input[name=reg_email]').val();
            var $reg_gender = $('input[name=reg_gender]').val();
            var $reg_year = $('input[name=reg_year]').val();
            var $reg_month = $('input[name=reg_month]').val();
            var $reg_day = $('input[name=reg_day]').val();
            var $reg_password = $('input[name=reg_password]').val();
            //var $reg_conf_password = $('input[name=reg_conf_password]').val();

            /*
            if($reg_username == '') {
                $('.test').modal('show');
            }
            */

            $.ajax({
                url: url_link,
                data: {
                    username: $reg_username, 
                    lastname: $reg_lastname, 
                    firstname: $reg_firstname, 
                    email: $reg_email, 
                    gender: $reg_gender, 
                    year: $reg_year, 
                    month: $reg_month, 
                    day: $reg_day, 
                    password: $reg_password
                },
                type: 'post',
                dataType: 'json',
                beforeSend: function() {

                },
                success: function(data) {
                    console.log(data);
                },
                error: function() {

                }
            });

        });

    });

</script>

What I noticed in the error is this part C:/wampwwwlaravelblogpublic it removes the '/' slash in the path. Is this normal?

Or are there any proper way to do simple ajax process?

That's all guys thanks.

1 Answer 1

1

You don't want to use the public_path() as your URL. That's the path on your filesystem! Chances are you just want to point it at the index. So instead of {{ $reg_path }}, put in {{ URL::to('/') }}.

Cheers!

<script type="text/javascript">

$(document).ready(function() {

    $('#register-user').on('click', function(){

        console.log('clicked');

        var url_link = '{{ URL::to('/') }}';

        var $reg_username = $('input[name=reg_username]').val();
        var $reg_lastname = $('input[name=reg_lastname]').val();
        var $reg_firstname = $('input[name=reg_firstname]').val();
        var $reg_email = $('input[name=reg_email]').val();
        var $reg_gender = $('input[name=reg_gender]').val();
        var $reg_year = $('input[name=reg_year]').val();
        var $reg_month = $('input[name=reg_month]').val();
        var $reg_day = $('input[name=reg_day]').val();
        var $reg_password = $('input[name=reg_password]').val();
        //var $reg_conf_password = $('input[name=reg_conf_password]').val();

        /*
        if($reg_username == '') {
            $('.test').modal('show');
        }
        */

        $.ajax({
            url: url_link,
            data: {
                username: $reg_username, 
                lastname: $reg_lastname, 
                firstname: $reg_firstname, 
                email: $reg_email, 
                gender: $reg_gender, 
                year: $reg_year, 
                month: $reg_month, 
                day: $reg_day, 
                password: $reg_password
            },
            type: 'post',
            dataType: 'json',
            beforeSend: function() {

            },
            success: function(data) {
                console.log(data);
            },
            error: function() {

            }
        });

    });

});

Sign up to request clarification or add additional context in comments.

2 Comments

Ok, thanks I will try it. :) Should I add a route process for POST for that?
Yea you'll need to add an appropriate route.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.