Question

我如何填写城市的打字类似于kayak.com从postgresql获取数据的方式？

所以，如果我输入字母Ma所有以MA开头的城市出现

非常感谢

Answer 1

像这样的SQL查询应该这样做：

 // When the document is ready, run the following function:
 $(function(){

    // Get all the TD elements:
    var allTheTDs = document.querySelectorAll("td.level");

    // Loop through the array of all the TD elements
    for(var i = 0; i < allTheTDs.length; ++i){

        // Check to see if the current TD has an ID of 7 or less
        if(allTheTDs[i].id <=7 ){

           // Remove the current content of the TD
           allTheTDs[i].innerHTML = "";

           // Create a new img element
           var img = document.createElement("img");

           // Configure the new img element to have a src attribute value
           // that is based on the id value
           img.src = "../img/CL" + allTheTDs[i].id + ".png";

           // Give the img an alt to match the src, just to show
           // it works
           img.alt = "../img/CL" + allTheTDs[i].id + ".png";

           // Append the new image into the current TD
           allTheTDs[i].appendChild(img);
        }
    }
 });

SELECT * FROM cities WHERE name LIKE "Ma%";是包含您的城市的表格
cities是该表中存储城市名称

您可以使用较新的操作符SIMILAR代替name。

Answer 2

为了构建像你在kayak.com上看到的自动完成下拉菜单，你需要一个前端和后端组件。

对于前端，您可以使用JQuery UI或其中一个可用的库，例如one。当然你也可以建立自己的。

但是，在所有情况下，您都需要一个数据源来填充下拉列表。由于您的问题提到了Postgresql，我假设您已经有一个包含潜在位置名称的表，并知道如何查询它（如@Philippe A在其答案中所示）。

您需要做什么来查询后端（通过AJAX）来检索此信息。这可以在用户输入之后重复完成，例如，已经键入了至少3个字符。或者，它可以完成一次，数据存储在代码搜索的Javascript变量中。

由于您没有指定使用后端的编程语言，因此很难提供示例代码，但至少对于前端，请查看此JQuery UI example

从Postgresql填写类似于kayak.com的城市

2 个答案: