3

我编写的代码在用户选择有效的内容后无法使用JQuery 自动完成来触发结果函数(如下)。

通过结果,我的意思是结果处理程序,一个在自动完成插件中发生良好选择后触发的函数。记录在这里

就我而言,我有一个表格,它实际上是一个表格,其中每一行都是相同的,减去字段上的唯一 ID:Item1、Qty1、Desc1,然后是 Item2、Qty2、Desc2 等等。当用户输入 Item1 代码时,Desc1 文本应显示所选项目代码的英文(Item2 -> Desc2,依此类推)。

我使用此代码查找所有 Item 输入并在其上添加自动完成功能。结果事件处理程序由于某种原因不会触发。如果您注意到,我对“Item1”选择进行了硬编码,因为我还没有弄清楚如何选择与 Item1 -> Desc1、Item2 -> Desc2 等的 Item 对应的 Desc。

我使用 MVC Url.Content 只是因为我碰巧让它工作。有人用过Url.Action,我觉得比较好,只需要搞清楚。

如有必要,请随时更正我的使用,这是我第一次使用 ASP.NET MVC / JQuery。

谢谢 :)

编码:

$(document).ready(function(){

  $("input[id^='Item']").autocomplete( "<%= Url.Content("~/products/autocomplete")%>", {
  dataType: 'json',
  parse: function(data) {
      var rows = new Array();
      for( var i = 0; i<data.length; i++)
      {   rows[i] = {data:data[i], value:data[i].name, result:data[i].id }; }
      return rows;
  },
  formatItem: function(row, i, n) {
            return row.id + ' - ' + row.name;
        },
  selectFirst: true,
  //autoFill: true,
  minChars: 2,
  max: 30,
  autoFill: true,
  mustMatch: true,
  matchContains: false,
  scrollHeight: 100,
  width: 300,
  cacheLength: 1,
  scroll: true
  });

  $("Item1").result(function(event, data, formatted) {
      $("Desc1").html( !data ? "No match!" : "Selected: " + formatted);
  });
});
4

1 回答 1

7
$(document).ready(function(){

    $("input[id^='Item']").autocomplete( "<%= Url.Content("~/products/autocomplete")%>", {
            dataType: 'json',
            parse: function(data) {
                var rows = new Array();
                for( var i = 0; i<data.length; i++)
                {   rows[i] = {data:data[i], value:data[i].name, result:data[i].id }; }
                return rows;
            },
            formatItem: function(row, i, n) {
                return row.id + ' - ' + row.name;
            },
            selectFirst: true,
            //autoFill: true,
            minChars: 2,
            max: 30,
            autoFill: true,
            mustMatch: true,
            matchContains: false,
            scrollHeight: 100,
            width: 300,
            cacheLength: 1,
            scroll: true
    }).result(function(event, data, formatted) {
        var n = $(this).attr("id").match(/\d+/);
        var b = $("span[id='Desc"+n+"']")
        b.html( !data ? "No match!" : "Selected: " + formatted);
    });
});
于 2009-09-23T03:18:27.640 回答