Utilisation de Javascript pour détecter lorsqu'un utilisateur a sélectionné un élément dans une liste déroulante ASP.NET

Question

Je développe une application Web ASP.NET incorporant google maps. J'ai une liste ASP.NET sur ma page qui contient une liste d'éléments. Lorsque l'utilisateur sélectionne l'un des éléments, je souhaite afficher cet élément sur la carte. La principale complication réside dans le fait que google maps utilise javascript pour le contrôler et que la listbox est un contrôle serveur.

Je peux penser à deux façons de le faire. La première impliquerait la listbox appelant une fonction javascript lorsque l'utilisateur sélectionne un nouvel élément. Je peux alors écrire cette fonction pour effectuer les opérations cartographiques nécessaires. Malheureusement, la propriété OnSelectedIndexChanged de la zone de liste ne semble pas prendre en charge les fonctions javascript.

La seconde consiste à entourer un UpdatePanel autour de la zone de liste et à obtenir la boîte de liste pour effectuer une publication. Dans l'événement SelectedIndexChanged dans VB/C#, je voudrais le besoin de faire un appel à une fonction javascript qui mettrait alors à jour la carte.

Quelle solution puis-je utiliser?

Merci

--Amr

Answer 1

Dans votre behind (dans votre pageload) il suffit d'ajouter un gestionnaire javascript à l'attribut OnChange qui pointe vers votre fonction javascript. Par exemple:

lbYourListBox.Attributes.Add("onChange", "UpdateYourMap();"); 

Vous pouvez également ajouter à votre commande en utilisant javascript et en ligne, mais je préfère le faire dans le codebehind afin que le cadre peut gérer correspondre les noms.

Answer 2

vous pouvez simplement javascript intégrer dans votre page, avoidig compter sur ASP avec elle. Mettez le code dans votre corps de document:

<script language="javascript"> 
body.onload=function(){ 
    var lb=document.getElementById("yourlistboxid"); 
    lb.onChange = function(){ 
     // put your handling code here 
    } 
} 
</script> 

Answer 3

à la démo l'autre approche, voici un guide sommaire:

void listbox_SelectedIndexChanged(...) { 

    string js = string.Format("callToMapsFunction({0});", listbox.SelectedValue); 
    string scriptKey = "mapscript"; 

    ScriptManager.RegisterStartupScript(listbox, typeof(ListBox), scriptKey 
     , js, true); 
} 

RegisterStartupScript fonctionne quel que soit le javascript que vous donnez après la postback partielle terminée. vous n'avez pas nécessairement à passer la valeur de la liste - juste les données que vous voulez fournir à l'API de la carte. les 3 premiers éléments sont pour empêcher le script d'enregistrer un tas de fois (autant que je sache). le vrai à la fin dit au scriptmanager d'ajouter automagiquement des balises d'ouverture et de fermeture autour de votre code js.