Här är koden:
HTML
Ett stycke html-kod:
<form id="buyForm" method="post" acti>
<label>Choose quantity</label>
<div>
<a href="#" class="button">(+)increase</a>
<input type="text" id="qty1" name="qty[]"/>
<a href="#" class="button">(-)decrease</a>
</div>
<input type="text" id="cost1" value="50" visibility:hidden;" name="cost[]" />
<input type="text" id="price1" name="price[]" />
</form>
Js
Ett stycke javascript-kod:
// Calculate
function calc(idx) {
var price = parseFloat(document.getElementById("cost"+idx).value)*
parseFloat(document.getElementById("qty"+idx).value);
// alert(idx+":"+price);
document.getElementById("price"+idx).value= isNaN(price)?"0.00":price.toFixed(2);
}
window.onload=function() {
document.getElementsByName("qty[]")[0].onkeyup=function() {calc(1)};
document.getElementsByName("cost[]")[0].onkeyup=function() {calc(1)};
}
//Increase/decrease buttons
$(function() {
$(".button").click(function() {
var $button = $(this);
var oldValue = $button.parent().find("input").val();
if ($button.text() == "+") {
var newVal = parseFloat(oldValue) + 1;
// AJAX save would go here
} else {
// Don't allow decrementing below zero
if (oldValue >= 1) {
var newVal = parseFloat(oldValue) - 1;
// AJAX save would go here
}
}
$button.parent().find("input").val(newVal);
});
});
Här är det på jsfiddle: http://jsfiddle.net/rcheH/5/
Kan någon hjälpa mig med detta?
Tack på förhand!