最近我遇到了集成select2和laravel的问题。
我想调用ajax请求来过滤用户但我找不到结果。
我在localhost中创建了测试文件:
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
</head>
<body>
<select class="js-data-example-ajax"></select>
<script>
$('.js-data-example-ajax').select2({
ajax: {
url: 'ajax.php',
dataType: 'json'
// Additional AJAX parameters go here; see the end of this chapter for the full code of this example
}
});
</script>
Ajax.php
<?php echo "{
\"results\": [
{
\"id\": 1,
\"text\": \"Option 1\"
},
{
\"id\": 2,
\"text\": \"Option 2\"
}
]
}";
运行正常但是当我在laravel刀片模板中使用相同的脚本时,我发现了Nore sult:
index.blade.php(注意:我在头部加载了jquery和select2)
<select class="js-data-example-ajax"></select>
<script>
$('.js-data-example-ajax').select2({
ajax: {
url: 'http://localhost/ajax.php',
dataType: 'json'
// Additional AJAX parameters go here; see the end of this chapter for the full code of this example
}
});
</script>
答案 0 :(得分:2)
如果你想在laravel项目中运行你的例子,你应该将Ajax.php文件移动到你的公共文件夹。 如果你希望你的列表不仅仅是一个静态的json内容,你应该为一个生成select2元素的函数做一个路由
<强> web.php 强>
Route::get('select2list', 'TestController@select2list');
<强> TestController.php 强>
public function select2list()
{
//generate your list in the way you want
$temp = '{
"results": [
{
"id": 1,
"text": "Option 1"
},
{
"id": 2,
"text": "Option 2"
}
]
}';
die(json_decode( $temp ));
}
要在您的视图中加载此列表,您应该像这样
创建此ajax请求var mySelect2Elements;
$.ajax({
url: "/select2list",
dataType: 'json',
type: "GET",
success: function (data) {
alert( data );
mySelect2Elements = data;
}
}).done(function() {
$('.js-data-example-ajax').select2(
{ data: mySelect2Elements}
);
});