Probleme mit Jquery-Autocomplete im IE

Dear visitor, welcome to Coder Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

KMD

Intermediate

Posts: 135

Friday, March 6th 2009, 11:48am

Probleme mit Jquery-Autocomplete im IE

Hallo Leute,

ich würde gerne den JQuery Autocompleter benutzen der hier im Wiki beschrieben ist: http://www.coder-wiki.de/HowTos/Ajax-Autocomplete-jQuery
Funktioniert eigentlich ganz gut ... wenn da mal nicht wieder der IE wäre! :cursing:

Habe folgende Formularfelder die ich mit JQuery vervollständigen möchte:
Land
Region 1
Region 2
Region 3
Region 4
Stadt

das seltsame ist nur, dass es bei den Feldern Region 1-4 funktioniert und bei Land und Stadt nicht.
Bei Land und Stadt (im IE 6+7) blinken die Ergebnisse ganz kurz auf und verschwinden dann wieder.
Die Ausgabe der Regionen machen keine Probleme. Im FF funktioniert übrigens alles Bestens.
Habe nun schon einige Stunden gegooglet und mein Code mehrfach geprüft - alles ohne Ergebnisse!
Kann mir bitte einer von euch weiter helfen?

Hier mein Quellcode:

HTML Code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Neues Land erstellen</title>
<script type="text/javascript" src="../script/jquery/jquery.js"></script>
<script type="text/javascript" src="../script/jquery/jquery.autocomplete.js"></script>
<style type="text/css">
.ac_results {
	padding: 0px;
	border: 1px solid WindowFrame;
	background-color: Window;
	overflow: hidden;
}
 
.ac_results ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
}
 
.ac_results iframe {
	display:none;/*sorry for IE5*/
	display/**/:block;/*sorry for IE5*/
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	filter:mask();
	width:3000px;
	height:3000px;
}
 
.ac_results li {
	margin: 0px;
	padding: 2px 5px;
	cursor: pointer;
	display: block;
	width: 100%;
	font: menu;
	font-size: 12px;
	overflow: hidden;
}
 
.ac_loading {
	background : Window url('images/loading.gif') right center no-repeat;
}
 
.ac_over {
	background-color: Highlight;
	color: HighlightText;
}
</style>
 
<script type="text/javascript">
function selectItem(li)
{
	return false;
}
function formatItem(row)
{
	return row[0] + " <i>" + row[1] + "</i>";
}
$(document).ready(function(){
	$("#id_country").autocomplete("land-jquery.php?spalte=country&",{ 
		minChars:1
	});
});
$(document).ready(function(){
	$("#id_region1").autocomplete("land-jquery.php?spalte=region1&",{ 
		minChars:1
	});
});
$(document).ready(function(){
	$("#id_region2").autocomplete("land-jquery.php?spalte=region2&",{ 
		minChars:1
	});
});
$(document).ready(function(){
	$("#id_region3").autocomplete("land-jquery.php?spalte=region3&",{ 
		minChars:1
	});
});
$(document).ready(function(){
	$("#id_region4").autocomplete("land-jquery.php?spalte=region4&",{ 
		minChars:1
	});
});
$(document).ready(function(){
	$("#id_city").autocomplete("land-jquery.php?spalte=city&",{ 
		minChars:1
	});
});
</script>
 
</head>
<body>
	<form method="post" action="">
		<table border="0" cellspacing="2" cellpadding="2">
			<tr>
				<td align="right">Land*:</td>
				<td><input id="id_country" type="text" name="country"<?php if(isset($error_country)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>zB. Deutschland </td>
			</tr>
			<tr>
				<td align="right">Region 1*:</td>
				<td><input type="text" name="region1" id="id_region1"<?php if(isset($error_region1)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>zB. Bayern </td>
			</tr>
			<tr>
				<td align="right">Region 2:</td>
				<td><input type="text" name="region2" id="id_region2"<?php if(isset($error_region2)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>zB. Niederbayern </td>
			</tr>
			<tr>
				<td align="right">Region 3:</td>
				<td><input type="text" name="region3" id="id_region3"<?php if(isset($error_region3)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>zB. Straubing </td>
			</tr>
			<tr>
				<td align="right">Region 4:</td>
				<td><input type="text" name="region4" id="id_region4"<?php if(isset($error_region4)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>&nbsp;</td>
			</tr>
			<tr>
				<td align="right">PLZ*:</td>
				<td><input type="text" name="zip" id="id_zip"<?php if(isset($error_zip)) { echo " class=\"textfeldererror\""; } ?> style="width:150px;" /></td>
			    <td>&nbsp;</td>
			</tr>
			<tr>
				<td align="right">Stadt*:</td>
				<td><input type="text" name="city" id="id_city"<?php if(isset($error_city)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>zB. Mariaposching </td>
			</tr>
			<tr>
				<td align="right">Gebiet:</td>
				<td><input type="text" name="area" id="id_area"<?php if(isset($error_area)) { echo " class=\"textfeldererror\""; } ?> style="width:350px;" /></td>
			    <td>&nbsp;</td>
			</tr>
			<tr>
				<td align="right">Lat*:</td>
				<td><input type="text" name="lat" id="id_lat"<?php if(isset($error_koordinaten)) { echo " class=\"textfeldererror\""; } ?> style="width:150px;" /></td>
			    <td>&nbsp;</td>
			</tr>
			<tr>
				<td align="right">Lng*:</td>
				<td><input type="text" name="lng" id="id_lng"<?php if(isset($error_koordinaten)) { echo " class=\"textfeldererror\""; } ?> style="width:150px;" /></td>
			    <td>&nbsp;</td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<td><input type="submit" name="Submit" value="Speichern" /><input name="action" type="hidden" value="1" /></td>
			    <td>&nbsp;</td>
			</tr>
		</table>
	</form>
</body>
</html>

ach ja, ein beispiel findet ihr hier: http://www.kmd-test.de/fewo/admin/test.php

Grüße KMD

This post has been edited 1 times, last edit by "KMD" (Mar 6th 2009, 12:05pm)

vince

Master

Posts: 1,105

Friday, March 6th 2009, 2:42pm

Probier mal nur einmal Document Ready zu nutzen.
Vielleicht kommt der IE damit sonst nicht klar.

JavaScript Code

<script type="text/javascript">
function selectItem(li)
{
	return false;
}
function formatItem(row)
{
	return row[0] + " <i>" + row[1] + "</i>";
}
 
$(document).ready(function(){
	$("#id_country").autocomplete("land-jquery.php?spalte=country&",{ 
		minChars:1
	});
	$("#id_region1").autocomplete("land-jquery.php?spalte=region1&",{ 
		minChars:1
	});
	$("#id_region2").autocomplete("land-jquery.php?spalte=region2&",{ 
		minChars:1
	});
	$("#id_region3").autocomplete("land-jquery.php?spalte=region3&",{ 
		minChars:1
	});
	$("#id_region4").autocomplete("land-jquery.php?spalte=region4&",{ 
		minChars:1
	});
	$("#id_city").autocomplete("land-jquery.php?spalte=city&",{ 
		minChars:1
	});
});
</script>

KMD

Intermediate

Posts: 135

Friday, March 6th 2009, 2:57pm

Hi vince,

danke für deine Antwort, hat aber leider nicht geholfen! Ich verzweifle bald...

Torben Brodt

Administrator

Posts: 8,454

Sunday, March 8th 2009, 1:16pm

Der Wiki Beitrag ist inzwischen leider etwas veraltet. Ich muss ihn unbedingt mal aktualisieren.
Hast du mal die Version von jQuery UI probiert?

Beispiel und Code hier: http://docs.jquery.com/UI/Autocomplete