AJAX et les boutons. [Résolu]

Minority · 02/09/2007, 10h17

Bonjour,

je suis en train de faire un petit site pour une association sportive (dont je fais partie). Étant étudiant en informatique, et désirant faire quelque chose de bien (pour moi), je me suis dit : "Je le fais avec AJAX!".

L'idée est donc (je sais pas ce qu'elle vaut, à l'échelle de mon site) une page index.php, dont le header et les menu ne sont jamais recharger. Je n'effectue que des mises a jour sur le contenu de mon <div id="container">. Les cliques sur les éléments de mon menu appel des fonctions javascript qui envoies de requetes au serveur.

Le problème est le suivant : l'input en submit qui me renvoie a la page "index.php", avec le contenu de la page d'accueil.

Est-il possible lors d'un clique sur un <input type="submit">, de ne recharger que mon div container ? Je souhaiterais que lors d'un clique sur ce bouton, mon container contiennent soit le texte : "Votre inscription a été validé" ou bien "Erreur avec ...".

Si ce n'est pas possible, je peux procéder comme pour mon menu, a savoir :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a class="lien_qui_ressemble_a_un_bouton" href="#" onclick="fonction()">Inscription</a>

Mais bon, cela me parait plus propre de valider le formulaire par un submit, que de récupérer un par un chaque valeur de mes input... .

Anthony.Desvernois · 02/09/2007, 10h27

Bonjour et bienvenue au club,

traite ton formulaire comme d'habitude, il suffit juste que ta balise form contienne ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<form ... onSubmit='mafonction()'>

Bon courage à toi

TheDrev · 02/09/2007, 10h44

Salut !

J'ai vu dans plusieurs framework ajax, que les liens ne sont pas des balise <a> mais des <div> appelant une fonction js.

Par exemple, avec dojo :
http://dojotoolkit.org/book/dojo-boo...bo-checkbox-ra

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
 
                function create_button()
                {
                    var params = {
                        label: "Hi I am the Second one",
                        // Note here, when creating programmatically, this is a function, not a string
                        onClick: call_function
                    };
 
                    var button_dynamic = new dijit.form.Button(
                        params,dojo.byId("button-placeholder")
                    );
                }
       dojo.addOnLoad(create_button);
     </script>
</head>
<body class="tundra">
    <div id="button-placeholder"> </div>
</body>

Tu peut t'en inspirer, mais je te conseil d'utiliser un framework ou un autre...
Un dernier conseil : Différencie bien les contrôles (ex boutons, combobox) créer en javascript pour remplacer ceux de l'html et le transport Ajax pour le rafraichissement desynchronisé.

Minority · 02/09/2007, 11h04

Merci pour la rapidité de vos réponse !

@Anthony.Desvernois

La balise onSubmit, c'est celle ci que je cherchais ! Merci.

J'avais essayer naivement un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<form ... action="fonction()">

mais sans résultat (normal en même temps...).

@TheDrev

C'est vrai qu'un framework aiderait bien, mais étant donné mes objectifs pour ce site (relativement "simple")... . Le site étant bientôt opérationnel, je ne pense pas avoir recours a un framework, même si, en adopter un me serait sans doute utile pour la suite

.

Encore merci pour vos réponses les amis.

02/09/2007, 10h17	#1
Minority Invité régulier Étudiant Inscription : juillet 2007 Messages : 21 Détails du profil Informations personnelles : Localisation : France, Meurthe et Moselle (Lorraine) Informations professionnelles : Activité : Étudiant Informations forums : Inscription : juillet 2007 Messages : 21 Points : 8 Points : 8	AJAX et les boutons. Bonjour, je suis en train de faire un petit site pour une association sportive (dont je fais partie). Étant étudiant en informatique, et désirant faire quelque chose de bien (pour moi), je me suis dit : "Je le fais avec AJAX!". L'idée est donc (je sais pas ce qu'elle vaut, à l'échelle de mon site) une page index.php, dont le header et les menu ne sont jamais recharger. Je n'effectue que des mises a jour sur le contenu de mon <div id="container">. Les cliques sur les éléments de mon menu appel des fonctions javascript qui envoies de requetes au serveur. Le problème est le suivant : l'input en submit qui me renvoie a la page "index.php", avec le contenu de la page d'accueil. Est-il possible lors d'un clique sur un <input type="submit">, de ne recharger que mon div container ? Je souhaiterais que lors d'un clique sur ce bouton, mon container contiennent soit le texte : "Votre inscription a été validé" ou bien "Erreur avec ...". Si ce n'est pas possible, je peux procéder comme pour mon menu, a savoir : Code : Sélectionner tout - Visualiser dans une fenêtre à part <a class="lien_qui_ressemble_a_un_bouton" href="#" onclick="fonction()">Inscription</a> Mais bon, cela me parait plus propre de valider le formulaire par un submit, que de récupérer un par un chaque valeur de mes input... .
	00

02/09/2007, 10h27	#2
Anthony.Desvernois Membre Expert Anthony Desvernois Ingénieur sécurité & risque Inscription : juin 2007 Messages : 1 501 Détails du profil Informations personnelles : Nom : Anthony Desvernois Localisation : France, Paris (Île de France) Informations professionnelles : Activité : Ingénieur sécurité & risque Secteur : Finance Informations forums : Inscription : juin 2007 Messages : 1 501 Points : 2 011 Points : 2 011	Bonjour et bienvenue au club, traite ton formulaire comme d'habitude, il suffit juste que ta balise form contienne ceci : Code : Sélectionner tout - Visualiser dans une fenêtre à part <form ... onSubmit='mafonction()'> Bon courage à toi __________________ "Voyager, c'est découvrir que tout le monde a tort", Aldous Huxley "Less is more" Ludwig Mies Van Der Rohe Risk & Security Mgmt
	00

02/09/2007, 11h04	#4
Minority Invité régulier Étudiant Inscription : juillet 2007 Messages : 21 Détails du profil Informations personnelles : Localisation : France, Meurthe et Moselle (Lorraine) Informations professionnelles : Activité : Étudiant Informations forums : Inscription : juillet 2007 Messages : 21 Points : 8 Points : 8	Merci pour la rapidité de vos réponse ! @Anthony.Desvernois La balise onSubmit, c'est celle ci que je cherchais ! Merci. J'avais essayer naivement un Code : Sélectionner tout - Visualiser dans une fenêtre à part <form ... action="fonction()"> mais sans résultat (normal en même temps...). @TheDrev C'est vrai qu'un framework aiderait bien, mais étant donné mes objectifs pour ce site (relativement "simple")... . Le site étant bientôt opérationnel, je ne pense pas avoir recours a un framework, même si, en adopter un me serait sans doute utile pour la suite . Encore merci pour vos réponses les amis.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email