0

我有一个类似于以下的标准 jQuery 自动完成设置：

$("input#autocomplete").autocomplete({
    source: source,
    minLength: 5 ,
    select: function( event, ui ) {
         alert(ui.item.value);
    }
});

What I would like is, when the value is chosen, a data-table within the page appears and get populated with data from a database using the value as a search parameter.

因此，例如，如果我选择“ RED”，则表格将显示并显示来自查询的数据，例如SELECT * FROM TABLE WHERE COLUMN='RED'

查询已简化，但谁能指出我正确的方向？

4

2 回答 2

2

为此，您应该请求一种search将充当JSON端点的页面，例如

$("input#autocomplete").autocomplete({
    source: source,
    minLength: 5 ,
    select: function( event, ui ) {

      var _value = ui.item.value;

      $.post('services/populate_table.php', // endpoint URL
             { someParameterToTransmit: _value  }, // some data to transmit
             function(data) { // on complete handler
               $('.result').html(data); // populate retrieved data in any form you need
             } // on complete function
      ); // post
    } // on select (autocomplete)
}); // autocomplete

来自的数据endpoint也可以检索为JSON.

您可以阅读文档以获取有关请求方法的更多信息。

于 2012-08-15T11:30:32.430 回答
0

如果我理解正确，您正在寻找$.post.

例如，您的 jQuery 将是： 

$("input#autocomplete").autocomplete({
    source: source,
    minLength: 5 ,
    select: function( event, ui ) {
        $.post("autocomplete.php", { option: ui.item.value }, function(data){
            $("table").html( data[0] );
            // sets the content of a table element to the first matched row
        });
    }
});

在 中autocomplete.php，你会得到这样的东西： 

// DB connect

// use $_POST['option'] here for the selected option
$sth = mysql_query("SELECT ...");
$r = mysql_fetch_assoc($sth);
print $r;

我们在这里所做的是请求页面autocomplete.php并 POST 数据，在这种情况下是选定的值。autocomplete.php获取该 POST 值并搜索数据库（您可以自定义该查询以满足您的需求）。然后页面打印一个匹配行的数组，这是 jQuery 接收到的数据，可以作为 Javascript 数组进行遍历。

于 2012-08-15T11:39:56.327 回答