Hello,
100% d'accord avec toi sur ta remarque! Lorsque j'ai poste ma reponse toute subtile qu'elle puisse etre, j'ai enchaine sur la redaction d'un MP a ton adresse, puis j'ai laisse tomber pour x raisons (la premiere etant que j'ai des prob de compatibilite entre browsers)...
Soit, je mets donc le code en entier. C'est sur XMLHTTPREQUEST et ne fonctionne pas forcement chez tout le monde (pour des raisons qui m'echappent encore):
<html>
<head>
<title>prout</title>
<style type="text/css">
div.prop {
height: auto;
width: 150px;
overflow: auto;
border: 1px solid #666;
background-color: #ccc;
padding: 8px;
font-size: 10px;
font-family:verdana;
font-weight: bold;
visibility:hidden;
}
</style>
<script type="text/javascript">
var isWorking = false;
function getHTTPObject() {
var xmlhttp;
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
try {
xmlhttp = new XMLHttpRequest();
xmlhttp.overrideMimeType("text/xml");
} catch (e) {
xmlhttp = false;
}
}
return xmlhttp;
}
var http = getHTTPObject();
function treatquery(){
if (!isWorking && http) {
ch = document.send.abr.value;
if (ch.length>2){
http.open("GET", "treatment.php?abr=" + escape(ch), true);
http.onreadystatechange = handleHttpResponse;
isWorking = true;
http.send(null);
}
if ((ch.length<3) && (document.getElementById('res').style.visibility == "visible"))
document.getElementById('res').style.visibility = "hidden";
}
}
function handleHttpResponse() { // traitement de la demande
if (http.readyState == 4) {
if (http.responseText.indexOf('invalid') == -1) {
var xmlDocument = http.responseXML;
var res = xmlDocument.getElementsByTagName('name').item(0).firstChild.data;
var elements = res.split(";");
var result = "<font color=\"darkblue\">Do you mean...</font><br />";
for (var i=0;i<elements.length;i++){
result = result + "<a style=\"text-decoration:none;color:red;\" href=\"javascript:setQuery('" + elements[i] + "');\">" + elements[i] + "</a><br />";
}
document.getElementById('res').style.visibility = "visible";
document.getElementById('res').innerHTML = result;
isWorking = false;
}
}
}
function setQuery(ch){
document.getElementById('abr').value = ch;
}
</script>
</head>
<body>
<form name="send" style="display:inline; position: relative;">
<div style="display:inline; position: relative;">
<input type="text" id="abr" style="width: 150px;font-family:verdana; font-size:8pt;color:darkblue;" onkeyup="treatquery();" />
<input type="submit" value="verify">
<div id="res" style="position: absolute; top: 22px; left: 0px;background-color:white;" class="prop">
</div>
</div>
</form>
</body>
</html>
Voila. Pour faire tourner un exemple, il faut remplacer par exemple la partie
for (var i=0;i<elements.length;i++){
result = result + "<a style=\"text-decoration:none;color:red;\" href=\"javascript:setQuery('" + elements[i] + "');\">" + elements[i] + "</a><br />";
}
par result = "<?xml version=\"1.0\" standalone=\"yes\" ><result><name>a;b;c;d<name></result>";
La, j'ai tout mis! Et mon but, bien sur, est toujours le meme: avoir le div des resultat visible que quand je me balade dessus ou, pourquoi pas, qu'il disparaisse uniquement si je clique en dehors de sa zone.
hehe...
Merci d'avance, Malik7934