C# 将Razor与Jquery合并以实现自动完成功能

我用这本指南和我对C#和razor所知的一点来尝试自动完成3个文本框

因此，如果我输入partno并从下拉列表中选择一个，则会填充项目名称、desc和ID。如果我在任何其他字段中键入，也是一样的

我已经创建了一个类，并将它放在一个列表中，其中包含

var varItems = new List<Item>();
            varItems = db.Items.Select(tbl => new Item
                    {
                            ID = tbl.ID,
                            Name = tbl.Name,
                            PartNo = tbl.PartNo,
                            Description = tbl.Description
                    }).ToList();

然后在视图中

   $( "#Name" ).autocomplete({
        minLength: 0,
        source: @ViewBag.Items,
        focus: function( event, ui ) {
            $( "#Name" ).val( ui.item.label );
            return false;
        },
        select: function( event, ui ) {
            $( "#Name" ).val( ui.item.Name );
            $( "#PartNo" ).val( ui.item.PartNo );
            $( "#Description" ).html( ui.item.Description );
            return false;
        }
    });

但它不喜欢那里有可视包。我猜我必须做一些循环来产生像下面这样的东西

var projects = [
      {
        value: "jquery",
        label: "jQuery",
        desc: "the write less, do more, JavaScript library",
        icon: "jquery_32x32.png"
      },
      {
        value: "jquery-ui",
        label: "jQuery UI",
        desc: "the official user interface library for jQuery",
        icon: "jqueryui_32x32.png"
      },
      {
        value: "sizzlejs",
        label: "Sizzle JS",
        desc: "a pure-JavaScript CSS selector engine",
        icon: "sizzlejs_32x32.png"
      }
    ];

如果是这样，我如何循环我的列表来创建上述内容

谢谢大家

试试这个：

source: @Html.Raw(Json.Encode(@ViewBag.Items));

---

这会将您的项目编码为json，它应该可以工作。

Im在名称字段下出现一个空下拉列表？这可能是另一个错误，您能确认json生成正确吗？查看Html源代码。我认为它看起来不错是的：源代码：[{“ID”：1，“Name”：“HP DL360p”，“PartNo”：“670638-425”，“Description”：“}，{“ID”：2，“Name”：“Samsung 840 Pro 256GB”，“PartNo”：“Description”：“256GB SSD”}]，如果您将其更改为静态json，您将遇到与现在相同的问题，它不是对viewbag的编码或管理，而是您正在使用的jquery。也许可以创建其他问题，并使用jsfiddle.net来显示发生了什么，有人可以帮助您。好的，我试试看，感谢您对json内容的帮助：）

source: @Html.Raw(Json.Encode(@ViewBag.Items));