Bladephp: Now with 7+ codeigniter, php, and laravel project 7+ php project From $18/Year From Rs. 1000/Year

How to Dynamic PHP and html form with qty price and total in table using JavaScript calculations

php javascript jquery
How to Dynamic PHP and html form with qty price and total in table using JavaScript calculations

Today, I am starting to write an article about dynamic invoice forms in PHP because we need this type of form in a professional way and it is very beneficial for project study because we can’t know the actual rows.

Next we have seen how to integrate JavaScript/jQuery auto complete to this dynamically added input fields in table.

HTML and PHP code

<table class="table" id="items">
		<th>In Stock</th>
		<th>Batch No.</th>
		<th>Discount %</th>
		<th>Sub Total</th>
		$product_inventory = $this->Constant_model->product_inventory();
		$totalinventory = 0;

		foreach ($product_inventory as $inventory)
			$totalinventory = $totalinventory + $inventory->subTotal;
		<tr  id="item_row_<?=$inventory->id;?>" class="dynamic_row">
			<td><input id="rate<?=$inventory->id;?>"  readonly="" style="width: 75px;" class="form-control rate" type="text" value="<?=$inventory->purchase_price?>" /></td>
			<td><input size="3" class="form-control" type="text" value="<?=$inventory->batch_no?>"></td>
			<td><input size="3" class="form-control datepicker_class" type="text" value="<?=$inventory->expire_date?>"></td>
			<td><input id="qty<?=$inventory->id;?>" style="width: 75px;" class="form-control pcs" type="text" value="<?=$inventory->ordered_qty?>" /></td>
			<td><input  style="width: 75px;" class="form-control discount" type="text" value="<?=$inventory->discount_percentage?>"></td>
			<td><input style="width: 75px;" class="form-control" type="text" value="<?=$inventory->tax?>"></td>
			<td><span class="net_amount"><?=$inventory->subTotal?></span></td>
		<?php }?>
			<td colspan="8">&nbsp;</td>
			<td>Grand Total Price</td>
			<td><span id="total_net"> <?=number_format($totalinventory,2)?></span></td>

JavaScript/jQuery Code

	$(".table").delegate(".dynamic_row input, select", "blur", function() {

	function calamount()
		totalnetamount = 0;
		$("#items").find('.dynamic_row').each(function (i) {
			var $fieldset = $(this);

			var pcs        = ($('.pcs', $fieldset).val());
			var rate       = ($('.rate', $fieldset).val());
			var discount  = ($('.discount', $fieldset).val());

				$('.rate', $fieldset).val('0');
				$('.discount', $fieldset).val('0');
			var grossamount = 0.00;
			var grossamount = parseFloat(pcs*rate).toFixed(2);
			var discountamt = parseFloat((discount/100)*grossamount).toFixed(2);
			var netamount   = parseFloat(grossamount-discountamt).toFixed(2);
			$('.net_amount', $fieldset).html(netamount);

			totalnetamount = parseFloat(totalnetamount) + parseFloat(netamount);


Html code work in comment box

Related Post