[inne][jQuery] AJAX - brak odpowiedzi. Opcje

[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?!

[HTML] pobierz, plaintext 
<div id="contact_form">
  <form name="contact" method="post" action="">
      <label for="name" id="name_label"><b>Imię:</b></label><label class="error" for="name" id="name_error">Wpisz swoje imię.</label><br/>
      <input type="text" name="name" id="name" size="30" value="" class="text-input" /> 
      <br/>
      <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/>
      <input type="text" name="email" id="email" size="30" value="" class="text-input" />  
      <br/>
      <label for="phone" id="phone_label"><b>Zapytanie:</b></label><label class="error" for="phone" id="phone_error">Wpisz treść zapytania.</label><br/>
	  <textarea name="phone" id="phone" rows="7" cols="13" class="imp"></textarea>
    	<br/>
      <input type="submit" name="submit" class="button" id="submit_btn" value="Wyślij" />
  </form></div>
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
$(function() {
  $('.error').hide();
 
  $(".button").click(function() {
		// validate and process form
		// first hide any error messages
    $('.error').hide();
 
	  var name = $("input#name").val();
		if (name == "") {
      $("label#name_error").show();
      $("input#name").focus();
      return false;
    }
		var email = $("input#email").val();
		if (email == "") {
      $("label#email_error").show();
      $("input#email").focus();
      return false;
    }
		var phone = $("textarea#phone").val();
		if (phone == "") {
      $("label#phone_error").show();
      $("textarea#phone").focus();
      return false;
    }
 
		var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;
		//alert (dataString);return false;
 
		$.ajax({
      type: "POST",
      url: "process.php",
      data: dataString,
      success: function() {
        $('#contact_form').html("<div id='message'></div>");
        $('#message').html("<b>Wiadomość została wysłana.</b>")
        .append("<p>dziękujemy.</p>")
        .hide()
      }
     });
    return false;
	});
});
runOnLoad(function(){
  $("input#name").select().focus();
});
[JAVASCRIPT] pobierz, plaintext 

[webdice]

Spróbuj wstawić kod do:

[JAVASCRIPT] pobierz, plaintext 
jQuery( document ).ready( function( $ )
{
  // tu Twój kod.
});
[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 
$(function() { ... });
$(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 
$(function() { ... });
$(document).ready(function() { ... });
[JAVASCRIPT] pobierz, plaintext 

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

All three of the following syntaxes are equivalent:

$(document).ready(handler)
$().ready(handler) (this is not recommended)
$(handler)

[oomaster]

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 
success: function()
{
  alert( 'OK' );
}
[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

Ten post edytował oomaster 10.01.2011, 20:46:17

[Crozin]

Widzisz to .hide()? Ono ukrywa nowo dodany komunikat.