Bonjour , je vous explique mon problème. J'ai un formulaire avec une div caché, et qui s'affiche lors du déclenchement d'un événement. Dans cette div on y trouve une CheckBoxList et une DropDownList.
Le but étant de pouvoir rafraichir ma DIV et donc son contenu a chaque changement d'item de la DropDownList. Je crée donc dynamiquement les cases à cocher mais comment faire pour les supprimer ????
Voici un extrait du code de la page asp :
Voici la fonction js qui permet le rafraichissement via une page .aspx
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 <div id="formajout" runat="server" style="display:block"> <center><h3>Ajout d'un tiers</h3> <table style="width: 380px" border="0" cellpadding="0" cellspacing="0" id="TableP"> <tr> <td style="width: 100px; height: 25px" align="right" valign="middle">Liste des tiers: </td> <td align="left" style="width: 300px;" valign="middle"> <asp:DropDownList ID="CB_Tiers" onchange="RefreshForm(this.form,this.id,'TB_telephone','TB_fax','TB_email','CB_qualite')" runat="server" Width="208px"> </asp:DropDownList> </td> </tr> <tr> <td style="width: 80px; height: 36px" align="right" valign="middle">Qualité</td> <td style="width: 300px; height: 36px" align="left" valign="middle"> <asp:CheckBoxList ID="CB_qualite" runat="server" RepeatColumns="3" RepeatDirection="Horizontal" Width="208px"> <asp:ListItem Value="Test"></asp:ListItem> </asp:CheckBoxList></td> </tr> <tr> <td style="width: 80px; height: 36px" align="right" valign="middle">Téléphone</td> <td style="width: 300px; height: 36px" align="left" valign="middle"><asp:TextBox ID="TB_telephone" Enabled="false" runat="server" Width="205px"></asp:TextBox></td> </tr> <tr> <td style="width: 80px; height: 36px" align="right" valign="middle">Fax</td> <td style="width: 300px; height: 36px" align="left" valign="middle"><asp:TextBox ID="TB_fax" Enabled="false" runat="server" Width="205px"></asp:TextBox></td> </tr> <tr> <td style="width: 80px; height: 36px" align="right" valign="middle">Email</td> <td style="width: 300px; height: 36px" align="left" valign="middle"><asp:TextBox ID="TB_email" Enabled="false" runat="server" Width="280px"></asp:TextBox></td> </tr> <tr id="TrEspaceBouton"> <td colspan="3" style="height: 10px"></td> </tr> <tr> <td colspan="3" id="TrBouton" align="center"><button type="submit" onclick="javascript:Valider();" style="height: 30px" ><table cellpadding="0" cellspacing="0" style="cursor: hand"><tr><td><%--<img alt="Actualiser" src="img/actualiser.png" style="margin: 0px" />--%></td><td> Valider</td></tr></table></button></td> </tr> </table> </center></div>
Et enfin le code behind de la fameuse page qui permet le rafraichissement :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 function RefreshForm(f,MonId,IdMaj,IdMaj2,IdMaj3,IdMaj4) { // var index = document.getElementById("CB_Tiers").selectedIndex; var index = f.elements[MonId].selectedIndex; if(index >= 0) { var xhr_object = null; if(window.XMLHttpRequest) // Firefox xhr_object = new XMLHttpRequest(); else if(window.ActiveXObject) // Internet Explorer xhr_object = new ActiveXObject("Microsoft.XMLHTTP"); else { // XMLHttpRequest non supporté par le navigateur alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest... Mise à jour impossible."); return; } xhr_object.open("POST", "GestionMenuDeroulant.aspx?id=formulaire", true); xhr_object.onreadystatechange = function() { if(xhr_object.readyState == 4) eval(xhr_object.responseText); } xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded;charset=ISO-8859-1"); var data = "TB="+IdMaj+";"+IdMaj2+";"+IdMaj3+"&CB="+IdMaj4+"&tiers="+escape(f.elements[MonId].options[index].value); xhr_object.send(data); } }
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24 If Not (Request("id") Is Nothing) Then 'Response.Write("if (document.getElementById('" & Request("CB") & "').cells.length > 0) { for(var i=0;i<document.getElementById('" & Request("CB") & "').cells.length;i++) { document.getElementById('" & Request("CB") & "').cells.remove; } }") Response.Write("if (document.getElementById('" & Request("CB") & "').cells.length > 0) { document.getElementById('" & Request("CB") & "').cells.length = 0 }") Dim oCommand = New SqlCommand("select qualite, telephone1, fax, email from tiers where nom='" & Replace(Request("tiers"), "'", "''") & "' order by qualite", oC) Dim dr1 As SqlDataReader = oCommand.ExecuteReader() If dr1.HasRows Then Dim tabvalue() As String = Request("TB").Split(";") While dr1.Read() Response.Write("document.getElementById('" & tabvalue(0) & "').value =""" & dr1(1).ToString.Trim & """;") Response.Write("document.getElementById('" & tabvalue(1) & "').value =""" & dr1(2).ToString.Trim & """;") Response.Write("document.getElementById('" & tabvalue(2) & "').value =""" & dr1(3).ToString.Trim & """;") Dim tabQualite() As String = dr1(0).ToString.Trim.Split(";") If (tabQualite.Length > 1) Then For Each Qualite As String In tabQualite Response.Write("var option = document.createElement('input'); var label = document.createElement('label'); option.type='checkbox'; option.value=""" & Qualite & """; label.innerHTML=""" & Qualite & """; document.getElementById('" & Request("CB") & "').appendChild(option); document.getElementById('" & Request("CB") & "').appendChild(label);") Next Else Response.Write("var option = document.createElement('input'); var label = document.createElement('label'); option.type='checkbox'; option.value=""" & tabQualite(0) & """; label.innerHTML=""" & tabQualite(0) & """;document.getElementById('" & Request("CB") & "').appendChild(option); document.getElementById('" & Request("CB") & "').appendChild(label);") End If End While End If dr1.Close() end if
Partager