DropDownList éditable
cabbry
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
-
28 juin 2005 à 10:04
cabbry Messages postés 100 Date d'inscription mercredi 8 janvier 2003 Statut Membre Dernière intervention 27 janvier 2006 - 29 juin 2005 à 11:14
cabbry Messages postés 100 Date d'inscription mercredi 8 janvier 2003 Statut Membre Dernière intervention 27 janvier 2006 - 29 juin 2005 à 11:14
5 réponses
jesusonline
Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Membre
Dernière intervention
13 octobre 2010
29
28 juin 2005 à 11:56
28 juin 2005 à 11:56
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
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
cabbry
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
28 juin 2005 à 14:57
28 juin 2005 à 14:57
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
Par contre, j'ai trouvé du code javascript, je le posterai quand ça marchera !
Cab
cabbry
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
29 juin 2005 à 09:19
29 juin 2005 à 09:19
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
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
jesusonline
Messages postés
6814
Date d'inscription
dimanche 15 décembre 2002
Statut
Membre
Dernière intervention
13 octobre 2010
29
29 juin 2005 à 10:20
29 juin 2005 à 10:20
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
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
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
cabbry
Messages postés
100
Date d'inscription
mercredi 8 janvier 2003
Statut
Membre
Dernière intervention
27 janvier 2006
1
29 juin 2005 à 11:14
29 juin 2005 à 11:14
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...
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...