ajaxToolkit:ModalPopupExtender et asp:ListBox

Version imprimable

Bonjour à tous,

Je debute avec ajaxToolkit.
Pour ma page, j'ai pris exemple du ModalPopupExtender avec le source fournit de "AjaxControlToolkit".

J'essaye de l'adapter a mon besoin et de mettre une ListBox dans le panel. Mais je n'arrive pas a recupere la valeur et la mettre dans un champ.

Voila ce que j'ai pour le moment:
Code:

1 2 3 <asp:TextBox ID="TxtSite" runat="server" Width="176px"></asp:TextBox> <asp:ImageButton ID="BtFindSite" runat="server" Width="16px" Height="16px" ImageUrl="~/style/images/loupe.gif" />
Puis plus loin dans ma page:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 <asp:Panel ID="PanelSite" runat="server" Style="display: none" CssClass="modalPopup" Width="248px"> <asp:Panel ID="PanelSiteDetail" runat="server" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black"> <div><p> Selectionnez le site : </p></div> </asp:Panel> <asp:ListBox ID="ListSite" runat="server" Width="224px" OnSelectedIndexChanged="javascript:ValeurSelect = this.value ;"></asp:ListBox><div> <p>  <asp:Button ID="OkButtonSite" runat="server" Text="OK" /> <asp:Button ID="CancelButtonSite" runat="server" Text="Cancel" /> </p> </div> </asp:Panel> <ajaxToolkit:ModalPopupExtender ID="ModalPopupSite" runat="server" TargetControlID="BtFindSite" PopupControlID="PanelSite" BackgroundCssClass="modalBackground" OkControlID="OkButtonSite" OnOkScript="onOkSite()" CancelControlID="CancelButtonSite" DropShadow="true" PopupDragHandleControlID="PanelSiteDetail" />
Dans cette parti, j'ai essayé de mettre la valeur selectionné dans un variable globale et de recuperer cette variable dans la function javascript "onOkSite()"
Mais le compilateur me dit : javascript n'est pas un membre de ma page au niveau de OnSelectedChanged. Je pense avoir compris pourquoi.
Mais comment appeler une function javascrpt a ce niveau ?

J'ai essaye de faire un "document.getElementById" sur mon objet List sans succes.

Je cherche une piste ?
J'aimerai savoir s'il faut que je fasse un Panel / ModalPopupExtender pour chaque champs de ma page ? ou puis-je charger une liste differente sur chaque champs.

Je sais il y a beaucoup de questions:calim2:, je cherche des pistes.
Merci d'avance.

re bonjour à tous,

Alors voila apres plusieurs recherches et tests, j'en suis là :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
  <form id="form1" runat="server">
        <ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1" />
 
        <asp:Label runat="server" ID="lelabel" />
 
        <br />
 
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:Button ID="Button1" runat="server" Text="Button"/>
 
        <asp:Panel ID="pnlModalPopUpPanel" runat="server" CssClass="modalPopup">
         <div><asp:Label runat="server" ID="LblTitre"  Text="Choix du site " /></div> 
        <br />
        <asp:UpdatePanel id="UpdatePanel2" runat="server" UpdateMode="Conditional">
          <ContentTemplate>
            <asp:DropDownList id="lstSite" runat="server" >
                        <asp:ListItem Value="1" Text ="choix 1" />
                        <asp:ListItem Value="2" Text ="choix 2" />
                        <asp:ListItem Value="3" Text ="choix 3" />
                        <asp:ListItem Value="4" Text ="choix 4" />
                        <asp:ListItem Value="5" Text ="choix 5" />
            </asp:DropDownList>  
            <asp:Button id="OkButtonSite" runat="server" Text="OK" OnClick="OkButtonSite_Click"></asp:Button>
            <asp:Button id="CancelButtonSite" runat="server" Text="Cancel"></asp:Button> 
          </ContentTemplate>
        <Triggers>
           <asp:AsyncPostBackTrigger ControlID="OkButtonSite" EventName="Click"></asp:AsyncPostBackTrigger>
            <asp:AsyncPostBackTrigger ControlID="CancelButtonSite" EventName="Click"></asp:AsyncPostBackTrigger>
        </Triggers>
        </asp:UpdatePanel> 
       </asp:Panel> 
 
        <ajaxToolkit:ModalPopupExtender 
            ID="ModalPopupSite" runat="server" 
            TargetControlID="Button1" 
            PopupControlID="pnlModalPopUpPanel" 
            BackgroundCssClass="modalBackground" 
            DropShadow="true"
            /> 
    </form>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        lelabel.Text = DateTime.Now.ToString()
    End Sub
 
 
    Protected Sub OkButtonSite_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        Me.TextBox1.Text = Me.lstSite.SelectedValue
        Me.ModalPopupSite.Hide()
    End Sub
    Protected Sub CancelButtonSite_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        Me.ModalPopupSite.Hide()
    End Sub

Par contre, je ne comprends pas pourquoi le "TextBox1" ne prends pas la valeur.
Et comment faire pour fermer le modalpanel avec le bouton "CancelButtonSite".

merci d'avance.

15/06/2010, 17h11
Elwe31

Vous n'avez meme pas une petite piste ?:cry:

J'ai finis pas faire comme ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
<ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1" />
        <script type="text/javascript">
        var styleToSelect;
        function onOk() {
            if ($get('lstSite')) { 
               styleToSelect = $get('lstSite'); 
               $get('TxtInfo').value = styleToSelect.value
            }else{
               alert("Erreur");
            }
        }
    </script>
        <asp:TextBox ID="TxtInfo" runat="server" ></asp:TextBox>
        <asp:Button ID="Button1" runat="server" Text="Button" />
        <asp:Panel ID="Panel1" runat="server" Style="display: none" CssClass="modalPopup">
            <asp:Panel ID="Panel3" runat="server" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black">
                <div>
                    <p>Choose the paragraph style you would like:</p>
                </div>
            </asp:Panel>
                <div>
                     <asp:ListBox id="lstSite" runat="server" ></asp:ListBox>  
                </div>
                <div>
                     <asp:Button ID="OkButton" runat="server" Text="Ok" />
                     <asp:Button ID="CancelButton" runat="server" Text="Cancel" />
                </div>
        </asp:Panel>
        <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" 
            TargetControlID="Button1"
            PopupControlID="Panel1" 
            BackgroundCssClass="modalBackground" 
            OkControlID="OkButton"
            OnOkScript="onOk()" 
            CancelControlID="CancelButton" 
            DropShadow="true"
            PopupDragHandleControlID="Panel3" />

ça fonctionne impecc !!

Par contre, je vois pas comment je peux generaliser cette type de saisie simplement? ( pour tous les champs presentant un choix).
Et s'il est possible de chager la liste au moment ou l'utilisateur clique sur "Button1"
merci d'avance.