jquery：远程xml源的自动完成

我想实现一个自动完成文本框，其值由返回XML内容的远程脚本生成。我使用JQuery-1.4.3和JQuery-UI-1.8.5中的自动完成小部件。jquery：远程xml源的自动完成

我已经研究了XML data parsed once例如自动完成演示页，并想实现的评论：

这也应该作为对如何解析远程XML数据源的引用 - 解析将只发生在源回调中的每个请求。

作为一个测试，我试图让这个工作与提供的XML演示。上面的评论表明，自动完成'source'属性必须用Ajax调用来替换。然而，当我在demo page提供的功能修改这个，我没有收到与下面的自动完成功能的任何结果：

$("#birds").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "london.xml", 
     dataType: "xml", 
     success: function(xmlResponse) { 
     var data = $("geoname", xmlResponse).map(function() { 
//alert($('name', this).text()); 
      return { 
      value: $("name", this).text() + ", " + 
        ($.trim($("countryName", this).text()) || "(unknown country)"), 
      id: $("geonameId", this).text() 
      }; 
     }).get(); 
     } 
    }) 
    }, 
    minLength: 0, 
    select: function(event, ui) { 
    log(ui.item ? 
     "Selected: " + ui.item.value + ", geonameId: " + ui.item.id : 
     "Nothing selected, input was " + this.value); 
    } 
});

不过，注释掉简单调试弹出消息显示，Ajax调用并设法检索用于构建数据的值。我的错误在哪里？

任何帮助非常感谢！

亲切的问候，

罗恩·范登布兰登

来源

2010-10-27 rvdb

好吧，

我已经找到了解决方案，并能愉快地回答自己。

在我最初的尝试中，我在Ajax函数的成功回调中声明了变量'data'，但没有做任何事情。该解决方案非常简单：添加一个response（）函数，如果ajax调用成功，将返回数据变量。我将添加完整的校正功能（尽管鞋底变化是在第14行）：复制代码

$("#birds").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "london.xml", 
     dataType: "xml", 
     success: function(xmlResponse) { 
     var data = $("geoname", xmlResponse).map(function() { 
      return { 
      value: $("name", this).text() + ", " + 
        ($.trim($("countryName", this).text()) || "(unknown country)"), 
      id: $("geonameId", this).text() 
      }; 
     }); 
     response(data); 
     } 
    }) 
    }, 
    minLength: 0, 
    select: function(event, ui) { 
    log(ui.item ? 
     "Selected: " + ui.item.value + ", geonameId: " + ui.item.id : 
     "Nothing selected, input was " + this.value); 
    } 
});

当然，在这种情况下，响应可以直接构造，而无需首先声明一个数据变量：复制代码

 $.ajax({ 
     url: "london.xml", 
     dataType: "xml", 
     success: function(xmlResponse) { 
     response($("geoname", xmlResponse).map(function() { 
      return { 
      value: $("name", this).text() + ", " + 
        ($.trim($("countryName", this).text()) || "(unknown country)"), 
      id: $("geonameId", this).text() 
      }; 
     })); 
     } 
    }) 
    }

（注：在'remote XML' autocomplete demo插入时，这些功能片段工作）

唷！现在开始做一些有用的事情。

Ron

来源

2010-10-28 09:15:04 rvdb

jquery：远程xml源的自动完成

回答

相关问题