jQuery的自動完成 - 帶標籤進入輸入

，我有以下的jquery自動完成代碼工作完美：jQuery的自動完成 - 帶標籤進入輸入

$("#autoc1").autocomplete("/autoc2.php?arg=1&category=<? echo $category_id; ?>", { 
width: 400, 
matchContains: true, 
minChars: 3, 
selectFirst: false 
});

我使用PHP在automplete顯示的圖像格式的數據，爲了更好地提供更多的信息UI對於用戶來說，PHP代碼是：

$query = "SELECT $title, imageURL FROM PRprodINFO2 WHERE ((prodcatID = '$cat_id') 
      AND ($title LIKE \"%" . $_GET["q"] . "%\")) group by $title LIMIT 8"; } 

$result = mysql_query($query); 

$output_items = array(); 

while($row = mysql_fetch_array($result)) { 

$row[$title] = preg_replace('/[^\w\s].*$/', "", $row[$title]); 

$row[$title] = trim($row[$title]); 

$output_items[$row['title']] = $row['imageURL']; 

} // while 

$output_items = array_unique($output_items); 

$output = ''; 

foreach ($output_items as $title => $image) { 

$output .= '<img src='.$image.' style=max-width:50px;>'.$title."\n"; 

} 

echo $output;

的問題是自動完成的JQuery代碼被推動<img>標籤數據到輸入爲好。

有沒有這種格式的方法，但只有在沒有<img src=/....>輸入框中的項目標題？

來源

2012-01-09 Darren Sweeney

閱讀可以做到這一點通過重寫某些核心功能擴展自動完成插件，主要是「解析」。此函數的內部版本只是簡單地循環返回數據的每一行，並將其「解析」爲一個對象數組，其中包含以下屬性：數據 - 整個條目值 - 默認顯示值結果 - 數據在選擇時填充輸入元素

您可以通過將自己的解析函數作爲選項對象的一部分傳遞給自動完成來覆蓋此選項。

您還需要提供一個「formatItem」函數，它可以讓您有機會格式化自動完成下拉列表中顯示的數據！

var acOptions = { 
    minChars: 3, 
    max: 100, 
    dataType: 'json', // this parameter is currently unused 
    extraParams: { 
     format: 'json' // pass the required context to the Zend Controller 
    }, 
     parse: function(data) { 
     var parsed = []; 
     data = data.users; 

     for (var i = 0; i < data.length; i++) { 
      parsed[parsed.length] = { 
       data: data[i], 
       value: data[i].displayName, 
       result: data[i].displayName 
      }; 
     } 

     return parsed; 
    }, 
    formatItem: function(item) { 
     return item.displayName + ' (' + item.mail + ')'; 
    } 
};

然後就可以調用，並且還提供了可以在通話。結果去除圖像所要求的您如下功能：

jQuery(document).ready(function($) { 
    $('#user_id') 
     .autocomplete('/path/to/ajax/data/source', acOptions) 
     .attr('name', 'display_name') 
     .after('<input type="hidden" name="user_id" id="ac_result">') 
     .result(function(e, data) { 
      $('#ac_result').val(data.uid); // remove the img here for your text field! 
     }); 
});

希望這有助於！

來源

2012-01-09 19:00:07 DeeTee

試試這個：

$img = $('img'); 
$img.replaceWith($img.html());

這裏Jquery remove form tag, not content

來源

2012-01-09 18:46:40

jQuery的自動完成 - 帶標籤進入輸入

回答

相關問題