Livesuche starten wenn man ein @ geschrieben hat

Tl2012

Grünschnabel
Hallo,

ich möchte über ein Textfeld nach Usern suchen. Dies soll aber keine Normale Suche sein sondern es soll erst gesucht werden wenn man ein @ schreibt (Man kennt es von Facebook wo man Freunde markiert). Dafür habe ich folgendes Script geschrieben:



Code:
<script type="text/javascript">
 // ausf¸hren wenn seite komplett geladen
$(document).ready(function()
{
	
	// 1 - live-search darstellung
	$("#searchBox").bind("keyup", function()
	{
		
		var searchString = $(this).val();
 
		// nur suchen, wenn minimum 1 buchstabe im eingabefeld ist
		var length = searchString.length;
		
		if (searchString.substr(length-1) == '@')
		{
			
			$("#searchItems li").each(function(counterEntries)
			{
			    var item = $(this).text();
 
			    // kurzform von if-else
			    (item.match(searchString))? $(this).show() : $(this).hide();
			    
			
			});
 
			$("#results").show();
		}
		else {
			$("#results").hide();
		}		
	});
 
 
	// 2 - klick auf result-item
	$("#searchItems li").bind("click", function()
	{
		$("#searchBox").val($(this).text());
		$("#results").hide();
 
		// wichtig, sonst ˆffnet der browser den link!
		return false;
	});
 
});
</script>


Ausgegeben wird es hiermit:


HTML:
<input type="text"  style="width: 200px; border: 1px solid red;" class="texfe" id="searchBox" name="suche" />
<div id="panel">
	<div style="background-color: #dddddd; position: absolute;  z-index: 3000;" id="results">

		<ul id="searchItems">
			<li><a href="#">Ein Beispiel User</a></li>
 ........ Und so weiter

Das funktioniert ja an sich aber das Problem ist das er sucht dann auch nach dem @.
Kann mir jemand helfen wie ich es schaffe das er nur nach dem was nach dem @ steht sucht?

Bin über jede Hilfe dankbar :)


LG tl2012
 

Neue Beiträge

Zurück