I have this function but i have issue with it.
function calc(id)
{
var price = document.getElementById("hidden-output-"+id);
var amount = document.getElementById("input-"+id);
if(price.value=="")
{
price.value = 0;
}
if(b.value=="")
{
amount.value = 1;
}
var total = amount.value * price.value;
document.getElementById("output-"+id).value=total;
}
It's not working and I don't know why I am new to javascript.
This is the HTML and PHP
<?php
foreach($category->fetch_category() as $data){
$id = $data->id;
echo"<tr>";
echo"<td>";
echo"<center>";
echo"<input type=\"hidden\" value=\"$data->id\" />";
echo"<p><strong>".$data->cat_name."</strong></p>";
echo"</center>";
echo"</td>";
echo"<td>";
echo"<center>";
echo"<select>";
foreach($products->fetch_products($id) as $product)
{
$price = $product->price;
echo"<option value = $product->id onclick=\"UpdateRecord($product->id,$data->id)\">$product->p_name</option>";
}
echo"</select>";
echo"</center>";
echo"</td>";
echo"<td>";
echo"<center>";
echo"<input class=\"input-mini\" id=input-$data->id onkeyup=\"calc($data->id)\" type=\"text\" value=\"1\"/>";
echo"<input type=\"hidden\" id=\"$product->id\" value=\"$product->quantity\" />";
echo"</center>";
echo"</td>";
$i = 0;
foreach($products->fetch_products($id) as $pricer){
if ($i==1) break;
echo"<td>";
echo"<center>";
echo("<div id=\"output-$data->id\" ><p>$pricer->price</p></div>");
echo"<input type=\"hidden\" id=\"hidden-output-$data->id\" value=\"$pricer->price\"/>";
echo"</center>";
echo"</td>";
$i++;
}
echo"</tr>";
}
?>
I am triyng to calculate the price of each field amount * price then to SUM all price fields and display result in
<td>Total : <input class="span1" type="text" id="total_calc" readonly="true" /></td>
I also tried these variants :
function calc3(id) {
var price = document.getElementById('hidden-output-'+id);
var numberField = document.getElementById('input-'+id);
numberField.onkeyup = numberField.onpaste = function() {
if(this.value.length == 0) {
document.getElementById('output-'+id).innerHTML = '';
return;
}
var number = parseInt(this.value);
if(isNaN(number)) return;
document.getElementById('output-'+id).innerHTML = number * price;
};
numberField.onkeyup();
};
// This one always return NaN
This is the project : http://tinypic.com/view.php?pic=34473mp&s=5
if(b.value=="")
{
amount.value = 1;
}
What is b.value
in your calc
function. This is not defined
that is why throws error and script is not executed.
In your calc3
function. You need to modify following line
if(isNaN(number)) return;
to number = isNaN(number) ? 0 : number