Question

我有一个带有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>
}

仅适用于“客户”字段。同样在Visual Studio中，我可以看到查询已完成。那么也许问题在于解析API结果？我不知道...

Answer 1

问题是被调用的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>);
}

提前为一个领域工作，但不在另一领域工作

1 个答案: