Ne pas recharger page

Version imprimable

04/02/2011, 17h46
hugo7

Ne pas recharger page

Bonjour j'ai 3 div et 3 boutons, chaque clic sur un bouton affiche le div correspondant, c'est dire le bouton 1 affiche le div1 , le bouton 2 le div 2 et le bouton 3 le div 3.
Je voudrais le faire mais sans que la page se recharge à chaque fois
D'avance merci
04/02/2011, 19h04
Nicolas Esprit

Bonjour,

Une fonction javascript de base fera l'affaire. Tu fais un appel à cette méthode via l'event click côté client de tes boutons. Et tu passes en paramètre le nom de la div à cache/afficher. Après tu joues sur la visibilité de l'élement div.

Une simple recherche google tous les exemples dont tu as besoin.

En espérant t'avoir aidé.
05/02/2011, 12h27
hugo7

Réponse

Merci pour la réponse mais je n'ai pas trouvé ce que je cherchais...

Code:

1 2 3 4 5 6 7 8 9 10 11 12 <script language="javascript" type="text/javascript"> function show(id) { document.getElementById(id).style.display = "block" // fonction qui affiche un élément par son id } //fonction qui permet de cacher un élément par son id function hide(id) { document.getElementById(id).style.display = "none"; } </script>
Tu appelle la fonction hide(id) sur le onload de ton body avec en paramêtre l'id de ta div à cacher

puis sur le onclick de ton bouton tu appelle la fonction show(id) avec toujours en paramêtre l'id de la div que tu veux afficher.

07/02/2011, 19h00
hugo7

réponse

Merci pour la réponse mais je n'ai pas de onload pour mon body
j'ai load , unload et preload
et pareil pour les boutons j'ai juste click.
D'avance merci.
08/02/2011, 08h52
papouuu

Bien sûr que tu as un onload et onclick. entre les directement dans tes balises même si l'intellisens ne te les propose pas et teste

[EDIT] (essayes avec onClientclick)
08/02/2011, 16h19
hugo7

réponse
Bonjour j'ai essayer le onLoad pour mon body
Code vb.net
Code:

1 2 3 Protected Sub body_OnLoad(ByVal sender As Object, ByVal e As System.EventArgs) Handles body.OnLoad End Sub
Code asp.net

Code:

<body id="body" runat="server">

Mais j'ai cette erreur :

Citation:

'System.Web.UI.Control.Protected Friend Overridable Sub OnLoad(e As System.EventArgs)' n'est pas accessible dans ce contexte, car il est 'Protected Friend'.

Deuxiement je ne sais pas appeler la fonction , show par exemple dans le code vb.net ... :aie:

D'avance merci

8O8O8O

Bon alors reprenons le début.
Tu as dis vouloir utiliser du Javascript uniquement donc dans ta balise <head> tu mets ton code JavaScript et dans le onload de ton body apelle la fonction que tu veux
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 [...] <head> <script language="javascript" type="text/javascript"> function show(id) { document.getElementById(id).style.display = "block" // fonction qui affiche un élément par son id } //fonction qui permet de cacher un élément par son id function hide(id) { document.getElementById(id).style.display = "none"; } </script> [...] </head> <body onload="hide('idDeTaDiv')"> [...] </body>
voila ce que tu dois avoir dans ta page. tu n'as pas besoin d'entrer dans le code behind

tu fais la même chose dans ton boutton avec

Code:

onClientClick="Show('idDeTaDiv')"

08/02/2011, 16h57
hugo7

réponse

Merci pour la réponse mais je n'y arrive toujours pas , voila mon code asp.net

Code:

<body id="body" onload="hide ('divprincipal')" runat="server">

Code:

<asp:ImageButton ID="accueil2" onClientClick="Show ('divsecondaire')" ImageUrl="~/images/accueil2vide.jpg" class="accueil2" runat="server" />

:cry:

D'avance merci.
08/02/2011, 17h03
jbrasselet

Peux-tu poster tout le code de ta page aspx ?
Quelle est ton erreur exacte ?

réponse

A oui j'ai oublié de mettre l'erreur , en faite c'est une erreur de compilation :

Citation:

C:\Documents and Settings\Travail(hugo)\Mes documents\Visual Studio 2008\WebSites\site\accueil.aspx(22) : error BC30456: 'hide' n'est pas un membre de 'ASP.accueil_aspx'.

AddHandler __ctrl.Load, AddressOf Me.hide ('divsecondaire')

C:\Documents and Settings\Travail(hugo)\Mes documents\Visual Studio 2008\WebSites\site\accueil.aspx(22) : error BC30201: Expression attendue.

AddHandler __ctrl.Load, AddressOf Me.hide ('divsecondaire')

Il me souligne le Me.hide
et la première parenthèse de
Me.hide ('divsecondaire')

Et ma page asp.net
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 <%@ Page Language="VB" AutoEventWireup="false" CodeFile="accueil.aspx.vb" Inherits="accueil" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Accueil</title> <link href="mozillafirefox.css" rel="stylesheet" type="text/css" /> <script language="javascript" type="text/javascript"> function show(id) { document.getElementById(id).style.display = "block" // fonction qui affiche un élément par son id } //fonction qui permet de cacher un élément par son id function hide(id) { document.getElementById(id).style.display = "none"; } </script> </head> <body id="body" onload="hide ('divsecondaire')" runat="server"> <form id="form1" runat="server"> <div runat="server" id="divprincipal"> <asp:ImageButton ID="accueil2" onClientClick="show ('divsecondaire')" ImageUrl="~/images/accueil2vide.jpg" class="accueil2" runat="server" /> </div> <div runat="server" id="secondaire"> </div>

08/02/2011, 17h36
jbrasselet

Enlève le runat="server" sur ta balise body car tu utilises une balise HTML et non ASP.Net avec du javascript
08/02/2011, 18h19
hugo7

réponse

Je n'ai plus d'erreur la page se charge mais quand je clic sur mon imagebutton rien ne se passe et la page se recharge ...

Hello

Citation:

function show(id) {

document.getElementById(id).style.display = "block" // fonction qui affiche un élément par son id
}

Si tu veux du 'tout javascript', tu peux faire un truc comme ca:
dans le head

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<script language="javascript">
var tabDiv=new Array();
tabDiv[tabDiv.length]="Div1";
tabDiv[tabDiv.length]="Div2";
tabDiv[tabDiv.length]="Div3";
 
function show(DivToShow)
{
    for(var dvID in tabDiv)
    {
        var Div=document.getElementById(tabDiv[dvID]);
        Div.style.display=(Div.id==DivToShow?'block':'none');
     }
}
</script>

et dans le body

Code:

1
2
3
4
5
6
7
8
 
<div style="display:none" id="Div1">blabla1</div>
<div style="display:none" id="Div2">blabla2</div>
<div style="display:none" id="Div3">blabla3</div>
 
<input type="button" value="show1" onclick="show('Div1')"/>
<input type="button" value="show2" onclick="show('Div2')"/>
<input type="button" value="show3" onclick="show('Div3')"/>

bye
Nico

08/02/2011, 20h33
Nicopilami

Citation:

Envoyé par hugo7

Je n'ai plus d'erreur la page se charge mais quand je clic sur mon imagebutton rien ne se passe et la page se recharge ...

normal, car l'evenement serveur se produit apres le OnClientClick
Pour eviter cela, tu dois interrompre cet evenement; Il faut alors rajouter un return false; Essaie ca:

Code:

<asp:ImageButton ID="accueil2" onClientClick="show('divsecondaire');return false;" ImageUrl="~/images/accueil2vide.jpg" class="accueil2" runat="server" />

bye
Nico
10/02/2011, 18h02
hugo7

réponse

Merci pour les réponse nico mais sa ne marche toujours pas ...
J'ai rajouter un return false mais rien ne change la page se recharge toujours et le div affiché en premier reste le même , il n'affiche pas l'autre .
J'ai essayer l'autre méthode mais quand je rajoute le style="display:none" au div il disparait et quand je rajoute value="show1" onclick="show('Div1')" à mon image button apres avoir enlever le runat=server toute la mise en page du div par n'importe comment et le div se retrouve à l'extrême droite de ma page 8O .
Que faire ...
D'avance merci
10/02/2011, 22h32
Nicopilami

Citation:

Envoyé par hugo7

Merci pour les réponse nico mais sa ne marche toujours pas ...
J'ai rajouter un return false mais rien ne change la page se recharge toujours et le div affiché en premier reste le même , il n'affiche pas l'autre .
J'ai essayer l'autre méthode mais quand je rajoute le style="display:none" au div il disparait et quand je rajoute value="show1" onclick="show('Div1')" à mon image button apres avoir enlever le runat=server toute la mise en page du div par n'importe comment et le div se retrouve à l'extrême droite de ma page 8O .
Que faire ...
D'avance merci

et question bête, pourquoi ne mettrais tu pas des

Code:

<span onclick="show('Divx')"><img...></span>

plutôt qu'un linkbutton ? au moins là pas de postback :)
11/02/2011, 11h41
tortuegenie

Pourtant en rajoutant simplement un updatePanel ajax il me semble que le probleme serait résolu depuis longtemps
12/02/2011, 12h21
hugo7

réponse

Merci sa marche :ccool: , juste un dernier petit truc comment faire pour par exemple que après 10 seconde que le premier div est chargé le 2eme s'affiche , qu'il y est simulation de clic sur le span?
D'avance merci
14/02/2011, 08h32
jbrasselet

Tu dois pouvoir éventuellement utilisé un sap:timer et un asp:AsyncPostBackTrigger.