Contrôles SelectionList et publications
Mise à jour : novembre 2007
La sélection d'éléments dans un contrôle mobile ASP.NET SelectionList ne génère pas de réponse du serveur. Le formulaire sur lequel le contrôle SelectionList apparaît doit être publié sur le serveur. L'opération est généralement effectuée via un contrôle Command. Lorsque le contrôle Command publie le formulaire sur le serveur, le contrôle SelectionList déclenche un événement SelectedIndexChanged. Votre application peut fournir une méthode pour la gestion de cet événement.
Pour répondre à une sélection, vous pouvez procéder différemment en ajoutant une prise en charge des périphériques capables de gérer du code JavaScript client (par exemple des navigateurs HTML). Pour ces périphériques, utilisez la procédure suivante :
Ajoutez un élément <DeviceSpecific> avec un filtre <Choice> dont la valeur est "supportsJavaScript".
Créez un modèle de contenu dans le choix contenant le contrôle ASP.NET DropDownList. Il s'agit du contrôle serveur ASP.NET non mobile.
Affectez à la propriété AutoPostBackdu contrôle DropDownList la valeur true.
Vous devez créer un filtre <DeviceSpecific> avec un modèle de contenu pour tous les autres périphériques qui ne prennent pas JavaScript en charge et qui utilisent le contrôle SelectionList.
L'exemple de code suivant présente cette technique :
<mobile:Panel id="Panel1" >
<mobile:DeviceSpecific id="DeviceSpecific1" >
<Choice Filter="supportsJavaScript">
<ContentTemplate>
<asp:DropDownList id="DropDownList1"
OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"
AutoPostBack="True">
<asp:ListItem Value="a">1</asp:ListItem>
<asp:ListItem Value="b">2</asp:ListItem>
<asp:ListItem Value="c">3</asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
</Choice>
<Choice>
<ContentTemplate>
<mobile:SelectionList id="SelectionList1"
OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
<Item Value="a" Text="1"/>
<Item Value="a" Text="2"/>
<Item Value="a" Text="3"/>
</mobile:SelectionList>
<mobile:Command text="Submit"/>
</ContentTemplate>
</Choice>
</mobile:DeviceSpecific>
</mobile:Panel>
Cet exemple requiert les paramètres suivants dans le fichier Web.config :
<configuration>
<system.web>
<deviceFilters>
<filter name="supportsJavaScript"
compare="javascript"
argument="true"/>
</deviceFilters>
</system.web>
</configuration>
Gestion des variations de demandes lors d'une publication sur plusieurs pages
Les contrôles SelectionList requièrent parfois une gestion supplémentaire dans le cas particulier d'une publication sur plusieurs pages. Prenons par exemple deux pages, Source.aspx et Destination.aspx, où Source.aspx contient un contrôle SelectionList et publie sur Destination.aspx.
L'exemple suivant illustre le balisage de la page Source.aspx :
<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="C#" %>
<mobile:Form method="post" action="destination.aspx">
<mobile:SelectionList
selectType="MultiSelectListBox" id="MultiSelectList1">
<item text="I" value="1" />
<item text="ii" value="2" />
<item text="iii" value="3" />
</mobile:SelectionList>
<mobile:command runat=server text="Post" />
</mobile:Form>
L'exemple suivant illustre le balisage et le code pour la page Destination.aspx :
<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="C#" %>
<%@ Register TagPrefix="Mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>
<script runat=server language=cs>
public void Page_Load()
{
Label1.Text = Request["MultiSelectList1"];
}
</script>
<mobile:form runat=server>
<mobile:label id="Label1" />
</mobile:form>
Supposons que l'utilisateur affiche Source.aspx, qu'il sélectionne les premier et troisième éléments dans la zone de liste et qu'il clique sur le bouton de commande, ce qui déclenche la publication de la page sur Destination.aspx. Le texte affiché pour Label1 dans Destination.aspx varie en fonction du langage de balisage et du périphérique. Ces variations sont dues aux spécifications HTML et WML, ainsi qu'aux différences d'implémentation des navigateurs. Vous pouvez obtenir les résultats suivants :
Cible |
Résultat |
Description |
|---|---|---|
Navigateur HTML |
"1, 3" |
Délimitation par des virgules et des espaces sans délimiteur de fin. |
Périphérique WML 1 |
"1;3" |
Délimitation par des points-virgules sans délimiteur de fin. |
Périphérique WML 2 |
"1;3;" |
Délimitation par des points-virgules avec un délimiteur de fin. |
Pour utiliser plus facilement la valeur de la variable Request["MultiSelectList1"] dans la page de destination, vous pouvez prétraiter les données publiées à partir de la liste de sélection, comme indiqué dans l'exemple suivant. Cela permet de normaliser les diverses possibilités et de correspondre au format utilisé par le navigateur HTML.
public void Page_Load()
{
String selections = Request["MultiSelectList1"];
if (selections.Length > 0 &&
selections [selections.Length - 1] == ';')
{
selections = selections.Substring(0, selections.Length - 1);
}
Label1.Text = selections.Replace(";", ", ");
}
.gif "Remarque") Remarque : |
|---|
Cette gestion particulière n'est pas nécessaire dans le cas plus courant d'une publication sur la même page que celle qui contient le contrôle SelectionList. |
Certains périphériques cHTML requièrent des noms uniques pour toutes les cases à cocher. Dans ce cas, le nom généré pour la case à cocher se présente sous la forme identificateur*numéro d'élément pour chaque case à cocher. Vous pouvez utiliser un code semblable à l'exemple ci-dessous lorsque vous devez effectuer une publication sur plusieurs pages. Dans l'exemple, MyPage1.aspx contient le Web Form mobile suivant et un contrôle SelectionList.
<mobile:form runat=server action=MyPage2.aspx>
<mobile:selectionList id="mySList ...>
...
</mobile:form>
MyPage2.aspx a le code suivant :
<script >
// Create a Form just for the list selections
System.Collections.Specialized.NameValueCollection _myForm =
new NameValueCollection();
public void Page_Init()
{
// Process the Form
foreach(String key in Request.Form.Keys)
{
// Look for an asterisk in the key
int pos = key.LastIndexOf('*');
if (pos > -1)
{
// Add the modified key to the Form
_myForm.Add(key.Substring(0, pos), Request.Form[key])
}
Else
{
// Or add the unmodified key to the Form
_myForm.Add(key, Request.Form[key]);
}
}
}
// Use _myForm in place of Request.Form
public void Page_Load()
{
// Get the processed list of selected items
String selectedValues = _myForm["mySList"];
// etc.
}
</script>