第一次使用Ajax(加上Laravel),但我在理解方面有问题


Using Ajax the first Time (plus Laravel) but i have problems understanding

今天我第一次尝试使用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按钮时,它不起作用。

我是个白痴。我没有意识到js文件没有加载到子例程中。

所以不是

<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();
            });
        }
    });