Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [inne][jQuery] AJAX - brak odpowiedzi.
Forum PHP.pl > Forum > Przedszkole
oomaster
Witam,

Siedzę od kilku bitych godzin i nie mogę znaleźć błędu. Firebug też nie wywala błędów ?!

Oczywiście wcześniej wszelkie biblioteki są dołączone. Walidacja formularzy działa z tym ,że po wysłaniu zamiast treści jest pusta strona?!
  1. <div id="contact_form">
  2. <form name="contact" method="post" action="">
  3. <label for="name" id="name_label"><b>Imię:</b></label><label class="error" for="name" id="name_error">Wpisz swoje imię.</label><br/>
  4. <input type="text" name="name" id="name" size="30" value="" class="text-input" />
  5. <br/>
  6. <label for="email" id="email_label"><b>Adres E-mail:</b></label><label class="error" for="email" id="email_error">Wpisz swój adres e-mail.</label><br/>
  7. <input type="text" name="email" id="email" size="30" value="" class="text-input" />
  8. <br/>
  9. <label for="phone" id="phone_label"><b>Zapytanie:</b></label><label class="error" for="phone" id="phone_error">Wpisz treść zapytania.</label><br/>
  10. <textarea name="phone" id="phone" rows="7" cols="13" class="imp"></textarea>
  11. <br/>
  12. <input type="submit" name="submit" class="button" id="submit_btn" value="Wyślij" />
  13. </form></div>

[JAVASCRIPT] pobierz, plaintext
  1. $(function() {
  2. $('.error').hide();
  3.  
  4. $(".button").click(function() {
  5. // validate and process form
  6. // first hide any error messages
  7. $('.error').hide();
  8.  
  9. var name = $("input#name").val();
  10. if (name == "") {
  11. $("label#name_error").show();
  12. $("input#name").focus();
  13. return false;
  14. }
  15. var email = $("input#email").val();
  16. if (email == "") {
  17. $("label#email_error").show();
  18. $("input#email").focus();
  19. return false;
  20. }
  21. var phone = $("textarea#phone").val();
  22. if (phone == "") {
  23. $("label#phone_error").show();
  24. $("textarea#phone").focus();
  25. return false;
  26. }
  27.  
  28. var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;
  29. //alert (dataString);return false;
  30.  
  31. $.ajax({
  32. type: "POST",
  33. url: "process.php",
  34. data: dataString,
  35. success: function() {
  36. $('#contact_form').html("<div id='message'></div>");
  37. $('#message').html("<b>Wiadomość została wysłana.</b>")
  38. .append("<p>dziękujemy.</p>")
  39. .hide()
  40. }
  41. });
  42. return false;
  43. });
  44. });
  45. runOnLoad(function(){
  46. $("input#name").select().focus();
  47. });
[JAVASCRIPT] pobierz, plaintext
webdice
Spróbuj wstawić kod do:

[JAVASCRIPT] pobierz, plaintext
  1. jQuery( document ).ready( function( $ )
  2. {
  3. // tu Twój kod.
  4. });
[JAVASCRIPT] pobierz, plaintext


oraz usuń deklaracje anonimowej funkcji.
oomaster
Bez rezultatu. Walidacja działa więc problem jest gdzieś wokół $.Ajax . Ale nic nie widzę dziwnego ?!
webdice
W firebug widać informacje na temat połączenia?
Crozin
@webdice: To są równoważne zapisy:
[JAVASCRIPT] pobierz, plaintext
  1. $(function() { ... });
  2. $(document).ready(function() { ... });
[JAVASCRIPT] pobierz, plaintext


1. Powtarzasz strasznie dużo kodu, zamiast umieścić go na przykład w pętli.
2. By uzyskać dane z formularza i utworzyć z nich odpowiedni ciąg (do przesłania w żądaniu) możesz użyć jQuery.serialize() (zajmuje się od razu poprawnym przygotowaniem ciągu czego Ty nie robisz).
3. Czy samo żądanie się wykonuje? Jeśli tak to co jest w jego wyniku zwracane? Sprawdź czy nie wystąpił błąd jQuery.ajax() - parametr error.
webdice
@webdice: To są równoważne zapisy:
[JAVASCRIPT] pobierz, plaintext
  1. $(function() { ... });
  2. $(document).ready(function() { ... });
[JAVASCRIPT] pobierz, plaintext


Nie wiedziałem, ale rzeczywiście po sprawdzeniu - zgadza się.

Cytat
All three of the following syntaxes are equivalent:

$(document).ready(handler)
$().ready(handler) (this is not recommended)
$(handler)
oomaster
Cytat(webdice @ 10.01.2011, 20:00:06 ) *
W firebug widać informacje na temat połączenia?


Tak wszystko elegancko pokazuje ,że jest wysyłane zapytanie i odpowiedź...
Crozin
No to skoro jest odpowiedź oznacza to, że żądanie samo w sobie się powiodło. Teraz pytanie czy odpowiedź nie jest błędem. Jakie konkretne nagłówki otrzymujesz w odpowiedzi i jaka jest treść samej odpowiedzi?
oomaster
Po prostu formularz za pomocą pliku js wysyła wszytko do process.php w formie POST i w firebugu mogę zobaczyć jak najbardziej rzeczywistą i prawdziwą odpowiedź. Ale dlaczego nie widać ,żadnego komunikatu ?!
webdice
Zobacz czy wyświetla się alert.

[JAVASCRIPT] pobierz, plaintext
  1. success: function()
  2. {
  3. alert( 'OK' );
  4. }
[JAVASCRIPT] pobierz, plaintext
oomaster
Właśnie przedchwilą wpadłem na to też i sprawdziłem:


Kod
        $.ajax({
      type: "POST",
      url: "process.php",
      data: dataString,
      success: function() {
        $('#contact_form').html("<div id='message'></div>");
        alert( "Data Saved ");
        $('#message').html("<b>Wiadomość została wysłana.</b>")
        .append("<p>ok</p>")
        .hide()
      }
     });


I o dziwo alert jest?! czyli coś jest coś nie tak z tym html ?! Zaraz spróbuje coś wymyślić ciekawego bo mnie rozniesie ;-)

EDIT:
Działa ostatnią wartość hide trzeba było zamienić na show ;-) dzięki za pomoc
Crozin
Widzisz to .hide()? Ono ukrywa nowo dodany komunikat.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.