使用Ajax进行实时搜索并在Laravel 5.8上获取错误“ 500(内部服务器错误)”

时间:2019-04-13 01:55:45

标签: ajax laravel

我正在使用Laravel上的ajax进行实时搜索的教程,但是在实现中出现错误

  

获取http://localhost:8000/search?search=k 500(内部服务器错误)

我已按照本教程操作3次,但始终会遇到相同的错误。我这样修改:

// Settings<T> has the same keys as T, and the values are all Setting
type Settings<T> = Record<keyof T, Setting>;

// constraining SettingsCountryRank to Settings<SettingsCountryRank> is
// makes sure that every declared property has type Setting:
interface SettingsCountryRank extends Settings<SettingsCountryRank> {
    taiwan: Setting;
    china: Setting;
    // oopsie: string; // uncomment this to see an error
}

// constraining TSettings to Settings<TSettings> lets the compiler know that
// all properties of TSettings are of type Setting
class Configuration<TSettings extends Settings<TSettings>> {
    settings: TSettings;

    public get<U extends keyof TSettings>(key: U): TSettings[U]['value'] {
        return this.settings[key].value;
    }

    constructor(settings: TSettings) {
        this.settings = settings;
    }
}

function main() {
    const test = new Configuration<SettingsCountryRank>({ taiwan: new Setting(1, true), china: new Setting(2, false) });
    test.get('china')
    test.get('notathing'); // error as expected
}

我的控制器:

<!DOCTYPE html>
<html>
    <head>
        <meta name="_token" content="{{ csrf_token() }}"> 
        <title>Live Search</title>
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h3>Products info </h3>
                    </div>
                    <div class="panel-body">
                        <div class="form-group">
                            <input type="text" class="form-controller" id="search" name="search">
                            <input type="hidden" name="_method" value="POST">
                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                        </div>
                        <table class="table table-bordered table-hover">
                            <thead>
                                <tr>
                                  <th>ID</th>
                                  <th>Product Name</th>
                                  <th>Description</th>
                                  <th>Price</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <script type="text/javascript">
            $('#search').on('keyup',function() {
                $value=$(this).val();
                $.ajax({
                    type : 'get',
                    url : '{{URL::to('search')}}',
                    data:{'search':$value},
                    success:function(data){
                        $('tbody').html(data);
                    }
                });
            });
        </script>

        <script type="text/javascript">
            $.ajaxSetup({ headers: { 'csrftoken' : '{{ csrf_token() }}' } });
        </script>
    </body>
</html>

我在3个不同的数据库中尝试使用此代码,并始终遇到500错误。

2 个答案:

答案 0 :(得分:1)

您已经使用ajax方法调用了get,因此请先检查您的路由文件。

我认为您正在使用post方法调用search方法。

同样在ajax代码中,默认方法是get方法

您必须指定:method : post

答案 1 :(得分:1)

您需要像下面这样在declare variableJquery/Javascript

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

并像下面在variable中一样传递此ajax

data:{'search':value}

更改上面的行,应该可以!