jquery / autocomplete funktioniert nicht mit Fehlermeldung

A

aherzog

Erfahrenes Mitglied
Hallo miteinander.

Mein 2. Versuch mit jquery zu arbeiten scheitert kläglich.

Ich möchte gerne mit der autocomplete - Funktion arbeiten.
Doch egal was ich mache, welches Tutorial ich durcharbeite, alles scheitert an einer Fehlermeldung des IE8.

Dies ist mein gesamter html-Text in dem die autocomplete - Funktion auf simpelste Weise aufgerufen wird.
HTML: 
<script src="jquery.js"></script>
 
<SCRIPT>
$(
	function() 
	{
		var availableTags = [
		"ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++",
		"Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran",
		"Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl",
		"PHP", "Python", "Ruby", "Scala", "Scheme"];
		
		$("#tags").autocomplete({source: availableTags});
    }
  );
  </SCRIPT>
 
<DIV class=demo>
<DIV class=ui-widget><LABEL for=tags>Tags: </LABEL><INPUT id=tags> </DIV></DIV>
Und das ist der Fehler der vom IE8 ausgegeben wird.
Code: 
Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET CLR 1.1.4322)
Timestamp: Thu, 26 Apr 2012 08:30:13 UTC


Message: Object doesn't support this property or method
Line: 12
Char: 3
Code: 0
URI: /ajax_ah/test.html

Ich bin jetzt seit 1 1/2 Tage am probieren und suchen.
Und finde einfach nichts was mir hilft die Fehlermeldung wegzubringen.
Hab auch schon hier ein Tutorial gesucht. Scheinbar gibts keines.

Könnt ihr mir helfen was hier falsch ist?

Gruss Andreas
 
Zuletzt bearbeitet:
rd4eva

Hallo rd4eva

Danke für die Hilfe.

Ich habe nur jquery eingebunden.
Wusste nicht das es noch eine andere jquery-Library gibt.

In den Demo-Scripten sieht man halt nicht was eingebunden ist :(

Werde das gleich mal Testen.

Danke.
 
Zuletzt bearbeitet:
Cool funktioniert "fast" perfekt... :):)

Eine Frage hätte ich noch.

Ich habe nun das Array umgebaut. Da sind nun viele Produktnummern drin.
z.b 01524, 01234, 34015 usw.

Wenn ich nun im Suchfeld eingebe 015 zeigt er 2 Produktnummern nämlich 01524 und 34015.

Gibt es eine Möglichkeit das er mir von links nch rechts gemäss der Eingabe sucht und nicht dazwischen?

Hab da was im Internet gefunden wo geschrieben steht das es mit
matchContains:1, gehe.
Nur ob ich die Zeile drinstehen hab oder nicht, es wird genau gleich wie vorher angezeigt.

Gruss Andreas
 
Zuletzt bearbeitet:
Ja gibt es
Javascript: 
$( "#tags" ).autocomplete({
  source: function( request, response ) {
    var matches = $.map( availableTags, function(tag) {
      if ( tag.toUpperCase().indexOf(request.term.toUpperCase()) === 0 ) {
        return tag;
      }
    });
    response(matches);
  }
});
 
Hi.

Bin nun schon ein ganzes Stück weiter...
Nachdem es mit der Array Abfrage klappte hab ich mit einer 2ten PHP-Seite versucht die Daten dort aus der DB auszulesen und alles in der PHP-Seite per Echo auszugeben.

jQuery hat dann diese PHP-Seite ausgelesen und dememtsprechend die Anzeige generiert.
Auch das hat funktioniert, war aber viel zu langsam für etwa 40'000 Artikel.

Ok. Dann muss woll AJAX her.
Dazu hab ich eine neue Hauptseite erstellt, mit Text aus einem Tutorial.
Dazu gibt es eine autocomplete.php die die Abfrage in der DB macht und per json die daten wieder zurück an die Hauptseite übergibt.

Nun ist mein problem das in der php-Datei eine json-php-funktion aufgerufen wird.

Code: 
$ziparray = json_encode($ziplist);

Und wir haben immer noch PHP 4.xx
Diese Funktion wird aber erst ab PHP 5 unterstützt.
Ich kann die PHP-Version nicht updaten, das heisst ich muss mit Vers. 4 leben.

Wie kann ich per Ajak eine schnelle Abfrage generieren ohne das ich die json-Befehle aus PHP benutzen muss?

Gruss Andreas
 
Google mal ein bisschen, dann findest du Funktionen, die json_encode unter PHP 4.x erlauben bzw. dir die Funktion geben.
 
SO.. wieder etwas weiter.

Nun habe ich 2 Grundlegende Fragen zu meinem Code.

Code: 
</style>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.19.custom.min.js"></script>
<script type="text/javascript">

	$("#zipcode").autocomplete({
		source: function( request, response ) {				
			$j.ajax({
				url: "autocomplete.php",
				dataType: "json",
				data: {						
					limit: 12,
					data: request.term
				},
				success: function( data ) {
					response( $j.map( data, function( item ) {
						return {
							label: item.postal_code + ", " + item.place_name,
							value: item.postal_code,					
							myid: item.id_zipcode,							
							bezirk: item.place_name							
						}
					}));
				}
			});
		},
		minLength: 2,
		select: function( event, ui ) {								
			$j('#zipcode_id').val(ui.item.myid);														
			$j('#bezirk').html(ui.item.bezirk);														
 
		},
		open: function() {
			$j( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
		},
		close: function() {
			$j( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
			$j( this ).removeClass( "ui-autocomplete-loading" );
 
		}
	});
</script>
</header>
<body>
<input id="zipcode" type="text" name="zipcode" value="" />
<div id="bezirk"></div>
<input id="zipcode_id" type="hidden" name="zipcode_id" value="" />
</body>
</html>

Was ich bin jetzt verstanden habe:
data = Mein Eintrag im Textfeld wird zusammen mit limit an autocomplete.php übergeben.
autocomplete.php gibt folgendesn json-Array zurück.
Code: 
[ '00026003 ', '0002600 ', '0002300 ', '0002000 ', '000640 ' ]
Wie kann ich im jquery überprüfen ob auch das Array übertragen wurde?
Und wie musss ich den "return" richtig schreiben das die einzelnen Nr. ausgegeben werden.
Ich weiss das der return noch falsch ist. Blicke aber da einfach nicht durch.
Code: 
return {
							label: item.postal_code + ", " + item.place_name,
							value: item.postal_code,					
							myid: item.id_zipcode,							
							bezirk: item.place_name
die zuweisung oder ausgabe (select) meinte ich zu verstehen.
Wäre echt froh um Hilfe.

Gruss Andreas
 
Zuletzt bearbeitet:
Sind die beiden jQuerys die eingebunden werden die richtigen?
Funktioniert es mit denen?

HTML: 
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.19.custom.min.js"></script>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück