Question

我正在使用以下网址http://localhost/npr/public/admin/athletes/test/143在屏幕上工作在此屏幕上，我实现了以下未找到的动态下拉列表Ajax调用：

$(document).ready(function() {
 $('select[name="section"]').on('change', function() {

     var sectionID = $(this).val();

     if(sectionID) {
         $.ajax({
             url: './getSportPositions'+sectionID,
             method: 'get',
             //data: {"_token": $('#token').val()},
             dataType: "json",
             success:function(data) {
                 $('select[name="position"]').empty();
                 $('select[name="position"]').append('<option value="">'+ '-- Please choose one --' +'</option>');
                 $.each(data, function(i, position) {
                     $('select[name="position"]').append('<option value="'+position.name+'">'+ position.name +'</option>');
                 });
             }
         });
     }else{
         $('select[name="position"]').empty();
     }
 });
});

路线：

Route::get('getSportPositions{id}','HomeController@getSportPositions');

我也尝试过：

Route::get('/admin/athletes/test/getSportPositions{id}','HomeController@getSportPositions');

是否归因于呼叫网址中的运动员ID 143？我该如何修复这个电话？从错误看来，它试图访问这条路线：

Route::get('/admin/athletes/test/{athlete}/', [
    'uses' => 'HomeController@testAnAthlete',
    'as' => 'admin.test_athlete'
]);

HTML：

    <div class="form-group {{ $errors->has('position') ? ' alert alert-danger' : '' }}">
        <label for="position" class="col-md-3 control-label">Position in Team</label>

        <div class="col-md-6">
            <select class="form-control" name="position" id="position">
                @if (!$errors->has('position'))
                  <option selected value> -- select a team first --  </option>
                @endif
            </select>
        </div>
        @if ($errors->has('position'))
            <span class="help-block">
                <strong>{{ $errors->first('position') }}</strong>
            </span>
        @endif                                        
    </div>

Answer 1

当你使用Ajax时，你必须得到像

这样的网址

var APP_URL = $('meta[name="_base_url"]').attr('content');

也加上这个 <meta name="_base_url" content="{{ url('/') }}"> 标题

然后你可以使用APP_URL

var url = APP_URL+"/getSportPositions/"+sectionID;

Answer 2

我的补充。在laravel视图中：

<meta name="_base_url" content="{{ url('/') }}">
<meta name="csrf-token" content="{{ csrf_token() }}">

除了 @Nikhil Radadiya 答案外，因为使用jquery意味着您等待页面准备就绪，因此可以使用javascript：

var APP_URL = document.getElementsByTagName('meta')._base_url.content;
var APP_CSRF = document.querySelector("meta[name='csrf-token']").content; // javascript cannot use dash, else you can use csrf_token at meta name

然后您可以在ajax中使用：

$.ajax({
    headers: {
        'X-CSRF-TOKEN': APP_CSRF
    },
    url: APP_URL + '/your_ajax_path',
    ...
    ...
});

并确保该网址已加载到您的网络路由中。

Answer 3

您可以命名路由，并使用BLADE为该路由设置Javascript变量。

例如：

Route::get('/', 'MyAmazingController@function')->name('my.awesome.route');

然后，您可以在Javascript中执行以下操作：

url: '{{ route('my.awesome.route') }}';

如果您将javascript保存在单独的文件中，则可以在视图中创建一个包含路由的常量。

val ROUTES = {
    AJAX: '{{ route('my.awesome.route') }}'
}

Laravel 5.3找不到Ajax网址

3 个答案: