Javascript ajax函数不能与Laravel-4一起正常工作
我试图做的是将一个变量从我的视图传递到控制器函数。问题是我从未被路由到控制器的函数存储。因此我无法检查是否也获得了该变量。ajax功能似乎可以工作(显示警报),但我从未从控制器收到成功消息 到目前为止,我的路由文件是:Javascript ajax函数不能与Laravel-4一起正常工作,javascript,php,jquery,ajax,laravel-4,Javascript,Php,Jquery,Ajax,Laravel 4,我试图做的是将一个变量从我的视图传递到控制器函数。问题是我从未被路由到控制器的函数存储。因此我无法检查是否也获得了该变量。ajax功能似乎可以工作(显示警报),但我从未从控制器收到成功消息 到目前为止,我的路由文件是: Route::get('pois', array( 'uses' => 'MapController@create', 'as' => 'pois.create' )); Route::post('pois', array( 'use
Route::get('pois', array(
'uses' => 'MapController@create',
'as' => 'pois.create'
));
Route::post('pois', array(
'uses' => 'MapController@store',
'as' => 'pois.get'
));
我的地图控制器是:
public function create()
{
$bar=new Map;
$rest=new Map;
$mag=new Map;
$bar = Map::where('type', '=', 'bar')->take(10)->get();
$rest = Map::where('type', '=', 'restaurant')->take(10)->get();
$mag = Map::where('type', '=', 'magazine')->take(10)->get();
return View::make('pois.markers')->with('bar',$bar)->with('rest',$rest)->with('mag',$mag);
}
/**
* Store a newly created resource in storage.
*
* @return Response
*/
public function store()
{
dd('suceess');
}
我的javascript jquery脚本如下:
function ajaxCall(id) {
$.ajax
({
type: "POST",
url: "pois",
data: {"id" : id},
success: function(response)
{
alert('ok');
}
});
}
function checkBoxes(elem){
if(document.getElementById(elem).checked==true){
ajaxCall(elem);
}
else{
clearMarkers(elem);
}
}
下面是我的HTML:
@section('main_contents')
<br/>
<div class="text-center">
<label class="checkbox-inline">
<input type="checkbox" id="bar" name="group" value="option1" onClick="checkBoxes(this.id)"> Καφετέριες
</label>
<label class="checkbox-inline">
<input type="checkbox" id="restaurant" name="group" value="option2" onClick="checkBoxes(this.id)"> Εστιατόρια
</label>
<label class="checkbox-inline">
<input type="checkbox" id="magazine" name="group" value="option3" onClick="checkBoxes(this.id)"> Μαγαζιά
</label>
<br/>
</div>
<div id="map" style="height:500px;"></div>
@stop
@节(“主要内容”)
Καφετέριες
Εστιατόρια
Μαγαζιά
@停止
您没有收到success
消息,因为您没有从控制器返回任何消息
更改dd('success')代码>到返回“成功”代码>
public function store()
{
return 'success';
}
您的Ajax代码:
$.ajax
({
type: "POST",
url: "pois",
data: {"id" : id},
success: function(response)
{
alert(response);
}
});
编辑:
$( document ).ready(function() {
$(".checkbox").change(function() {
if(this.checked) {
var id = $('.checkbox').val();
var request = $.ajax({
url: '/pois',
type: "POST",
data: { id : id },
dataType: "html"
});
request.done(function(result) {
if(result == 'success') {
alert("Success");
} else {
alert ("Sorry! unable to add the data");
}
});
request.fail(function(jqXHR, textStatus) {
console.log( "Request failed: " + textStatus );
});
}
});
});
@section('main_contents')
<br/>
<div class="text-center">
<label class="checkbox-inline">
<input type="checkbox" id="bar" class="checkbox" name="group" value="1"> Καφετέριες
</label>
<label class="checkbox-inline">
<input type="checkbox" id="restaurant" class="checkbox" name="group" value="2"> Εστιατόρια
</label>
<label class="checkbox-inline">
<input type="checkbox" id="magazine" class="checkbox" name="group" value="3"> Μαγαζιά
</label>
<br/>
</div>
<div id="map" style="height:500px;"></div>
@stop
将URLURL:“pois”
,更改为URL:“/pois”
Jquery代码:
$( document ).ready(function() {
$(".checkbox").change(function() {
if(this.checked) {
var id = $('.checkbox').val();
var request = $.ajax({
url: '/pois',
type: "POST",
data: { id : id },
dataType: "html"
});
request.done(function(result) {
if(result == 'success') {
alert("Success");
} else {
alert ("Sorry! unable to add the data");
}
});
request.fail(function(jqXHR, textStatus) {
console.log( "Request failed: " + textStatus );
});
}
});
});
@section('main_contents')
<br/>
<div class="text-center">
<label class="checkbox-inline">
<input type="checkbox" id="bar" class="checkbox" name="group" value="1"> Καφετέριες
</label>
<label class="checkbox-inline">
<input type="checkbox" id="restaurant" class="checkbox" name="group" value="2"> Εστιατόρια
</label>
<label class="checkbox-inline">
<input type="checkbox" id="magazine" class="checkbox" name="group" value="3"> Μαγαζιά
</label>
<br/>
</div>
<div id="map" style="height:500px;"></div>
@stop
HTML代码:
$( document ).ready(function() {
$(".checkbox").change(function() {
if(this.checked) {
var id = $('.checkbox').val();
var request = $.ajax({
url: '/pois',
type: "POST",
data: { id : id },
dataType: "html"
});
request.done(function(result) {
if(result == 'success') {
alert("Success");
} else {
alert ("Sorry! unable to add the data");
}
});
request.fail(function(jqXHR, textStatus) {
console.log( "Request failed: " + textStatus );
});
}
});
});
@section('main_contents')
<br/>
<div class="text-center">
<label class="checkbox-inline">
<input type="checkbox" id="bar" class="checkbox" name="group" value="1"> Καφετέριες
</label>
<label class="checkbox-inline">
<input type="checkbox" id="restaurant" class="checkbox" name="group" value="2"> Εστιατόρια
</label>
<label class="checkbox-inline">
<input type="checkbox" id="magazine" class="checkbox" name="group" value="3"> Μαγαζιά
</label>
<br/>
</div>
<div id="map" style="height:500px;"></div>
@stop
@节(“主要内容”)
Καφετέριες
Εστιατόρια
Μαγαζιά
@停止
我还没有测试代码,但应该可以工作。在对控制器进行ajax调用时。。。你可以这样检查
$jsonResponse = [
'imageReceived' => $r->hasFile('profilePicture')
];
return $jsonResponse;
这将以true或false返回控制台响应,如下所示
{"imageReceived":false}
不,它仍然不起作用…dd函数应该起作用…它是var_dump and die的快捷方式…问题是我从未到达我的存储函数…我想,你的Ajax URL有问题。尝试将URL更改为/pois
我也尝试过…但是运气不好..我的脚本有一些javascript和一些其他jquery函数..介意吗?您使用的是哪个浏览器?如果您使用Chrome,请查看开发者工具中的网络部分。您将看到错误。您介意我更改您的javascript和HTML吗。我将使用纯JQuery和html5