DropDownList éditable

Signaler
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
-
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
-
Bonjour,



est que quelqu'un a un exemple, de code, une adresse de dropdownlist editable ?



Une Dropdownlist, dans laquelle on peut écrire le début d'un mot est la liste ce met à jour...



Vous voyez ?



Merci



Cab

5 réponses

Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Modérateur
Dernière intervention
13 octobre 2010
28
Un truc comme ce qu'il y a pour la textbox de recherche en haut du site ? :p

c'est loin d'etre facile, il faut utiliser la technologie Ajax (http://www.aspfr.com/ajax.aspx) puis aprés faut bien comprendre comment tout ca fonctionne ... renseigne toi sur ajax et aussi un peu sur javascript aprés tu verras mieux le fonctionnement du truc:)


<HR>
Cyril - MCP ASP.net
Webmaster de : Hoshimi.CodeS-SourceS.fr
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
Ca a l'air d'être un truc de grand malade ton ajax...



Par contre, j'ai trouvé du code javascript, je le posterai quand ça marchera !



Cab
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
Voila,



le résultat est sympa



Dans le Head de la page aspx:




<script>

function
display_liste(calqt, calql) { // Affiche le calque de la liste

calql.style.visibility = 'visible';

calql.style.top = calqt.style.top;

calql.style.left = calqt.style.left;

}



function
hide_liste(calqt, calql) { // Affiche ou masque le calque de la
liste suivant son dernier état

if (calql.style.visibility == 'visible') {


calql.style.visibility = 'hidden';

}

else {

display_liste(calqt, calql);

}

}



function
display_down(keyc, listd, calqt, calql) { // Affiche la liste si
la touche "keyc" est pressée

if (event.keyCode==keyc) {

display_liste(calqt, calql);

}


if ((event.keyCode==40) &&
(event.keyCode==keyc)) {

listd.focus();

}

}



function
enter_list(textb, listd, calql) { // appelle getValue si la
touche "Enter" est pressée dans la liste

if (event.keyCode==13) {

getValue(textb, listd, calql);



parent.frames['droite'].location='./droite.php?NOM_POSTE='+listed.options[listed.selectedIndex].value;



parent.frames['gauche_stat'].location='./gauche_bas.php?NOM_POSTE='+listed.options[listed.selectedIndex].value;

}

}



function
liste_lostfocus(textb, listd, calql) { // Masque le calque si le texte
et la liste n'ont pas le focus


if ( (self.document.activeElement.name != textb)
&& (self.document.activeElement.name != listd) ) {


calql.style.visibility = 'hidden';

}

}



function
getValue(textb,listd, calql) { // Affecte la valeur
de la liste choisie dans la zone de texte

textb.value=listd.item(listd.selectedIndex).text;


//
textb.value=listd.item(listd.selectedIndex).value; si on veut la valeur
dans le code et pas dans la liste

calql.style.visibility = 'hidden';

textb.focus();

textb.select();

}



function list_size(liste) {

t=0;

for(i=0; i<liste.length; i++) {


if(liste.options[i].value.length
> t) {

t=liste.options[i].value.length;

}

}

list_size=t;

}



function text_exist(textb, listd) { // regarde si le début existe

if (textb.value != "") {


for (i=0; i<listd.length; i++)
{


if (textb.value.toLowerCase() ==
listd[i].text.substring(0, textb.value.length).toLowerCase()) {

return i;

}

else {


if
(listd[i].text > textb.value.substring(0, listd[i].text.length)) {

return -2;

}

}

}

}

return -1;

}



function
disp_exist(textb, listd, calqt, calql) { // regarde si existe et
affiche le calque de la liste

temp=text_exist(textb, listd);

if (temp != -1) {

display_liste(calqt, calql);

}

else {


calql.style.visibility = 'hidden';

}

return temp;

}



function
text_match(textb, listd) { // regarde si le texte existe en entier

if (textb.value != "") {


for (i=0; i<listd.length; i++)
{


if (textb.value.toLowerCase() ==
listd[i].text.toLowerCase()) {

return i;

}

}

}

return -1;

}

</script>



Ensuite dans le body de la même page:




























Ca fait un peu peur, vu comme ça, mais les styles prennent pas mal de place tout comme les évenements...



Dans le code behind, vous pouvez gérer l'événement OnSelectedIndexChanged de la ddl:



public void ddl_SelectedIndexChanged(object sender, System.EventArgs e)

{



}



Je crois que je n'ai rien oublié...





Cab
Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Modérateur
Dernière intervention
13 octobre 2010
28
j'ai pas tout lu le code, mais t'aurais pas un exemple en ligne ? t'as pas d'Ajax la ? :(

par contre j'ai vu a un endroit un __doPostBack(null,null);" utilise plutot __doPostBack(this.id, null)

et quand tu te sert de ca dans la page il faut etre sur qeu la fonction est ecrite dans la page, donc un me.page.registerpostback ou un truc du genre :p

en tout cas ca a l'air sympa :)


<HR>
Cyril - MCP ASP.net
Webmaster de : Hoshimi.CodeS-SourceS.fr
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
Le code dont je me suis inspiré est là:



http://javascriptfr.com/code.aspx?ID=20093



et non ça n'utilise pas d'Ajax, désolé...



Il reste des bugs, mais bon, le principal y est...