[JQueryUI] Formulaire dans un dialog

Version imprimable

14/05/2009, 10h18
cereal59

[JQueryUI] Formulaire dans un dialog

Bonjour,

Je débute avec JQuery/JQueryUI et j'ai besoin de conseil pour la réalisation d'une boite de dialogue contenant un formulaire.

Voila ce que j'arrive à faire:

- Créer une boite de dialogue, qui à l'ouverture charge par un appel ajax, ici mon formulaire.

- Ajouter des boutons à cette boite de dialogue avec leur logique (1 pour valider et soumettre, l'autre pour fermer le dialogue).

- Validation du formulaire (cote client).

Voila ce que je n'arrive pas à faire:

- Lorsque le formulaire est soumis (passe la validation cote client), si l'appli détecte des erreurs (données ou règles métiers) je doit ré-afficher dans le dialogue le formulaire avec les messages, sinon je doit fermer la boite.

Pour résumer, je voudrait ré afficher le formulaire si il y a des erreurs, fermer la boite sinon. Sachant que dans les deux cas, mon script sur le serveur renvois du HTML.

Quelqu'un a t'il une idée ou a déjà réalisé ce genre de chose avec JQuery,JQuery/UI.

Merci d'avance.
14/05/2009, 12h41
Kerod

Il y a bien des idées mais il faudrait voir ton code.

Attention pas de code serveur ! Que du code HTML et obtenu à l'aide de Afficher la source dans ton navigateur

J'ai trouve un solution a mon probleme mais elle ne me satisfait pas a 100%.

Mon action renvois une chaine de caractere, "ok" en l'occurence, lorsqu'elle se deroule sans probleme, sinon elle renvois le code html du formulaire.

Voici le code javascript utilise pour creer la boite de dialgue ainsi que celui pour repondre a l'evenement sur le bouton.

Code de creation de la boite de dialogue et logique des boutons

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
 
    $('#create_app_dialog').dialog({
        autoOpen: false,
        bgiframe: true,
        modal: true,
        buttons: {
            'Create application': function() {
                $.ajax({
                    type: "POST",
                    url: "/Application/Create",
                    data: $("#createAppForm").serialize(),
                    success: function(html) {
                        if (html == "ok") {
                            $('#create_app_dialog').dialog('close');
                        }
                        else {
                            $('#create_app_dialog').html(html);
                        }
                    }
                });
 
            }
        },
        open: function(event, ui) {
            $('#create_app_dialog').load("/Application/Create");
        }
    });

Code pour ouvrir la boite de dialogue via un lien

Code:

1
2
3
4
5
 
    $('#create_app_dialog_link').click(function() {
        $('#create_app_dialog').dialog('open');
        return false;
    });

ce qui m'embete le plus c'est

Code:

1
2
3
4
5
6
7
8
9
 
                   success: function(html) {
                        if (html == "ok") {
                            $('#create_app_dialog').dialog('close');
                        }
                        else {
                            $('#create_app_dialog').html(html);
                        }
                    }

Je ne trouve pas ca tes propre de devoir envoyer "ok" en cas de succes

Si vous avez d'autre methode je suis preneur.:roll: