[AJAX][PHP]Pętla Foreach oraz wywołanie zmiennej przez ajax Opcje

[hejkumkejkum]

Mam sobie w pętli w PHP wygenerowany form z polami input ukrytymi do przesłania $_POSTem.
Chciałem się dobrac do nich poprzez ajax.

Na przykład coś takiego

[HTML] pobierz, plaintext 
<form class="sss_dodaj_class" action="" method="post">
			<input type="hidden" id="sss_product_id" name="sss_product_id" value="<?php echo $id; ?>" />
			<input type="hidden" id="sss_action"  name="sss_action" value="dodaj" />
			<input type="image" name="dodaj" class="sss_podsumowanie_dodaj" value="dodaj" title="dodaj"/>
</form>
 
 
<form class="sss_dodaj_class" action="" method="post">
			<input type="hidden" id="sss_product_id" name="sss_product_id" value="<?php echo $id; ?>" />
			<input type="hidden" id="sss_action"  name="sss_action" value="dodaj" />
			<input type="image" name="dodaj" class="sss_podsumowanie_dodaj" value="dodaj" title="dodaj"/>
</form>
 
<form class="sss_dodaj_class" action="" method="post">
			<input type="hidden" id="sss_product_id" name="sss_product_id" value="<?php echo $id; ?>" />
			<input type="hidden" id="sss_action"  name="sss_action" value="dodaj" />
			<input type="image" name="dodaj" class="sss_podsumowanie_dodaj" value="dodaj" title="dodaj"/>
</form>
[HTML] pobierz, plaintext 

Problem polega na tym, że obecnie w pętli mam tylko clasy, czyli nie mam się jak odwołać do każdego form z osobna.
I po wywołaniu

[HTML] pobierz, plaintext 
jQuery(".sss_dodaj_class").click(function(){
[HTML] pobierz, plaintext 

Za każdym razem zwróci ten sam wynik, czyli prawdopodobnie elementu pierwszego z pętli.
W jaki sposób zrobić, żeby to działało jak należy.
Wiem, że mogę do pętli dodać zmienną $i=0 $i++ i dodać to do class "sss_dodaj_class<?php echo $i; ?>"
Ale może istnieje lepszy sposób?
Jak to ugryźć?

Ten post edytował hejkumkejkum 2.01.2014, 02:54:06

[bostaf]

Problem polega na tym, że obecnie w pętli mam tylko clasy, czyli nie mam się jak odwołać do każdego form z osobna.
I po wywołaniu

[HTML] pobierz, plaintext 
jQuery(".sss_dodaj_class").click(function(){
[HTML] pobierz, plaintext 

Za każdym razem zwróci ten sam wynik, czyli prawdopodobnie elementu pierwszego z pętli.
W jaki sposób zrobić, żeby to działało jak należy.

Jest OK. To co zrobiłeś w jQuery powoduje przypięcie do każdego elementu z klasą sss_dodaj_class (czyli do 3 formularzy) obsługi zdarzenia click. Każdy z tych detektorów jest świadomy swojego położenia - wie, do którego formularza należy. Dla przykładu, jeśli umieścisz w tamtej funkcji obsługi zdarzenia taką instrukcję:

[JAVASCRIPT] pobierz, plaintext 
jQuery(".sss_dodaj_class").click(function(){
    var a = $("input[name='sss_product_id']", this);
    alert(a.val());
});
[JAVASCRIPT] pobierz, plaintext 

... to klikając gdziekolwiek wewnątrz tych trzech formularzy otrzymasz wartość (to co ustawiasz w atrybucie value, ze zmiennej PHP $id) odpowiedniego inputa o nazwie sss_product_id. Dzieje się tak bo selektor this dokładnie określa z którego formularza został wywołany (tak jak pisałem - jest "świadomy" swojego położenia).

Jeśli chcesz zrezygnować a określania elementów za pomocą ich atrybutów (class, name, itd) to przyjąwszy, że struktura formularzy jest stała, możesz odwołać się do kolejności elementów i wykorzystać funkcję jQuery eq(), która pozwoli Ci wybrać konkretny element z zestawu inputów:

[JAVASCRIPT] pobierz, plaintext 
jQuery(".sss_dodaj_class").click(function(){
    var a = $(this).find('input').eq(0); // 0 - pierwszy ze znalezionych inputów, 1 - drugi, ...
    alert(a.val());
});
[JAVASCRIPT] pobierz, plaintext 

Metoda inna ale efekt identyczny.
Jak poczytasz rozdział o selektorach (http://api.jquery.com/category/selectors/) to odkryjesz jeszcze więcej sposobów.

[owca_82]

Problem polega na tym, że obecnie w pętli mam tylko clasy, czyli nie mam się jak odwołać do każdego form z osobna.

document.forms

I po wywołaniu ..... Za każdym razem zwróci ten sam wynik, czyli prawdopodobnie elementu pierwszego z pętli.

Nie, nie zwróci, jeżeli wewnątrz funkcji obsługującej zdarzenie odwołasz się za pomocą "this" ;p ... (this = kliknięty element)

[hejkumkejkum]

Kurcze faktycznie gdy zrobiłem test kodem:

[PHP] pobierz, plaintext 
jQuery(".sss_dodaj_classs").click(function(){
var a = jQuery('#sss_product_id',this);
alert(a.val());
});
[PHP] pobierz, plaintext 

To wyniki są odrębne dla każdejgo elementu form. I rzeczywiście działa to bez problemu.


Ale gdy podpiąłem to:

[PHP] pobierz, plaintext 
jQuery(".sss_dodaj_class").click(function(){
 
var sss_product_id = jQuery('#sss_product_id', this).val();
var sss_action = jQuery('#sss_action', this).val();
 
jQuery.ajax({
type: 'POST',
url: MyAjax.ajaxurl,
data: {
action: "jakas_funkcja",
product_id: sss_product_id,
sss_action: sss_action
},
success: function(data){ 
//alert(data);
jQuery('.sss_koszyk_button_v').replaceWith(data);
}
});
return false;
});
[PHP] pobierz, plaintext 

To zwraca mi wartość tylko pierwszego form, bez względu na który guzik nacisnę.

Dodam, że chodzi o Wordpressa.
Usiłuję rozgryźć ajaxa i trafiłem na ścianę właśnie z tym problemem.

Czyli gdzieś popełniłem błąd ale nie wiem gdzie

Ten post edytował hejkumkejkum 2.01.2014, 22:48:29

[bostaf]

Wiem, że poucinałeś niepotrzebne fragmenty kodu, ale czy w liniach 11 i 12 nie powinno być:

[JAVASCRIPT] pobierz, plaintext 
product_id: dkfp_product_id,
sss_action: dkfp_action
[JAVASCRIPT] pobierz, plaintext 

[hejkumkejkum]

Wiem, że poucinałeś niepotrzebne fragmenty kodu, ale czy w liniach 11 i 12 nie powinno być:

[JAVASCRIPT] pobierz, plaintext 
product_id: dkfp_product_id,
sss_action: dkfp_action
[JAVASCRIPT] pobierz, plaintext 

To jest prefix który dodaje, ale zastąpiłem go sss. Tutaj zapomniałem go zastąpić przed wklejeniem
Czyli wszędzie tam gdzie jest dkfp to powinno byc sss.
Ale błąd popełniłem tylko przy wklejaniu na forum.
Już poprawiłem post.


Znalazłem coś takiego.
http://stackoverflow.com/questions/2066980...hp-foreach-loop

W zasadzie to ten sam problem co mój z ta różnicą, że tam miał każde ID takie samo.
Czyżby jednak wynikało z tego, że dla ajaxa musi to być inaczej rozwiązane niż u mnie?

Czyli dodanie id z przyrastającą zmienną $i?


Ten post edytował hejkumkejkum 2.01.2014, 23:10:31

[bostaf]

HTML jest dokładnie taki jak ten, który wkleiłeś w pierwszej wiadomości?

Ten post edytował bostaf 2.01.2014, 23:07:29

[hejkumkejkum]

Ok chyba znalazłem problem.

I chyba szukałem nie tam gdzie trzeba.
Prawdopodobnie problemem jest funkcja jquery

[HTML] pobierz, plaintext 
replaceWith
[HTML] pobierz, plaintext 

, która po prostu kasuje diva (podmienia), zatem drugie kliknięcie nie znajduje miejsca do którego może załadowac wynik.

Dzieki panowie za w pewnym sensie nakierowanie na rozwiązanie



Panowie jeszcze pociągnę temat:

[HTML] pobierz, plaintext 
<tr>
  <td class="form_thumb"></td>
  <td class="dkfp_tytul" valign="middle"></td>
  <td class="srodek odstep_dkfp"></td>
  <td class="srodek odstep_dkfp"></td>
  <td class="srodek odstep_dkfp"></td>
  <td class="srodek odstep_dkfp"></td>
  <td class="srodek odstep_dkfp">
<div class="list_select_form">
<form  method="post" class="dkfp_add_to_cart" >
	<?php dkfp_select_price(); ?>
 </div></td>
  <td style="text-align:right;">
                	<input type="hidden" id="dkfp_qty" name="dkfp_qty" class="dkfp_cart_qty" value="1" />
	                <input type="hidden" id="dkfp_product_id" name="dkfp_product_id" value="<?php echo $post->ID; ?>" />
                        <input type="hidden" id="dkfp_action" name="dkfp_action" value="add" />
	                <input  class="wyr_prawo do_koszyka_button" type="submit" value="Dodaj do koszyka" /></form>  
 </td>
  </tr>
[HTML] pobierz, plaintext 

Jak w tym wypadku mając pętlę przesyłać formularz po kliknięciu na SUBMIT .do_koszyka_button"?
Jak się do tego dobrać?
Czy muszę nadać jakiemuś elementowi ID? Mogę to zrobić jedynie przez użycie zmiennej $post->ID.
Chyba, ze da się poprzez selektory jquery odwołać do każdego przycisku z osobna.
Obecnie dodaje mi do koszyka tylko pierwszą pozycję bez względu na to który przycisk nacisnę.

Przkład jest podobny do tego z tematu jednak tam o tyle wystąpiła pomyłka, że odwołanie było do klasy przypisanej do form, a nie do przycisku submit.

[PHP] pobierz, plaintext 
    jQuery(".do_koszyka_button").click(function(){
    var a = jQuery('#dkfp_product_id',this);
    alert(a.val());
    });
[PHP] pobierz, plaintext 

Powyższe zwróci oczywiście undefined.
W zasadzie tylko ten problem mi pozostał by uruchomić dodawanie do koszyka za pomocą ajaxa.

Ten post edytował hejkumkejkum 30.01.2014, 14:05:12

[phpion]

Spróbuj tak:

[HTML] pobierz, plaintext 
var a = jQuery('#dkfp_product_id', $(this).closest('form'));
[HTML] pobierz, plaintext 

Inna sprawa, że mieszać tu może nadawanie takich samych id elementom. Zamień #dkfp_product_id na .dkfp_product_id (+ zmiana w kodzie HTML). Równie dobrze możesz pobrać całą zawartość formularz (nie pole po polu) i wysłać ją AJAXem. Zrobisz to poprzez:

[HTML] pobierz, plaintext 
$(this).closest('form').serialize()
[HTML] pobierz, plaintext 

To wysyłasz AJAXem jako data.

[hejkumkejkum]

Ok działa zrobiłem tak, lecz miałem problem z serialize(); bo o ile serialize zwraca wszystko ok tak nie wiem w jaki sposób mam wstawić zmienną z serialize do ajaxa w data: gdzie mam też wywołanie funkcji action: "dkfp_dodaj_do_koszykaa".
Zmieniłem również id na class.

[HTML] pobierz, plaintext 
jQuery('.do_koszyka_button').live('click', function(e){
e.preventDefault();
 
var dkfp_qty = jQuery(this).closest('tr').find('.dkfp_qty').val();
var dkfp_product_id = jQuery(this).closest('tr').find('.dkfp_product_id').val();
var wybor_ceny = jQuery(this).closest('tr').find('.wybor_ceny').val();
var dkfp_action = jQuery(this).closest('tr').find('.dkfp_action').val();
 
jQuery.ajax({
type: 'POST',   // Adding Post method
url: MyAjax.ajaxurl, // Including ajax file
data: {
action: "dkfp_dodaj_do_koszykaa",
dkfp_qty: dkfp_qty,
dkfp_product_id: dkfp_product_id,
wybor_ceny: wybor_ceny,
dkfp_action: dkfp_action
}, // Sending data dname to dkfp_dodaj_jedenn function.
success: function(data){ // Show returned data using the function.
[HTML] pobierz, plaintext 

Ten post edytował hejkumkejkum 30.01.2014, 20:48:19

[phpion]

Zamiast tego:

[HTML] pobierz, plaintext 
data: {
action: "dkfp_dodaj_do_koszykaa",
dkfp_qty: dkfp_qty,
dkfp_product_id: dkfp_product_id,
wybor_ceny: wybor_ceny,
dkfp_action: dkfp_action
}
[HTML] pobierz, plaintext 

możesz użyć (już bez { i }):

[HTML] pobierz, plaintext 
data: $(this).closest('form').serialize()
[HTML] pobierz, plaintext 

Nie musisz wówczas wklepywać pole po polu - po prostu przesyłasz cały formularz.