jQuery - kad ar roku nomaina vienu vērtību, automātiski mainās cita

[reGative]

Sveiki!

 

Savai pieredzei un zināšanām veidoju internetveikalu. Izmantoju kohana 3.2 un jQuery.

 

Nepieciešama funkcija - kad lietotājs ieraksta vēlamo preču skaitu, "add to cart" linkā uzreiz jānomainās preču skaitam.

 

Links "Add to cart" izskatās šādi :

 

 

<a href="<?=URL::site('products/add_to_cart/'.$product->id.'/'.Security::token())?>">Add To Cart</a>

 

Tātad, gaidu jūsu laipnību, idejas un pseido-kodus. :)

[daGrevis]

HTML:

 

~~~

<input id="product_count" />

~~~

 

JavaScript:

 

~~~

$('#product_count').change(function() {

 

var count;

 

count = parseInt($(this).val(), 10);

 

console.log(count);

 

// Now you have product count as integer.

 

});

~~~

 

Events tiks izsaukts, kad mainīsies vērtība input laukā. Tagad vari dabūtu intedžeru likt kur vēlies.

[reGative]

Nesapratu, ko man likt tajā linkā?

[daGrevis]

To, ko tev tur vajag. Tev tagad ir pieejams preču skaits.

[daGrevis]

> [3:12:29 PM EEST] reGative: un kā to js mainīgo integrēt php kodā?

[malinens]

cilvēki nevar izzīlēt ko tu gribi, ja netiek uzdoti konkrēti jautājumi.

 

ja tev gribās aizsūtīt ievadīto skaitu php skriptam, tad jāizmanto jQuery ajax funkcijas $.ajax, $.get vai $.post tajā vietā, kur ir: "// Now you have product count as integer."

[reGative]

<script>
$('input').change(function() {
var count = parseInt($(this).val(), 10);
console.log(count);
// Now you have product count as integer.
});
$("div.add-to-cart")
.append(
"<a href='<?=URL::site('products/add_to_cart/'.$product->id.'/'.
Security::token())?>"+count+"'>Add To Cart</a>"
);
</script>

 

bet ir viena problēma - skaitļa vietā parādās [object HTMLInputElement].

Ko darīt?

[daGrevis]

Tev tur ar sintaksi izskatās, ka kkas nav gluži kārtībā. Un kā tu domā tas PHP kods tur izpildīsies (ja vien pirms tam neesi parsējis .js failu ar PHP interpretātoru)?

 

`$('#where').append('<a href="/over/the/rainbow">'+count+'</a>');`

[reGative]

Pārtaisīju.

 

<script>
$('#count').change(function() {
var count = parseInt($(this).val(), 10);
console.log(count);

});
$('.add-to-cart').append('<a href="/over/the/rainbow">'+count+'</a>');
</script>

Bet, tur kur mainīgā count vietā jābūt skaitlim, tur ir [object HTMLInputElement]

 

<input type="text" id="count" value="1" /><br />
<div class="add-to-cart"></div>

 

input lauks nekad nav tukšs.

[rATRIJS]

Palasi vairaak par JavaScript asinhronitaati un variable scope'iem.

 

pagaidaam tu neko nesaprotot tikai kopee koda gabalus ar ceriibu, ka kaut kas straadaas - taa programmeet iemaaciities buus gruuti...

 

$("#count").change(function() {
 var count = $(this).val();

 alert(count); // jo tu noteikti nezini kas ir console.log()

 $(".add-to-cart").html(count);
});

Edited June 11, 2012 by rATRIJS

[daGrevis]

http://stackoverflow.com/questions/500431/javascript-variable-scope

http://stackoverflow.com/questions/7779697/javascript-asynchronous-return-value-assignment-with-jquery