jQuery 自动完成插件在视图中不起作用

萨德最远

朋友们，我已经完成了构建自动完成的所有步骤，但是在显示搜索结果时出现了问题。请看图片。

从数据库中读取信息，但视图无法正常工作。我正在使用 Bootstrap 的第 4 版。

 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">

   <input type="text" id="SematYaShoghlBime" name="SematYaShoghlBime" />

<script>
    $(document).ready(function () {
        $('#SematYaShoghlBime').autocomplete({
            source: '/Home/SearchInTaminJobs'
        });
    })
</script>

[HttpGet]
public IActionResult SearchInTaminJobs()
{
    string term = HttpContext.Request.Query["term"].ToString();
    var query = _context.Citys.Where(Ad => Ad.CityName.Contains(term)).ToList();

        return Ok(query);
 
}

<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

丽娜

在您的图像中，自动完成字段已呈现，但文本丢失。这可能是由于您通过 API 返回对象列表而不是字符串列表。

您可以像这样更改 API 以提供列表作为响应：

   var query = _context.Citys.Where(Ad => Ad.CityName.Contains(term))
                              .Select(c => c.CityName)   //add this line...
                              .ToList();

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。