自动完成“设置”，jquery

问题描述：

我正在尝试使用我正在构建的一个简单应用程序来自动完成工作。这是我到目前为止的代码：自动完成“设置”，jquery

 
gMeds = new Array(); 

$(document).ready(function(){ 
    var autoComp = setUpAutoComplete(); 
    if(autoComp) { 
     $("#med").autocomplete(gMeds); 
    } 
    else { 
     alert('Autocomplete unavailable'); 
    } 

}); 

function setUpAutoComplete() { 
    $.ajax({ 
     url: "ajax-getAllMeds.php", 
     async: false, 
     type: "GET", 
     dataType: "text", 
     success: function(result){ 
      gMeds = JSON.parse(result); 
      return true; 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
      alert(textStatus); 
      return false; 
     } 
    }); 
}

“Ajax的getAllMeds.php”的来源产生有效的JSON（如http://www.jsonlint.com/验证）。

产生的JSON是

 
{ 
    "meds": [ 
     { 
      "name": "ace" 
     }, 
     { 
      "name": "danger" 
     } 
    ] 
}

我试图做到的是把我的JSON成JavaScript数组，然后使用该阵列为基础，为我的话“从自动完成”的池。我离开吗？我遇到了各种问题。

像什么样的问题？ – SeanJA 2009-10-02 16:48:34

答

我在用jQuery自动完成同样的问题前两天到我如何使用Scriptaculous自动完成所考虑的点，但它原来是一个容易得多比我想象的实际 - 种惊讶于所有的头发拉我通过:)

事实证明，这是你需要的一切，认真..如果遇到问题回到我身边，我会尽力与你一起工作。

准备好你的.php文件。在我的情况下，我称它为“list.php” 我的表被称为列表，并具有字段id和名称。我只是在检索名字。这些名称将填充可选择的选项。

请注意，用户输入到输入框中的内容以'q'形式传递。这是您在下面的代码的第2行中看到的$ _GET ['q']。你可以覆盖/重命名它，但最好不要打扰。请注意，它也与输入字段本身的名称无关。

还要注意，jquery自动完成需要“\ n”来将结果分隔为独立可选的选项。如果不连接“\ n”，它将输出全部作为单个可选选项。

//start with database connection of course 
$rs = mysql_query("SELECT * FROM lists WHERE name LIKE '%" . $_GET['q'] . "%'"); 


while($row = mysql_fetch_assoc($rs)) { 
    echo $row['name'] . "\n"; 
}

准备好您的输入字段。就我而言，我把它叫做NAME =“myinputfield”但由于名称并不重要，这不是重要的，它的ID =“搜索关键词”的事项

<input name="myinputfield" type="text" id="searchterm" size="30" maxlength="100" />

在.js文件

然后，包括以下：

$("#searchterm").autocomplete("list.php");

我做了一些额外的东西与造型等，因为我不喜欢默认的样式，但仅此而已，你需要得到functionalirty去。最重要的一点是在你的脚本中使用$ _GET ['q']，并在你的js中定位#searchterm id。

让我知道这是否解决了您的问题。

老兄！这完全解决了这个问题！我的大部分内容都是你的建议，除非我不必要地把它变成一个JSON对象而使它变得复杂。谢谢你的帮助！！ – acedanger 2009-10-02 17:21:05

是的，不需要设置ajax/json。插件在.autocomplete（）的后台为你做了所有的事情，我最初也做了同样的事情 – Chris 2009-10-02 17:34:16

答

你应该尝试的第一件事情是这样的：

gMeds = JSON.parse(result).meds;

你也应该移动代码到成功的方法。

$(document).ready(function(){ 
    setUpAutoComplete(); 
}); 

function setUpAutoComplete() { 
    $.ajax({ 
     url: "ajax-getAllMeds.php", 
     async: false, 
     type: "GET", 
     dataType: "text", 
     success: function(result){ 
      var json = JSON.parse(result); 
       if (!json || !json.meds) { 
        alert('invalid'); 
       } 
       $("#med").autocomplete(json.meds); 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
      alert(textStatus); 
      return false; 
     } 
    }); 
}

自动完成“设置”，jquery

相关推荐