使用 Ajax 并在 laravel 5 中返回 json 数组

Using Ajax and returning json array in laravel 5

我是 "AJAX" 的新手,我一直在尝试使用 "AJAX" 发送请求 "ONSELECT" 并在 "laravel 5".

这是我的观点

<select>
<option data-id="a" value="a">a</option>
<option data-id="b" value="b">b</option>
<option data-id="c" value="c">c</option>
</select>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script type="text/javascript">
$('select').change(function(){
var data = $(this).children('option:selected').data('id');

$.ajax({
    type    :"POST",
    url     :"http://localhost/laravel/public/form-data",
    dataType:"html",
    data    :{ data1:data },

    success :function(response)
    alert("thank u");
    }),
});
</script>

这是我的控制器接收ajax请求

public function formdata(){
    $data = Input::get('data1');

    //somecodes

    return Response::json(array(
                    'success' => true,
                    'data'   => $data
                )); 
}

这是我的路线

 Route::post('form-data',array('as'=>'form-data','uses'=>'FormController@formdata'));

我也试过只用 form-data{{Url::route('form-data')}}.

来改变 ajax 的 URL

您的代码有误,请正确编写。

$.ajax({
    type    :"POST",
    url     :"http://localhost/laravel/public/form-data",
    dataType:"json",
    data    :{ data1:data },
    success :function(response){
    alert("thank u");
    }
});

更新

我刚刚看到你的返回数据类型是 json ,所以使用

 dataType:"json",

 dataType:"jsonp",

向您的 ajax 请求添加错误回调以查找是否抛出错误,

$.ajax({
  type    :"POST",
  url     :"http://localhost/laravel/public/form-data",
  dataType:"json",
  data    :{ data1:data },
  success :function(response) {
    alert("thank u");
  },
  error: function(e) {
    console.log(e.responseText);
  }
});

最好使用 console.log() 查看详细信息,即使响应是 json 字符串。尝试代码,让我们知道是否有内容记录到浏览器控制台

你的 jQuery 代码在 success 回调中有语法错误,这就是为什么它没有向 Laravel 发出任何 post 请求,请尝试下面 javascript它会起作用

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<select>
<option data-id="a" value="a">a</option>
<option data-id="b" value="b">b</option>
<option data-id="c" value="c">c</option>
</select>

<script type="text/javascript">
 $(function () {
    $('select').on('change', function (e) {
   var data = $(this).children('option:selected').data('id');
 $.ajax({
  type    :"POST",
     dataType:"json",
  url     :"http://localhost/laravel/public/form-data",
  data    :{ data1:data },
  success :function(response) {
    alert("thank u");
  }
 });
});
})
</script>

在 Laravel 中,你可以只 return arrayobject 它会自动将其转换为 json response

return ['success' => true, 'data' => $data];

问题是类型应该是 "GET" 而不是 "POST" 和

route get('form-data', 'FormController@postform');

谢谢大家的帮助

Laravel 5 出于安全原因使用 csrf 令牌验证....试试这个...

  1. 在routes.php

    route post('form-data', 'FormController@postform');
    
  2. 在主布局文件中

    <meta name="csrf-token" content="{{ csrf_token() }}" />
    
  3. var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    $.ajax({
        url: '/form-data/',
        type: 'POST',
        data: {_token: CSRF_TOKEN},
        dataType: 'JSON',
        success: function (data) {
            console.log(data);
        }
    });
    

如果您要发送所有表单数据则更好,然后在 ajax 中使用 data: $(this).serialize(),在表单内部使用 {{ csrf_field() }}