tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
1
ZUGRIFFE
606
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 16.03.10 20:06 #1
    sonicks sonicks ist offline Mitglied Gold
    Registriert seit
    Apr 2002
    Ort
    Stuttgart
    Beiträge
    213
    Hallo, ich nochmal.

    Ich bin mit meinem Formular, dass per jQuery .ajax abgesendet wird etc. schon ziemlich weit. Jetzt möchte ich nur noch eine kleine Validierung mit dem jQuery .validate() Plugin.
    Diese funktioniert auch!

    Es funktioniert eigentlich ALLES wie es soll. Jedoch wird das Formular, selbst wenn die Validierung erfolgreich war, erst nach dem zweiten Mal auf den Submitbutton klicken abgeschickt und ich komm leider nicht dahinter warum.

    Das Problem muss also irgendwo an dem

    Code :
    1

     submitHandler: function() { ...

    liegen.

    Hier der komplette Code:

    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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88

    $(document).ready(function() {
        $("#commentForm").validate({ 
                                   
               
               debug: true,
                rules: {
                    
                    name: "required",
                    text: "required",
                    email: {
                        required: true,
                        email: true
 
                    },
                    web: {
                        required: true,
                        url: true
 
                    }   
                
                },
                messages: {
                    
                    name: "Du hast deinen Namen vergessen!",
                    text: "Textlose Kommentare sind sooooooooooo lastyear!",
                    email: {
                        required: "Bitte eine korrekte E-Mail angeben!",
                    },
                    web: {
                        required: "Bitte eine korrekte URL angeben!",
                    }
                },
                
                
               // Wenn Formular Valid => Ausführen  
               submitHandler: function() {
 
                   /////////////// AJAX REQUEST - EINTRAG + AUSLESEN DES LETZEN EINTRAGS //////////////
                   $("#submit").click(function() {
                
                        // Loading GIF im Div Containter "Kommentar" anzeigen
                        $('#comment_ajax').append('<img src="images/icons/ajax-loader.gif" alt="Lädt gerade..." id="loading" />');
                        
                        var name = $('#name').val();
                        var email = $('#email').val();
                        var web = $('#web').val();
                        var text = $('#text').val();
                        var user = $('#user').val();
                        var hp = $('#hp').val();
                        var post_id = $('#post_id').val();
                        
                        
                        $.ajax({
                           type: 'POST',
                           url: 'includes/comment_insert.inc.php',
                           data: 'name=' + name + '&email=' + email + '&text=' + text + '&web=' + web + '&user=' + user + '&post_id=' + post_id + '&hp=' + hp,
                           
                           success: function(response){
                            
                             $('#comment_ajax').append(response);
                             $('#loading').fadeOut(500, function() {
                                $(this).remove();                                
                                });
                             
                             $('#notice').append('Dein Kommentar wurde eingetragen').slideDown(400).delay(2500).fadeOut(800);
                             var leer = '';
                             $('#name').val(leer);
                             $('#email').val(leer);
                             $('#web').val(leer);
                             $('#text').val(leer);
                             $('#name').val(leer);
 
 
                           }
                           
                        });
                        return false;     
                    });
                   /////////////// AJAX REQUEST - EINTRAG + AUSLESEN DES LETZEN EINTRAGS ENDE //////////////
 
               
               }
               
               
            });
        
            
        });


    Danke schonmal im Vorraus!
     
    Zitieren Zitieren
  2. 16.03.10 21:22 #2
    Avatar von Matthias Reitinger
    Matthias Reitinger Matthias Reitinger ist offline ɐɯıǝɹ
    tutorials.de Premium-User
    Registriert seit
    Dec 2001
    Ort
    Bayern
    Beiträge
    5.806
    Blog-Einträge
    5
    Hallo,

    das liegt daran, dass du im submitHandler nur einen Klick-Handler für den Submit-Button anlegst. Dieser wird dann beim nächsten Klick ausgeführt. Mach es am besten so:

    Code javascript:
    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

    submitHandler: function(form) {
                /////////////// AJAX REQUEST - EINTRAG + AUSLESEN DES LETZEN EINTRAGS //////////////
                // Loading GIF im Div Containter "Kommentar" anzeigen
                $('#comment_ajax').append('<img src="images/icons/ajax-loader.gif" alt="Lädt gerade..." id="loading" />');
                var data = $(form).serialize();
 
                $.ajax({
                    type: 'POST',
                    url: 'includes/comment_insert.inc.php',
                    data: data,
                    success: function(response) {
                        $('#comment_ajax').append(response);
                        $('#loading').fadeOut(500, function() {
                            $(this).remove();
                        });
                        $('#notice').append('Dein Kommentar wurde eingetragen').slideDown(400).delay(2500).fadeOut(800);
                        var leer = '';
                        $('#name').val(leer);
                        $('#email').val(leer);
                        $('#web').val(leer);
                        $('#text').val(leer);
                        $('#name').val(leer);
                    }
                });
                /////////////// AJAX REQUEST - EINTRAG + AUSLESEN DES LETZEN EINTRAGS ENDE //////////////
            }

    Grüße,
    Matthias
     
    „Gib einem Menschen einen Fisch, und er wird für einen Tag satt. Lehre ihn Fischen, und er wird ein Leben lang satt.“
    “For every complex problem, there is an answer that is short, simple and wrong.”
    “Pessimism is safe, but optimism is a lot faster!”

    Aktuelles Coding Quiz: #17 - Wörter kreuz und quer
    Zitieren Zitieren
« Mehrere Divs mit JQuery ein und ausklappen | Galleriewand Script? »

Ähnliche Themen

  1. jQuery Email Validierung (mehrfach)
    Von Peter Klein im Forum Javascript & Ajax
    Antworten: 3
    Letzter Beitrag: 10.03.10, 10:31
  2. Formular Validierung die 1000ste
    Von ropueh im Forum Javascript & Ajax
    Antworten: 5
    Letzter Beitrag: 04.03.10, 17:35
  3. Formular-Validierung
    Von Neurodeamon im Forum Javascript & Ajax
    Antworten: 3
    Letzter Beitrag: 11.05.06, 01:51
  4. Formular Validierung
    Von riddla im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 16.12.05, 01:14