jQuery Ajax Link

S

scherlomatic

Hallo!

Der Titel ist höchstwahrscheinlich falsch gewählt, aber mir viel kein besser ein... bitte um Verzeihung.

Aufgabenstellung:
Will einen Feedback-Button auf meiner Seite integrieren, der sich am linken Rand befindet und sich beim Klick ein und ausfahren lässt, und sonst halt noch Spielereien.
User füllt ein Formular aus und schickt es per AJAX an den Server wo es ausgewertet wird und das Formular abgeändert wird zu einer "Success" oder "Error" Message. Danach fährt das FeedbackPanel wieder ein und setzt das Formular wieder an die Stelle wo es vorher war.

Problem:
Wenn der User das Formular einmal absendet funktioniert noch alles (ein "return flase" bewirkt ja, dass der eigentlich Link, also der Senden-Button nicht ausgeführt wird). Wenn er das Panel dann wieder ausklappt, wird zwar auch noch alles abgesendet, usw. so wie es halt gehört, aber das "return false" wird ignoriert und der User wird auf die in der <form action="xxx"> angegeben action weitergeleitet.

Ich bin dem Problem schon ziemlich nahe, da wenn ich die Funktionen, wo die Success/Error Message generiert und eingebunden wird auskommentiere funktioniert es.


Code: (unnötiges wurde entfert)
Code:
$(".feedback-panel .button").click(function() {
        var response_message = "Danke für ihr Feedback!";
        var error_message = "Fehler beim Senden, bitte versuchen Sie es später erneut!";
        var feedbackForm = $('#form-wrap').html();

        $.ajax({
          type: "POST",
          url: "feedback",
          data: dataString,
          success: function() {
            $('#form-wrap').html("<div id='response-message'></div>");
            $('#response-message').html("<p>" + response_message +"</p>").hide().fadeIn(500).animate({
              opacity: 1.0
            }, 1000).fadeIn(0, function(){
              $('#form-wrap').html(feedbackForm);
              $('.feedback-panel').animate({
                left:'-' + (feedbackTab.containerWidth)
              },(feedbackTab.speed)).removeClass('open');
            });
          }
        });
        return false;
      });

Danke für eure Hilfe im Voraus
 
Hi,

versuch mal, den click-Event über die live-Methode an den Button zu binden. Damit wird das Ereignis auch ausgeführt, wenn der HTML-Teil zu einem späteren Zeitpunkt neu als String ins Dokument eingefügt wird.
Code:
$(".feedback-panel .button").live('click', function() {
  // Bisheriger Code
}

Ciao
Quaese
 
Hallo!

Danke, mit dem "live"-Event gehts, aber mir kommt das irgendwie wie ein kleiner Workaround vor, weil der eigentliche Fehler ja doch wo anders liegen wird.
Order gibts dafür keine elegenatere Lösung?


Lg
 
Hi,

das ist kein Workaround.

Wenn du neuen HTML-Code in den Baum einhängst, musst du auch die zugehörigen Events neu registrieren. Das nimmt dir die Funktion live ab.

Ciao
Quaese
 
Zurück