ASP.NET Core jquery Autocomplete returns empty rows in a list

I am using ASP.NET Core jquery autocomplete with Boostrap 4 I have successfully completed the following example: https://jqueryui.com/autocomplete/

Now I want to use the data of my controller, which correctly returns the data. As a result, I get blank lines.

enter image description here

Here is my Razor page

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

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

<div class="ui-widget">
    <label>Autocomplete Example: </label>
    <input id="LastName" name="LastName" type="text" />
</div>
<script>
    $("#LastName").autocomplete({
        source: '@Url.Action("GetName","Home")'
    });
</script>

Here is my controller [HttpGet] public IActionResult GetName (string term) {

        List<TransactionName> list = new List<TransactionName>()
        {

            new TransactionName {Id=1,LastName="Linda" },
            new TransactionName {Id=2,LastName="Donna" },
            new TransactionName {Id=3,LastName="Maryanne" },
            new TransactionName {Id=4,LastName="Deb" },
            new TransactionName {Id=5,LastName="Liz" },
            new TransactionName {Id=6,LastName="Bobby" },
            new TransactionName {Id=7,LastName="Beth" }

    };
        var result = (from N in list
                        where N.LastName.Contains(term)
                        select new {N.LastName });
        return Json(result);
    }

enter image description here

+4
source share
2 answers

I changed the following based on jQuery Autocomplete documentation:

    var result = (from N in list
                    where N.LastName.Contains(term)
                    select new {value=N.LastName });

, . : : . : : [ "Choice1", "Choice2" ] : [{label: "Choice1", value: "value1" },...]

+1

:

{
    "Linda",
    "Donna",
    //... etc
}

:

[
    "Linda",
    "Donna",
    //... etc
]

, :

return Json(result.ToArray());

, , .

0

Source: https://habr.com/ru/post/1692927/


All Articles