Forum PHP.pl > [AJAX][HTML] Form w form'ie - problem z działaniem skryptu AJAX

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [AJAX][HTML] Form w form'ie - problem z działaniem skryptu AJAX

Michael2318

4.01.2013, 18:36:55

Mam pewien formularz i muszę w środku tego formularza, dorzucić jeszcze jeden formularz... I problem jest tego typu, że to nie bardzo chce działać.
Próbuję z tego poradnika: http://www.webskrypty.pl/2010/dodawanie-re...-pomoca-jquery/
dorzucić sobie automatyczną zmianę danych w bazie, za pomocą formularza. Wygląda to mniej więcej tak:

[HTML] pobierz, plaintext 
<form action="{S_CONFIG_ACTION}" method="post" id="pick_form" name="pick_form">
tutaj masa paści
<form action="" method="post" id="submit" name="submit">
tutaj pola input z tekstem, ktory ma zostac dodany do bazy za pomoca ajax
</form>
</form>
[HTML] pobierz, plaintext

Problem jest taki, że ten drugi form zachowuje się tak jakby go nie było. Po kliknięciu w submit, zamiast ajax przesyłać wartości do pliku to jest on odbierany jakby przez ten pierwszy form i się tylko strona odświeża.
Czytałem gdzieś, że nie można użyć forma w formie, ale w takim razie jak ja mam to inaczej zrobić, skoro pierwszy form ma podaną ścieżkę działania (action="costam") a drugi jej nie może mieć bo ma zostac obsłużony przez AJAX. ?

krzychu0808

5.01.2013, 13:08:27

Przez Jquery możesz pobierać bezpośrednio dane z Input i nie musisz dawać form dla tego formularza w środku. Możesz zrobić potrzebne inputy i jakiś button który nie wysyła forma ale Jquery go wykryje że został naciśnięty i pobierze z wybranych input-ów dane , sprawdzi je i wyśle do pliku php. Takie rozwiązanie da ci możliwość wysyłania środkowego formularza nie ograniczoną ilość razy bez przeładowania oczywiście możesz zrobić że po wysłaniu formularz środkowy znika jeżeli chcesz aby był użyty tylko raz.
Czyli np.

[HTML] pobierz, plaintext 
<script>
$(function(){
	$("#wyslij_srodek").click(function() {  
		var nazwa = $('#nazwa_input').val(); // pobieranie input do zmiennej
		$(".komunikat").html('Wpisałeś wartość: '+nazwa);
		// tutaj musisz sobie napisać sprawdzanie danych formularza i wysyłanie do pliku php.
	       return false; 
	});
});
</script>
 
<body>	
<FORM action="plik.php" method="post">
    <INPUT type="text" id="test"><BR>
    tutaj masa paści <br/><br/>
 
         //// Środkowy formularz /// <br/>
	<div class="komunikat"></div>
	<input type="text" id="nazwa_input"> <br/>
	<button id="wyslij_srodek">Wyślij</button> // button wysyłający środkowy formularz do JS bez przeładowania strony <br/>
	///// Koniec środkowego formularza //// <br/>
 
 
    <INPUT type="submit" value="Send"> 
</FORM>
[HTML] pobierz, plaintext

Oczywiście musisz dołączyć Jquery do tego kodu.

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.