Question

我有一个XML格式的机场列表，我想用jquery自动完成功能。

XML文件如下所示：

<item code="AAR" airport="Aarhus" country="Denmark" />

当做出选择时，除了用“Aarhus”填充搜索输入框之外，我想提醒“代码”的内容。

我试过这样：

$(function() {
    $.ajax({
      url: "airports.xml",
      dataType: "xml",
      success: function( xmlResponse ) {
        var data = $("item", xmlResponse ).map(function() {
          return {
            value: $( "airport", this ).text(),
            code: $( "code", this ).text()
          };
        }).get();
        $( "#airport_from" ).autocomplete({
          source: data,
          minLength: 0,
          select: function( event, ui ) {
             alert(ui.item.code);
          }
        });
      }
    });
  });

警报只是显示“未定义”，我错过了什么？

Answer 1

我认为你的问题可能是当你给自动填充一个对象列表时，它需要标签和值属性。

http://api.jqueryui.com/autocomplete/#option-source

也许试试这个：

$(function() {
    $.ajax({
      url: "airports.xml",
      dataType: "xml",
      success: function( xmlResponse ) {
        var data = $("item", xmlResponse ).map(function() {
          return {
            label: $( "airport", this ).text(),
            value: $( "code", this ).text()
          };
        }).get();
        $( "#airport_from" ).autocomplete({
          source: data,
          minLength: 0,
          select: function( event, ui ) {
             alert(ui.item.value);
          }
        });
      }
    });
  });

Answer 2

我最终将XML转换为CSV并返回到XML，格式已将格式更改为：

 <airport>
 <airport_code>AAR</airport_code>
 <airport_name>Aarhus</airport_name>
 <airport_country>Denmark</airport_country>
 </airport>

现在代码正在按预期工作。

来自XML的Jquery自动完成（多个值）

2 个答案: