簡體   English   中英

Jquery UI自動完成項目鏈接

[英]Jquery UI autocomplete link to item

我想創建一個搜索框,您可以在其中搜索數據庫中的記錄。

search.php看起來像這樣:

<?php
// connect to mysql
require_once('includes/connect.php');
// include config
include('includes/config.php');

$nameser = $_GET['term'];

$names = array();
$result = mysql_query("SELECT name,customerid FROM customers WHERE name LIKE '%".$nameser."%' ORDER BY name ASC");
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
    $row_array['id'] = $row['customerid'];
    $row_array['value'] = htmlentities($row['name']);

    array_push($names,$row_array);
   }

echo json_encode($names);

?>

Javascript部分看起來像這樣:

    $("#tags").autocomplete({
        source: "search.php",
        minLength: 2,
        select: function(event, ui) {
          window.location = ("customers.php?action=view&cid=" + item.id)
          //$('#tags').val(ui.item.id);
          //return false;
        }
    })
    .data("autocomplete")._renderItem = function( ul, item ) {
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a href='customers.php?action=view&cid="+ item.id + "'>"+ item.label + "</a>" )
        .appendTo( ul );
    };

但是,這會給出錯誤:

ReferenceError: item is not defined

我想要發生的是,當我點擊結果列表中的某些內容時,我會被重定向到網址

customers.php?action=view&cid={CustomerID}

有人有個主意嗎?

編輯:

糾正有效的Javascript代碼:

$("#tags").autocomplete({
    source: "search.php",
    minLength: 2,
    select: function(event, ui) {
      window.location = ("customers.php?action=view&cid=" + ui.item.id)
      //$('#tags').val(ui.item.id);
      //return false;
    }
})
.data("autocomplete")._renderItem = function( ul, item ) {
return $( "<li></li>" )
    .data( "item.autocomplete", item )
    .append( "<a href='customers.php?action=view&cid="+ item.id + "'>"+ item.label + "</a>" )
    .appendTo( ul );
};

我在jsfiddle中有一個帶有工作示例的演示。 在這里你可以看到它:

關鍵是在autoselect select方法中獲取有效的url值。 請務必使用console.log ui值,以便查看可供您使用的內容。 我能夠使用標准的ui.item.value值將用戶發送到另一個頁面。

測試我的演示:

1.)進入輸入框並輸入“a”。 2.)選擇“http://www.utexas.edu”3.)新頁面將加載。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM