为一个领域工作但不为另一个领域工作

typeahead working for one field but not the other

我有一个包含 2 个输入字段的表单,我希望为两者提供自动完成功能,但来源不同。虽然两者的代码基本相同,但它仅适用于一个领域(客户)。如果我使用 postman 手动查询 API,我会按预期获得数据。

这是表格

@model dynamic

@{
    ViewBag.Title = "New Rental Form";
}

<h2>New Rental Form</h2>
<form>
    <div class="form-group">
        <label>Customer</label>
        <input id="customer" type="text" value="" class="form-control" />
    </div>
    <div class="form-group">
        <label>Movie</label>
        <input id="movie" type="text" value="" class="form-control" />
    </div>
    <button class="btn btn-primary">Submit</button>
</form>
@section scripts
{
    <script>
        $(document).ready(function () {
            var vm = {};

            var customers = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                remote: {
                    url: '/api/customers?query=%QUERY',
                    wildcard: '%QUERY'
                }
            });

            $('#customer').typeahead({
                minLength: 3,
                highlight: true
            },
                {
                    name: 'customers',
                    display: 'name',
                    source: customers
                }).on("typeahead:select",
                    function (e, customer) {
                        vm.customerId = customer.id;
                });

            var movies = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                remote: {
                    url: '/api/movies?query=%QUERY',
                    wildcard: '%QUERY'
                }
            });

             $('#movie').typeahead({
                    minLength: 3,
                    highlight: true
                },
                    {
                        name: 'movie',
                        display: 'name',
                        source: movies
                    });
            })
    </script>
}

它仅适用于 'Customer' 字段。同样在 Visual Studio 中,我可以看到查询已完成。所以也许问题是解析 API 结果?我不知道...

问题是被调用的 API 并没有真正过滤列表。它总是返回完整的电影列表。如果结果太多,typeahead 似乎不会显示选择。所以我所要做的就是实现接收 %QUERY 值的参数并实际过滤列表。

public IEnumerable<MovieDto> GetMovies(string query = null)
{
    var moviesQuery = _context.Movies
        .Include(m => m.Genre)
        .Where(m => m.AmmountAvailable > 0);

     if (!string.IsNullOrWhiteSpace(query))
        moviesQuery = moviesQuery.Where(m => m.Name.Contains(query));

    return moviesQuery
        .ToList()
        .Select(Mapper.Map<Movie, MovieDto>);
}