jquery function wird nicht aufgerufen

This site uses cookies. By continuing to browse this site, you are agreeing to our Cookie Policy.

  • jquery function wird nicht aufgerufen

    Hallo Forum,

    ich kenn mich leider (noch) nicht mit JQuery und Ajax aus, habe deswegen den Code von einem Tutorial genommen und versucht anzupassen. Insgesamt verwende ich diese Funktion mit jeweils geänderten Parametern dreimal auf meiner Seite. Zweimal läuft alles super, nur die dritte Funktion wird gar nicht aufgerufen und ich versteh einfach nicht warum. zumindest vermute ich, dass die Funktion nicht aufgerufen wird, weil FireBug gar nichts anzeigt und das Formular einfach an die aktuelle Seite geschickt wird :/

    Source Code

    1. $(document).ready(function () {
    2. $(".comment-form").submit(function () {
    3. var commentval = $("#subcomment").val();
    4. var wallval = $("#subcomment_wall").val();
    5. var dataString = 'comment=' + commentval + '&wall_id=' + wallval;
    6. if (commentval == '') {
    7. alert("Text fehlt");
    8. } else {
    9. $("#flash").show();
    10. $("#flash").fadeIn(400).html('<img src="images/ajax-loader.gif" align="absmiddle">');
    11. $.ajax({
    12. type: "POST",
    13. url: "comment-wall.php",
    14. data: dataString,
    15. cache: false,
    16. success: function (html) {
    17. $("ul#post-comments li:last").after(html);
    18. document.getElementById('subcomment').value = '';
    19. document.getElementById('subcomment').focus();
    20. $("#flash").hide();
    21. }
    22. });
    23. }
    24. return false;
    25. });
    26. });
    Display All


    das formular dazu:

    Source Code

    1. <form method="post" id="comment-form" class="comment-form"><input type="hidden" id="subcomment_wall" value="'.$i['wall_id'].'"><input type="text" id="subcomment" class="comment"></form><span id="flash"></span>


    wäre über jede Hilfe dankbar.

    The post was edited 1 time, last by freeek ().

  • muss meine Antwort zurücknehmen :/

    vill doch mal kurz zum Hintergrund: ich möchte eine Art Facebook-Pinnwand erstellen und Einträge eben kommentieren lassen über dieses Formular.
    das Eintragen von Beiträgen klappt wunderbar, nur das Kommentieren passt noch nicht. Ich habe jetzt einiges versucht und ich kapier einfach nicht, an was sich JQuery da stößt...

    wenn ich z.B. bei der function die class gegen die id austausch (die ja die gleiche ist), erscheint die fehlermeldung, dass der Text fehlt, ansonsten wird das Formular einfach an sich selbst geschickt. Warum treten da zwei unterschiedliche Ergebnisse auf?

    Genauso: Wenn ich das Kommentarformular direkt in die php-while Schleife schreibe erscheint das Alert-Fenster, wenn ich aber auf einen Text klicke und mir durch eine Funktion das Kommentarformular einblenden lasse, wird der Kommentar an die Seite selbst geschickt und nichts passiert. Die beiden Formulare sind absolut identisch..

    Kurzzeitig hat das Eintragen auch funktioniert, nur wurde mein Kommentar ca. 25 mal gespeichert, wenn ich aber einen anderen kommentiert habe, erschien das Alert-Fenster "Text fehlt" (bei allen anderen).

    Ich werde immer ratloser^^

    The post was edited 1 time, last by freeek ().

  • Ich habe deinen Code mal unverändert durch den jsbeautifier.org/ gejagt und oben aktualisiert, damit er etwas lesbarer wird.

    Dein Problem ist einfach erklärt:
    Du wendest deine Funktion auf alle Formulare mit der Klasse "comment-form" an. Das können natürlich mehrere sein.
    Innerhalb der Funktion greifst du aber auf IDs zu wie "subcomment". Weil IDs eindeutig sind, kann das natürlich nur eine sein.

    Deswegen ist die Methode schlichtweg falsch und alle Formular IDs sollten entfernt werden.
    Stattdessen solltest du mit der Referenz "this" arbeiten.
    this ist das Formular und mit formular.xxx kannst du auf das formularelemt mit dem Namen xxx zugreifen

    Lösung:

    Source Code

    1. $(document).ready(function () {
    2. $(".comment-form").submit(function () {
    3. var commentval = this.foo.value;
    4. ...
    5. });
    6. });