Post data using ajax in laravel 5
转自:http://www.tuicool.com/articles/2u2mmmu
Post data using ajax in laravel 5 to controller
If you are going to work with ajax data post to controller or route in laravel 5. There are some need to get ajax call work correctly. Your requirement is csrf token. A default feature in Laravel is it’s automatic CSRF security. When you working with forms it’s automatically add a “_token” hidden field to your form. On each post request token will be matched for csrf protection. so it’s one more cool feature provided by laravel 5.
Why on ajax post 500 internal server error laravel :-
If you are using default way for ajax data post, you will get “500 internal server error” in laravel 5. cause you missing csrf token posting with ajax post data. and error reason is token not being matched on post request. so every time a form data is posting require csrf token match. else you will get “500 internal server error” in laravel.

In this article we will explore how to solve 500 internal server error in ajax post or call in laravel or how to Post data using ajax in laravel 5. there are many ways to do this but i am sharing two ways :-
1. Adding on each request
2. globally
How to Post data using ajax in laravel 5 :-
1. Adding on each request and post data to controller :-
In this way we need to add token on each ajax call with data which is posting
view:- add a “login.blade.php” under “resources/views/” and add below code to make a form
<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() !!}
Now add your ajax call or post data script to your layout footer or in the same file.
<script type="text/javascript">
$(document).ready(function(){
$('.send-btn').click(function(){
$.ajax({
url: 'login',
type: "post",
data: {'email':$('input[name=email]').val(), '_token': $('input[name=_token]').val()},
success: function(data){
alert(data);
}
});
});
});
</script>
Routes:- Add your get and post route to “app/Http/routes.php”
Route::get('account/login', function() {
return View::make('login');
});
Route::post('account/login', 'AccountController@login');
Controller:- add a controller to “app/Http/Controllers” with named “AccountController.php” and add below code
<?php namespace App\Http\Controllers;
use Input;
use Request;
class AccountController extends Controller {
public function login() {
// Getting all post data
if(Request::ajax()) {
$data = Input::all();
print_r($data);die;
}
}
After all make go to your page url and click on button and you get your data has been posted and you will get alert with success.
2. globally way :-
In this way we will add token for globally work with ajax call or post. so no need to send it with data post.
1. Add a meta tag to your layout header:- csrf_token() will be the same as "_token" CSRF token that Laravel automatically adds in the hidden input on every form.
<meta name="_token" content="{!! csrf_token() !!}"/>
2.Now add below code to footer of your layout, or where it will set for globally or whole site pages. this will pass token to each ajax request.
<script type="text/javascript">
$.ajaxSetup({
headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
});
</script>
Now make an ajax post request an you are done your data will post successfully.
Post data using ajax in laravel 5的更多相关文章
- Fetching data with Ajax小例子
ajax获取数据示例: 示例1 通过ajax获取txt文件里面的内容示例: <html> <head> <title>Ajax at work</title& ...
- html5 file upload and form data by ajax
html5 file upload and form data by ajax 最近接了一个小活,在短时间内实现一个活动报名页面,其中遇到了文件上传. 我预期的效果是一次ajax post请求,然后在 ...
- jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax
jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
- jquery ajax中data属性详解
$.post.$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax() 一.$.ajax的一般格式 $.ajax({ type: 'POST', url: url , ...
- 聊天室(下篇)GatewayWorker 与 Laravel 的整合
思路 上一篇大概梳理了一下 GatewayWorker 的基础知识.这篇就来准备整合 GatewayWorker 到 Laravel. GatewayWorker 是基于 Socket 监听的服务器框 ...
- Laravel Vuejs 实战:开发知乎 (10)使用 Select2 优化话题选择
1.添加选择Topic 使用Select2,如何安装Select2 ,具体使用实例 Select2 and Laravel: Ajax Autocomplete 及 Loading data remo ...
- Vue.js——基于$.ajax实现数据的跨域增删查改
概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...
- jquery ajax解析
jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...
随机推荐
- Jenkins设置Poll SCM
*/5 * * * * (每5分钟执行一次) 0 20 * * * 每天 20点执行定时build # every fifteen minutes (perhaps at :07, :22, : ...
- 2015年4月29日 dayofweek
#include <stdio.h>#include <stdlib.h>int DayofYear(int year, int month, int day);#define ...
- Log4j NDC MDC
NDC(Nested Diagnostic Context)和MDC(Mapped Diagnostic Context)是log4j种非常有用的两个类,它们用于存储应用程序的上下文信息(contex ...
- CodeForces 678C Joty and Chocolate
简单题. #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> ...
- Android中在布局中写ViewPager无法渲染出来的问题
今天刚刚使用Android Studio,在写ViewPager时,首先按F4把Dependencies添加一个V4包,然后写ViewPager,如下: <android.support.v4. ...
- Nginx反向代理配置文件
server { listen ; server_name ; root E:/Upays/public/; index index.php index.html; log_not_found off ...
- 2016大连网络赛 Function
Function Time Limit: 7000/3500 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Others) Probl ...
- Fragment管理
Fragments 设计理念 在设计应用时特别是Android 应用 ,有众多的分辨率要去适应,而fragments 可以让你在屏幕不同的屏幕上动态管理UI.例如:通讯应用程序(QQ),用户列表可以在 ...
- backtrack种子
下载链接:(种子文件) BT5R3-GNOME-64.torrent (md5: 8cd98b693ce542b671edecaed48ab06d) BT5R3-GNOME-32.torrent (m ...
- Android--->Button按钮操作
main.xml中设置两个按钮 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xm ...