Laravel 5.1 ajax not working?
Question
i am trying to submit login form using ajax in laravel but it seems to be ajax part not working. below is my login.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="secure">Secure Login form</div>
{!! Form::open(array('url'=>'account/login','method'=>'POST', 'id'=>'myform')) !!}
<div class="control-group">
<div class="controls">
{!! Form::text('email','',array('id'=>'','class'=>'form-control span6','placeholder' => 'Email')) !!}
</div>
</div>
<div class="control-group">
<div class="controls">
{!! Form::password('password',array('class'=>'form-control span6', 'placeholder' => 'Please Enter your Password')) !!}
</div>
</div>
{!! Form::button('Login', array('class'=>'send-btn')) !!}
{!! Form::close() !!}
<script type="text/javascript">
$(document).ready(function(){
$('.send-btn').click(function(){
$val=$('input[name=email]').val();
$token=$('input[name=_token]').val();
//alert($val+$token);
$.ajax({
url: '/account/login',
type: "post",
data: {'email':$('input[name=email]').val(), '_token': $('input[name=_token]').val()},
success: function(data){
alert(data);
}
});
});
});
</script>
route.php
Route::get('account/login', function() {
return View::make('login');
});
Route::post('account/login', 'AccountController@login');
in controller
public function login() {
if(Request::ajax()) {
$data = Input::all();
print_r($data);
die;
}
}
I have tried to alert input values in ajax part before success, it will print output but success alert wont work.
3 answers
solution1
1 2015-08-12 05:32:18
Though logging in users through AJAX is insecure, it can be done none-the-less:
{!! Form::open(array('url'=>'account/login','method'=>'POST', 'id'=>'myform')) !!}
/**
* Your Form
*/
...
{!! Form::submit('Login', array('class'=>'send-btn')) !!}
{!! Form::close() !!}
The CSRF field will be automatically generated for you. The JavaScript part:
<script>
(function($) {
$('#myform').submit(function(e) {
$.ajax({
type: 'POST',
url: 'account/login',
data: $('#myform').serialize(),
success: function(data) {
alert(data);
}
});
e.preventDefault();
});
})(window.jQuery);
</script>
That should do the trick for the HTML and JavaScript part. In Laravel 5.1 we can leverage Method Injection to receive the Input fields ( Request Object ) like so:
<?php
namespace Blah\Blah;
use Illuminate\Http\Request;
class AccountController
{
...
public function login(Request $request)
{
if ($request->ajax()) {
// Its AJAX!!
return $request->all(); // All the Input fields
}
}
}
Notice the changes that I did to your code. Please check whether this method works or not.
Cheers!
solution2
0 2015-08-12 04:52:33
try this one:
public function login() {
if(Request::ajax()) {
$data = Request::all();
return $data;
}
}
solution3
0 2015-11-25 00:05:50
Token is required. Try add:
headers: {'X-CSRF-TOKEN': token}
in your ajax request:
$.ajax({
url: route,
headers: {'X-CSRF-TOKEN': token},
type: 'POST',
dataType: 'json',
data: {data : data}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.