Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][JavaScript]Przesyłanie danych formularza bez odświerzania
Forum PHP.pl > Forum > Przedszkole
[oooo]
Witam.

Jakim sposobem mogę wyciągnąć dane z formularza aby nie przeładowała sie strona. Zależy mi na rozwiązaniu w jquery ponieważ reszta jest napisana w tym framworku a nie chciałbym mieszać.

Mam taki mały ubutek w pamięci a potrzebne mi to jest. Taki testowy przykład, działa lecz odświerza.
  1. <form action="" method="post">
  2. <input type="text" name="pole" id="pole">
  3. <button onclick="test()">Testuj</button>
  4. </form>
  5. <div id="div"> </div>
  6. function test(){
  7. $("div").html($("#pole").val());
  8. }
wookieb
[JAVASCRIPT] pobierz, plaintext
  1. $('form').bind('submit', function(e) {
  2. e.preventDefault(); // blokada wysłania forma
  3. // obsluga formularza
  4. });
[JAVASCRIPT] pobierz, plaintext
[oooo]
Działa bez problemu.

Mam problem teraz z przesłaniem tych danych do pliku php za pomocą ajaxa

  1. <form id="form" method="post">
  2. <input type="text" name="pole1" id="pole1">
  3. <input type="text" name="pole2" id="pole2">
  4. <input type="submit" name="submit" id="sub">
  5. </form>
  6. <div id="div"> </div>
  7. $('#form').bind('submit', function(e) {
  8. e.preventDefault();
  9. var pole1 = $("#pole1").val();
  10. var pole2 = $("#pole2").val();
  11. $.ajax({
  12. url : 'ajax.php',
  13. data: 'n='pole1'&k='pole2',
  14. type: 'POST',
  15. success: function(data) {
  16. $("div").html(data);
  17. }
  18. });
  19. });
strife
Na pierwszy rzut oka to masz błąd w linijce 14, jeśli już powinno być:

Kod
data: 'n=pole1&k=pole2',


Za dużo ciapków.

Porada na przyszłość, korzystaj z firebug'a do diagnostyki.
[oooo]
Teraz mi przekazuje jako n = pole1 i k = pole2. Jako tekst a nie z zmiennych w których są dane z formularzy.
wookieb
[JAVASCRIPT] pobierz, plaintext
  1. data: $(this).serialize()
[JAVASCRIPT] pobierz, plaintext
[oooo]
Nie za bardzo wiem jak to mam wykorzystać od dziś zacząłem przygodę z ajax jquery.

[JAVASCRIPT] pobierz, plaintext
  1. data: 'n='$("#polee1").serialize()'&k='$("#pole2").serialize()'',
[JAVASCRIPT] pobierz, plaintext
wookieb
Zajrzyj w konsolę błędów bo masz błąd składni.
Przecież podałem Ci gotowy działający skrawek jaki masz wstawić w kod (ten sam fragment pokazujesz)
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.