今天我第一次尝试使用ajax。我现在在拉拉维尔做请求。
我的常规请求运行良好。当我按下按钮时,视图可以毫无问题地传递进来。现在我正在尝试获取特定的网站。2出现问题。
1.(结果显示一秒钟,然后再次消失。这很奇怪,因为我在其他请求中使用了相同的代码。
2.(我的大部分页面都无法满足请求。当我从另一个页面启动它们时,我在RouteCollection.php的第201行中得到"MethodNotAllowedHttpException:">。我真的不明白有些页面有什么不同。由于整个PATH都是在jquery中定义的。
这是我的密码。它很简单,没有任何真正的功能。仅用于学习目的。
AJAX
$(document).on('click','#getRoom', function(){
$id = document.getElementById("roomNr").value;
$.ajax({
url: $rootPath + '/ajax/GetContent3/' + $id,
type: "GET",
success: function(data){
$data = $(data);
$('#container').fadeOut().html($data).fadeIn();
}
});
_
My Route
Route::get('/ajax/GetContent3/{id}', array(
'uses' => 'roomController@show2'
));
_
My Controller
public function show2($id)
{
return view('pages.room2')->with('id',$id);
}
_
My HTML Container
<div class="container" id="container"></div>
_
My FORM(INSIDE NAVBAR)
<form action="" method="post">
<input type="text" name="roomNr" id="roomNr" required>
<input type="submit" value="Submit" id="getRoom">
<input type="hidden" id="token" name="_token" value="{{ csrf_token() }}">
</form>
这是一种简单的方法,但我想慢慢学习如何传递数据。
提前感谢您的帮助!
编辑:我发现,如果站点由多个参数路由,ajax请求根本不起作用(不知道怎么说,所以我举了一个例子(
www.mysite.com/my_stuff/->AJAX请求有效
www.mysite.com/my_stuff/otherstuff/-AJAX请求无效
第2版:
RELEVANT PHP ARTISAN ROUTE:LIST
METHOD URI ACTION
GET|HEAD | ajax/GetContent | App'Http'Controllers'ajaxController@loadContent
GET|HEAD | ajax/GetContent2| App'Http'Controllers'ajaxController@loadContent2
GET|HEAD | ajax/GetContent3/{id} | App'Http'Controllers'roomController@show2
编辑3
GET|HEAD| todo/{id}|| App'Http'Controllers'pagesController@show |
编辑4:MY routes.php
Route::get('/', function () {
return view('welcome');
});
Route::get('admin/createroom', [
'middleware' => 'auth',
'uses' => 'roomController@create'
]);
Route::post('admin/createroom', 'roomController@store');
Route::get('todo', 'pagesController@index');
Route::get('image','pagesController@image');
Route::get('todo/create', [
'middleware' => 'auth',
'uses' => 'pagesController@create'
]);
Route::get('profile', [
'middleware' => 'auth',
'uses' => 'pagesController@profile'
]);
Route::post('todo','pagesController@store');
Route::get('todo/{id}','pagesController@show');
Route::controllers([
'auth' => 'Auth'AuthController',
'password' => 'Auth'PasswordController',
]);
Route::get('logout','pagesController@doLogout');
Route::get('login', 'Auth'AuthController@getLogin');
Route::get('home', 'pagesController@index');
Route::get('/ajax/GetContent', array(
'uses' => 'ajaxController@loadContent'
));
Route::get('/ajax/GetContent2', array(
'uses' => 'ajaxController@loadContent2'
));
Route::get('/ajax/GetContent3/{id}', array(
'uses' => 'roomController@show2'
));
app/config.php这样定义url:
'url' => 'http://localhost/app2',
所以当我在"http://localhost/app2/public/todo"然后按下ajax按钮,它就工作了。
当我在"http://localhost/app2/public/todo/1"上按下ajax按钮时,它不起作用。
所以不是
<script src="/js/app.js"></script>
我现在使用
<script src="<?php echo url();?>/js/app.js"></script>
在主叶片模板中。很抱歉打扰你,但我还是个初学者。
对于您遇到的第一个问题,"内容显示然后消失…"我认为您的jQuery代码有问题。如果你像那样连锁呼叫,html、fadeIn和fadeOut的更改都是同时完成的。
您必须使用fadeOut函数的回调才能更改您的html,然后只有在fadeOut完成时才能在其中进行fadeIn。要做到这一点,你必须这样调用你的函数:
$(document).on('click','#getRoom', function(){
$id = document.getElementById("roomNr").value;
$.ajax({
url: $rootPath + '/ajax/GetContent3/' + $id,
type: "GET",
success: function(data){
$data = $(data);
var container = $('#container');
container.fadeOut(function() {
container.html($data).fadeIn();
});
}
});