Drukowana wersja tematu

Kliknij tu, aby zobaczyć temat w orginalnym formacie

Forum PHP.pl _ XML, AJAX _ Formularz bez przeladowania strony. Problem z przekazaniem zmiennych.

Napisany przez: fcppl 10.01.2023, 12:52:35

witam,

Chciałem zrobić prosty formularz bez przeładowania strony za pomoc± serialize i wszystko działa OK, ale po wywołaniu skryptu nie przekazuje zmiennej Submit POST -> $_POST['unpublished'] i $_POST['published']

Jeżeli formularz ładuję bezpo¶rednio z products_success.php te zmienne istniej± i warunki mog± być spełnione.

Problem mam taki jak zrobić żeby te zmienne POST po wywołaniu serialize też istniały?

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/script.html>
  2. $(document).ready(function(){
  3. $("#form_add_products").on("submit", function(event){
  4. event.preventDefault();
  5. $.post("products_success.php", $(this).serialize(), function(data){
  6.  
  7. });
  8. });
  9. });
  10. </http://december.com/html/4/element/script.html>
  11.  
  12.  
  13. <http://december.com/html/4/element/form.html id="form_add_products" method="post" enctype="multipart/form-data">
  14.  
  15. ....
  16.  
  17. <http://december.com/html/4/element/input.html type="submit" name="published" value="Opublikuj" class="dropdown-item">
  18. <http://december.com/html/4/element/input.html type="submit" name="unpublished" value="Wycofaj" class="dropdown-item">						
  19.  
  20. </http://december.com/html/4/element/form.html>
[HTML] pobierz, plaintext 


[PHP] pobierz, plaintext 
  1. http://www.php.net/echo = $_POST['published'];
  2. http://www.php.net/echo = $_POST['unpublished'];
  3.  
  4.  
  5. if (http://www.php.net/isset($_POST['published'])) {
  6.  
  7. http://www.php.net/echo 'publikuje';
  8.  
  9. }
  10.  
  11. if (http://www.php.net/isset($_POST['unpublished'])) {
  12.  
  13. http://www.php.net/echo 'wylaczony';
  14.  
  15. }
[PHP] pobierz, plaintext

Napisany przez: nospor 10.01.2023, 14:13:15

serialize omija buttony.Musisz niestety sam recznie dodac ten button, ktory byl kliniety

Napisany przez: trueblue 10.01.2023, 14:16:53

A "wycofaj" powoduje zapis danych?

Napisany przez: fcppl 10.01.2023, 14:17:57

dzięki za informację. Mogę prosić o jakis przykład jak dodac samemu button ?

Cytat(trueblue @ 10.01.2023, 14:16:53 ) *
A "wycofaj" powoduje zapis danych?


Nie nic się nie dzieje

Napisany przez: trueblue 10.01.2023, 14:21:40

To po co analizować, który przycisk został naci¶nięty w PHP.
Przycisk powinien być albo <input type="reset"> albo buttonem z przekierowaniem do innej strony/przeładowaniem (JS).

Napisany przez: fcppl 10.01.2023, 14:33:04

Cytat(trueblue @ 10.01.2023, 14:21:40 ) *
To po co analizować, który przycisk został naci¶nięty w PHP.
Przycisk powinien być albo <input type="reset"> albo buttonem z przekierowaniem do innej strony/przeładowaniem (JS).


W moim przypadku mam kilka przyciskow dla przykładu tutaj podałem dwa i wszystko działa OK tylko niestety tak jak sie teraz dowiedziałem serialize nie przenosi ich danych.

Napisany przez: nospor 10.01.2023, 14:35:32

Cytat
Mogę prosić o jakis przykład jak dodac samemu button ?

No normalnie do tablicy ktora zwraca serialize dodajesz kolekjny element

var formData = $(this).serialize();
formData.push({ name: "twoj button", value: "twoja wartosc" });

Napisany przez: fcppl 10.01.2023, 15:18:17

Cytat(nospor @ 10.01.2023, 14:35:32 ) *
No normalnie do tablicy ktora zwraca serialize dodajesz kolekjny element

var formData = $(this).serialize();
formData.push({ name: "twoj button", value: "twoja wartosc" });


wykombinowałem co¶ takiego ale niestety nie dział±, pewnie co¶ robię zle ale niestety nie wiec jak to ogarnać. Wykonywałem tez rożne inne testy ale wklejam tylko jeden.

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/script.html>
  2. $(document).ready(function(){
  3. $("#form_add_products").on("submit", function(event){
  4. event.preventDefault();
  5.  
  6. var formData = $(this).serialize();
  7.  
  8. formData.push({name:"published", value:"Opublikuj"});
  9.  
  10. $.post("products_success.php", 
  11.  
  12. formData, 
  13.  
  14. function(data){
  15.  
  16. });
  17. });
  18. });
  19. </http://december.com/html/4/element/script.html>
[HTML] pobierz, plaintext

Napisany przez: nospor 10.01.2023, 15:21:11

I czym sie objawia "nie dzialanie" ?

Napisany przez: fcppl 10.01.2023, 15:23:53

Cytat(nospor @ 10.01.2023, 15:21:11 ) *
I czym sie objawia "nie dzialanie" ?


nic się nie dzieje a z konsoli mam bład

[HTML] pobierz, plaintext 
  1. products.php?pageno=1:424 Uncaught TypeError: formData.push is not a function
  2. at HTMLFormElement.<anonymous> (products.php?pageno=1:424:15)
  3. at HTMLFormElement.dispatch (jquery-3.5.1.min.js:2:43090)
  4. at v.handle (jquery-3.5.1.min.js:2:41074)
[HTML] pobierz, plaintext

Napisany przez: nospor 10.01.2023, 15:48:08

no to pisz od razu a "nei nie dziala" tongue.gif

co zwraca

console.log(formData);
?

sorki, w moim przykladzie powinno byc
serializeArray()

Napisany przez: fcppl 10.01.2023, 16:17:40

Cytat(nospor @ 10.01.2023, 15:48:08 ) *
no to pisz od razu a "nei nie dziala" tongue.gif

co zwraca

console.log(formData);
?

sorki, w moim przykladzie powinno byc
serializeArray()


Teraz wszystko działa OK, ale mam ostatni problem. Wiem ze to s± pytania amatorskie:

Teraz jak kliknę Opublikuj lub Wycofaj zawsze razem mi wywołuje do Post te dwie zmienne. Jak zrobić zeby odpowiednio osobno wywołało jak klikne Opublikuj i osobno Wycofaj?

[HTML] pobierz, plaintext 
  1. $(document).ready(function(){
  2. $("#form_add_products").on("submit", function(event){
  3. event.preventDefault();
  4.  
  5. var formData = $(this).serializeArray();
  6.  
  7. formData.push({name:"published", value:"Opublikuj"});
  8. formData.push({name:"unpublished", value:"Wycofaj"});
  9.  
  10. $.post("products_success.php", 
  11.  
  12. formData, 
  13.  
  14. function(data){
  15.  
  16. });
  17. });
  18. });
[HTML] pobierz, plaintext

Napisany przez: nospor 10.01.2023, 16:18:39

No submit masz dodawac ten ktory sie kliknal a nie na chama pchasz dwa.
Jaki zostal klikniety submit to chyba masz w event a konkretnie w event.target. Sprawdz

Napisany przez: fcppl 10.01.2023, 16:37:20

Cytat(nospor @ 10.01.2023, 16:18:39 ) *
No submit masz dodawac ten ktory sie kliknal a nie na chama pchasz dwa.
Jaki zostal klikniety submit to chyba masz w event a konkretnie w event.target. Sprawdz


Możesz mi podac jakis przykład bo niestety nie wiem jak sie za to zabrać?


Napisany przez: nospor 10.01.2023, 16:42:24

console.log(event.target);

co ci zwraca?

Napisany przez: fcppl 10.01.2023, 17:16:43

Cytat(nospor @ 10.01.2023, 16:42:24 ) *
console.log(event.target);

co ci zwraca?


Podaj link bo jest tego sporo i nie chce wklejac:

https://fcp.vot.pl/k.txt

Napisany przez: nospor 10.01.2023, 17:20:54

hm, to chyba w przypadku ajax musisz podpiac zdarzenia click pod te buttony, zamiast zdarzenie pod wyslanie forma.
Wtedy bedziesz wiedzial jednoznacznie ktory submit kliknieto i tylko jego dodasz


Napisany przez: fcppl 10.01.2023, 17:38:50

Cytat(nospor @ 10.01.2023, 17:20:54 ) *
hm, to chyba w przypadku ajax musisz podpiac zdarzenia click pod te buttony, zamiast zdarzenie pod wyslanie forma.
Wtedy bedziesz wiedzial jednoznacznie ktory submit kliknieto i tylko jego dodasz


tylko jak to zrobic? i znow musze prosic o jakis przyklad.

Napisany przez: nospor 10.01.2023, 17:46:26

No zamiast
$("#form_add_products").on("submit"

masz zrobic


$("TWOJ INPUT").on("click"

Napisany przez: fcppl 10.01.2023, 18:22:39

Cytat(nospor @ 10.01.2023, 17:46:26 ) *
No zamiast
$("#form_add_products").on("submit"

masz zrobic


$("TWOJ INPUT").on("click"


jak zmieniłem tak jak pisales to wtedy formularz nie przekazuje jako Post pol type=hidden smile.gif

Napisany przez: nospor 10.01.2023, 21:08:15

A zmieniles o to
$(this).serializeArray();

by zmiast $(this) bylo wskazanie na formularz?

Napisany przez: fcppl 10.01.2023, 21:29:13

Cytat(nospor @ 10.01.2023, 21:08:15 ) *
A zmieniles o to
$(this).serializeArray();

by zmiast $(this) bylo wskazanie na formularz?


Dzięki za pomoca, teraz mi wszystko działa OK, nie wiem tylko czy jest jakis lepszy (krótszy) zapis skryptu? mi działa taki:

[HTML] pobierz, plaintext 
  1. $(document).ready(function(){
  2.  
  3. 	$("#published").on("click", function(event){
  4.  
  5. 	event.preventDefault();
  6.  
  7. 	var formData = $('#form_add_products').serializeArray();
  8. 	formData.push({name:"published", value:"Opublikuj"});
  9.  
  10. 	$.post("products_success.php", 
  11.  
  12. 	formData, 
  13.  
  14. 	function(data){
  15.  
  16.  
  17. 	});
  18. 	});
  19.  
  20.  
  21. 	$("#unpublished").on("click", function(event){
  22.  
  23. 	event.preventDefault();
  24.  
  25. 	var formData = $('#form_add_products').serializeArray();
  26. 	formData.push({name:"unpublished", value:"Wycofaj"});
  27.  
  28. 	$.post("products_success.php", 
  29.  
  30. 	formData, 
  31.  
  32. 	function(data){
  33.  
  34.  
  35. 	});
  36. 	});
  37.  
  38. });
[HTML] pobierz, plaintext

Napisany przez: nospor 11.01.2023, 09:55:43

Bardziej mi chodzilo byc to zrobil jeden ON na oba submity

Dodajesz klase dla submit ktore chcesz lapac

<input type="submit" name="published" value="Opublikuj" class="dropdown-item lap-submit">
<input type="submit" name="unpublished" value="Wycofaj" class="dropdown-item lap-submit">

a potem lecisz po tej klasie


$(" lap-submit").on("click", function(event){
 
event.preventDefault();
 
var formData = $('#form_add_products').serializeArray();
formData.push({name:event.target.name, value:event.target.value});
 
$.post("products_success.php",
 
formData,
 
function(data){
 
 
});
});

i event.target bodajze zawiera klikniety submit wiec

formData.push({name:event.target.name, value:event.target.value});

I juz, ale to pisane z palca, sprawdz ten event.target

Napisany przez: viking 11.01.2023, 09:57:38

https://jsfiddle.net/7emn9y14/

Napisany przez: fcppl 11.01.2023, 10:31:16

Dziękuję wszystkim za pomoc już działa idealnie.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)