转自: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的更多相关文章

  1. Fetching data with Ajax小例子

    ajax获取数据示例: 示例1 通过ajax获取txt文件里面的内容示例: <html> <head> <title>Ajax at work</title& ...

  2. html5 file upload and form data by ajax

    html5 file upload and form data by ajax 最近接了一个小活,在短时间内实现一个活动报名页面,其中遇到了文件上传. 我预期的效果是一次ajax post请求,然后在 ...

  3. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  4. 关于Jquery中ajax方法data参数用法的总结

    data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...

  5. jquery ajax中data属性详解

    $.post.$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax() 一.$.ajax的一般格式 $.ajax({ type: 'POST', url: url , ...

  6. 聊天室(下篇)GatewayWorker 与 Laravel 的整合

    思路 上一篇大概梳理了一下 GatewayWorker 的基础知识.这篇就来准备整合 GatewayWorker 到 Laravel. GatewayWorker 是基于 Socket 监听的服务器框 ...

  7. Laravel Vuejs 实战:开发知乎 (10)使用 Select2 优化话题选择

    1.添加选择Topic 使用Select2,如何安装Select2 ,具体使用实例 Select2 and Laravel: Ajax Autocomplete 及 Loading data remo ...

  8. Vue.js——基于$.ajax实现数据的跨域增删查改

    概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...

  9. jquery ajax解析

    jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...

随机推荐

  1. iOS 判断奇偶数

    if (_bigUrlArray.count%2==0) {//如果是偶数 a = i*(_bigUrlArray.count/count);//每个线程图片初始数 b = (i+1)*(_bigUr ...

  2. vim(ubuntu) 设置行号和缩进

    在终端 输入以下命令来编辑vimrc配置文件: sudo vim /etc/vim/vimrc 或者 sudo gedit /etc/vim/vimrc 1.显示行号 在文件末端添加一新行,输入 se ...

  3. magento 好好玩

    Magento更换服务器的方法   1.把magento的整个目录打包.上传到新服务器,把magento数据库导出,然后在新服务器上导入.如果导不进去的是因为magento的数据库使用了外键约束,通过 ...

  4. Chrome 43+浏览器 Cookies encrypted_value解密脚本

    python 3.3.5 # -*- coding: utf-8 -*- # Used information from: # http://stackoverflow.com/questions/4 ...

  5. 一个不错的angular 字体库( 引用js文件就行)

    https://klarsys.github.io/angular-material-icons/ 使用方法: 1.引入这个js文件, <script src="//cdnjs.clo ...

  6. jquery has deprecated synchronous XMLHTTPRequest

    Like many others, my website is using jquery. When I open the developer tools, I see a warning that ...

  7. DDS视图&Button控件

    <Button android:id="@+id/btn1" android:layout_width="wrap_content"    //包裹文字 ...

  8. 升级版本后报这个异常 : org.springframework.beans.factory.NoUniqueBeanDefinitionException

    今天写代码时出现上面这个异常,很是奇怪.从网上下载了个Spring源码包,通过追踪源码发现并没有到加载工程代码中去.于是分析和Spring包有关系. 查看依赖库发现有两个版本的Spring.通过分析去 ...

  9. 转:从web三层架构解析软件测试内容

    B/S架构的系统,都会使用如下的基础软件架构: 数据访问层:实现对数据的访问功能,如增加.删除.修改.查询数据. 业务逻辑层:实现业务的具体逻辑功能,如学生入学.退学.成绩管理等. 页面显示层:将业务 ...

  10. CDOJ UESTC 1220 The Battle of Guandu

    The 2015 China Collegiate Programming Contest 2015第一届中国大学生程序设计竞赛 F题 本质就是求单源最短路!注意会爆int 对于每一个村庄i,其实就是 ...