I want particular cell value when i clicking on it - javascript

<?php
$con = mysql_connect('localhost','root','');
$db = mysql_select_db("demo",$con);
?>
<!doctype html>
<html>
<head>
<title>Demo</title>
<!--JAVASCRIPT -->
<script src="http://code.jquery.com/jquery-1.9.1.min.js" ></script>
<script>
$(document).ready(function(){
$("#myTable td").click(function() {
var column_num = parseInt( $(this).index() ) + 1;
var row_num = parseInt( $(this).parent().index() )+1;
//$("#result").html( "Row_num =" + row_num + " , Column_num ="+ column_num );
alert(row_num);
});
});
</script>
</head>
<body>
<!--<div id="result"> </div>-->
<table id="myTable" border="1" style="border-collapse: collapse;" cellpadding="8">
<tr>
<th>Name</th>
<th>Qty</th>
<th>Amount</th>
<th>Total</th>
</tr>
<?php
$sQ = "select * from tbl_demo";
$eQ = mysql_query($sQ);
while($fQ=mysql_fetch_array($eQ))
{
$name = $fQ['Name'];
$qty = $fQ['Qty'];
$amt = $fQ['Amount'];
//$total
$total = $fQ['Total'];
?>
<tr>
<td><input type="text" name="name" value="<?php echo $name; ?>" onchange="add($qty,$amt)"/> </td>
<td><input type="number" name="name" value="<?php echo $qty; ?>"/></td>
<td><input type="number" name="name" value="<?php echo $amt; ?>"/></td>
<td><input type="number" name="name" value="<?php echo $total; ?>"/></td>
</tr>
<?php
}
?>
<tr>
<td colspan="3" style="padding-left:400px"> Total </td>
<td class="navigateTest"> <input type="number" name="name" value=""/> </td>
</tr>
<tr>
<td colspan="4" class="navigateTest"> <input type="button" name="submit" id="submit" value="Submit"/> </td>
</tr>
</table>
</body>
</html>
Here is my code. I get index value of particular row nd column bt i can not find value of that cell.. I tried to solve that problem bt i can not understand code which i found..which are the different ways for that??
How i get data of particular cell?????
plz redirect me at right direction...

Related

how to do calculations of a php loop of <input> with displaying them in loop of javascript?

Hello I'm here because facing really big problem in displaying the calculations of loop of input tags.
What i mean is that there is 5 rows having input fields and end of each row there is span area to display row calculations individually for each row but i can't do it so
here is the code of page
<!DOCTYPE html>
<html>
<head>
<title>Invoice</title>
<script src="invoice.js"></script>
</head>
<body>
<form action="fppdf.php" method="post" id="myform">
<center>
<table>
<tr>
<td colspan="4">
<table id="myTable">
<tr class="bg">
<th >SI.NO.</th>
<th>Description of Goods</th>
<th>HSN Code</th>
<th>UOM</th>
<th>QTY.</th>
<th>Weight</th>
<th>Rate</th>
<th>Taxable Amount</th>
</tr>
<?php
//$n=$_GET['no'];
for ($i=0; $i < 2; $i++) {
?>
<tr>
<td><?php echo $i; ?></td>
<td><input type="text" id="description" name="description[]"></td>
<td><input type="text" id="hsn" name="hsn[]"></td>
<td><input type="text" id="uom" name="uom[]"></td>
<td><input type="number" id="qty" name="qty[]"></td>
<td><input type="number" id="weight" name="weight[]"></td>
<td><input type="number" id="rate" name="rate[]" ></td>
<td><span id="tax_amt" name="tax_amt[]" ></span></td>
</tr>
<?php } ?>
</table>
</td>
</tr>
<tr>
<td colspan="4">
<table class="ltable">
<tr><td>Total Amount Before Tax :</td><td> <span id="sub"></span></td></tr>
<tr><td>Add CGST : <input type="number" name="cgst" step="0.01" id="9cgst" onblur="taxamt()"> </td><td><span id="cgst9"></span></td></tr>
<tr><td>Add SGST : <input type="number" name="sgst" step="0.01" id="9sgst" > </td><td><span id="sgst9"></span></td></tr>
<tr><td>Tax Amount GST : <span id="gst9"></span> </td><td> <span id="gst18"></span></td></tr>
<tr><td>Total Amount After Tax </td><td> <span id="tot"></span></td></tr>
<tr>
<td><input type="Submit" class="Submit" value="Submit"></td>
<td><a onclick="taxamt()" class="calculate">calculate</a></td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</form>
</body>
</html>
and here is the JS file
//var my = [];
function taxamt() {
// body...
var wt = document.getElementById('weight').value;
var rate = document.getElementById('rate').value;
var qty = document.getElementById('qty').value;
var t =0;
var i =0;
var r =0;
// for(i=0; i < 2;i++){
r =(wt*rate)*qty;
// my.push(r);
document.getElementById("tax_amt").innerHTML = r +"₹";
// t+=r;
// }
document.getElementById("sub").innerHTML = t +"₹" ;
//TAX CALCULATION
var cgst9 = document.getElementById("9cgst").value;
var sgst9 = document.getElementById("9sgst").value;
var gst9 = parseInt(cgst9)+parseInt(sgst9);
var cgst = (t)*parseInt(cgst9)/100;
var sgst = (t)*parseInt(sgst9)/100;
var gst = cgst + sgst;
document.getElementById("cgst9").innerHTML = cgst + " ₹" ;
document.getElementById("sgst9").innerHTML = sgst + " ₹" ;
document.getElementById("gst18").innerHTML = gst + " ₹" ;
document.getElementById("gst9").innerHTML = gst9 + "%";
var tot_gst = t+gst;
document.getElementById("tot").innerHTML = tot_gst+" ₹" ;
}
how can i show the calculations properly on same page as like its output is correct but in other page after i submit the form .

ID are unique, use your php loop to create unique id you'll use in the JS loop :
<?php
for ($i=0; $i < 2; $i++) {
?>
<tr>
<td><?php echo $i; ?></td>
<td><input type="text" id="description<?php echo $i; ?>" name="description[]"></td>
<td><input type="text" id="hsn<?php echo $i; ?>" name="hsn[]"></td>
<td><input type="text" id="uom<?php echo $i; ?>" name="uom[]"></td>
<td><input type="number" id="qty<?php echo $i; ?>" name="qty[]"></td>
<td><input type="number" id="weight<?php echo $i; ?>" name="weight[]"></td>
<td><input type="number" id="rate<?php echo $i; ?>" name="rate[]" ></td>
<td><span id="tax_amt<?php echo $i; ?>" name="tax_amt[]" ></span></td>
</tr>
<?php } ?>
And in the JS :
total=0;
for(i=0; i < 2;i++){
wt = document.getElementById('weight'+i).value;
rate = document.getElementById('rate'+i).value;
qty = document.getElementById('qty'+i).value;
r =(wt*rate)*qty;
total+=r;
document.getElementById('tax_amt'+i).innerHTML = r +'₹';
}
document.getElementById('sub').innerHTML = total +'₹';
It could be cleaner using class and a each loop (see here for a start), but the loop increment version will do the job.

hide and show table row in loop

Table edit button in loop is hiding and showing the first row of table with each edit button click. I need to hide and show each row in loop with its own edit button.
<?php
$counter = 0;
foreach($db->getRecordSet($sqlRecord) as $row){ $counter += 1;
?>
<tr id="rowDetails">
<td> <?php echo($counter); ?> </td>
<td > <?php echo($row['item_code']); ?> </td>
<td > <?php echo($row['item_name']); ?> </td>
<td > <?php echo($row['description']); ?> </td>
<td > <?php echo($row['quantity']); ?> </td>
<td > <?php echo($row['p_cost']); ?> </td>
<td ><input type="button" name="edit" id="edit" value="edit" onClick="hideRow()" /></td>
</td>
</tr>
<tr id="editContent" style="display:none;">
<td class="w10" id="row1"><input type="text" class="form-control" name="item_code" id="item_code" value="<?php echo($row['item_code']); ?>" required="required" /></td>
</tr>
<?php
}
?>
</tr>
<?php } ?>
</table>
-------------------------
function hideRow(){
if(
document.getElementById('editContent').style.display=='none') {
document.getElementById('editContent').style.display='';
document.getElementById('rowDetails').style.display='none';
} else {
document.getElementById('editContent').style.display='none';
document.getElementById('rowDetails').style.display='';
}

try to use jquery bro.
change this line of code:
<td ><input type="button" name="edit" id="edit" value="edit" onClick="hideRow()" /></td>
to :
<td ><input type="button" name="edit" class="hide_button" /></td>
then change :
function hideRow(){
if(
document.getElementById('editContent').style.display=='none') {
document.getElementById('editContent').style.display='';
document.getElementById('rowDetails').style.display='none';
} else {
document.getElementById('editContent').style.display='none';
document.getElementById('rowDetails').style.display='';
}
To:
$( document ).ready(function() {
$(".hide_button").click(function(){
$(this).parents('tr').hide();
});
});

Create Table with Multiple Dynamic Field in PHP

Only I can create a table row but I want to create multiple tables row I get an error.
I think that the error in the query but I do not know how to find a solution
How can I add more than one table?
How do I need to make a change in the query unit?
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL ^ E_NOTICE);
$con=mysql_connect("localhost","root","password");
$table=mysql_select_db("databaseName") or die (mysql_error());
if(isset($_POST['submit']))
{
$count2 = $_POST["hidden"];
for($i=1;$i<=$count2;$i++)
{
$save = mysql_query("CREATE TABLE `".$_POST["dbName"]."`.`".$_POST["TableName"]."` ( `".$_POST["ColonName$i"]."` INT(".$_POST["LengthValues$i"].") NOT NULL COMMENT '".$_POST["Comments$i"]."' ) ENGINE = InnoDB");
}
if($save)
{
echo '<script type="text/javascript">alert("Saved Success !");</script>';
}
else
{
echo '<script type="text/javascript">alert("Failed");</script>';
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>My Multiple Save </title>
</head>
<body>
<center>
<form action="<?php $_SERVER['PHP_SELF']; ?>" method="get"> <!-- Form for generate no of times -->
<table align="center">
<tr>
<th colspan="3" align="center">Order Num Of Rows</th>
</tr>
<tr>
<td>VT ismi</td>
<td><input type="text" name="dbName" /></td>
<td>TabloAd</td>
<td><input type="text" name="TableName" /></td>
<td>No Of</td>
<td><input type="text" name="no" /></td>
<td><input type="submit" name="order" value="Generate" /></td>
</tr>
</table>
</form><!-- End generate Form -->
<!---- Create multiple Save Form,-->
<form action="<?php $_SERVER['PHP_SELF']; ?>" method="post">
<table align="center">
<tr>
<th colspan="3" align="left">Dynamic multiple Save To MySql</th>
</tr>
<tr>
<td>tabloAdi</td>
<td>VT</td>
<td>Colon Name</td>
<td>Leght</td>
<td>Comment</td>
</tr>
<?php
if(isset($_GET['order']))
{
$count = $_GET['no']-1; //get the num of times as numeric
while($i <= $count)// loop by using while(),NOTE the looping dynamic textbox must be under the for loop othet must be outside of while()
{
$i++;
?>
<tr>
<td><input type="hidden" name="TableName" value="<?php echo $_GET["TableName"]; ?>"/></td>
<td><input type="hidden" name="dbName" value="<?php echo $_GET["dbName"]; ?>"/></td>
<td><input type="text" name="ColonName<?php echo $i; ?>" /></td>
<td><input type="text" name="LengthValues<?php echo $i; ?>" /></td>
<td><input type="text" name="Comments<?php echo $i; ?>" /></td>
</tr>
<?php
}}
?>
<tr>
<td colspan="3" align="center">
<input type="hidden" name="hidden" value="<?php echo $i; ?>" /><!-- Get max count of loop -->
<input type="submit" name="submit" value="Save Multiple" /></td>
</tr>
</table>
</form>
</center>
</body>
</html>

How to get PHP echo value in html, so it is the same as other inputs?

i will just present my example, because i dont know how to explain it thurrow.
Here is a html code with javascript, that calculates the numbers between themselves: http://jsbin.com/OJOlARe/1/edit?html,js,output
What i want to do, is replace the "input id="box2" " with the result i get with this code in PHP.
<?php
$url = "https://btc-e.com/api/3/ticker/btc_usd";
$decode = json_decode(file_get_contents($url), true);
$price = $decode["btc_usd"]["last"];
echo $price;
?>
So i will input a value i want in box 1, the box2 will automaticly have the value of "echo $price" and the result will calculate these two between themselves.
Thank you very much for your help and efforts.

It should be something like this if I've understood it correctly.
PHP
<?php
$url = "https://btc-e.com/api/3/ticker/btc_usd";
$decode = json_decode(file_get_contents($url), true);
$price = $decode["btc_usd"]["last"];
echo $price;
?>
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<table width="80%" border="0">
<tr>
<th>Box 1</th>
<th>Box 2</th>
<th>Result</th>
</tr>
<tr>
<td><input id="box1" type="text" oninput="calculate()" /></td>
<td><input id="box2" value="<?php echo($price); ?>" type="text" oninput="calculate()" /></td>
<td><input id="result" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
JavaScript
<script>
function calculate() {
var myBox1 = document.getElementById('box1').value;
var myBox2 = document.getElementById('box2').value;
var result = document.getElementById('result');
var myResult = myBox1 * myBox2;
result.value = myResult;
}
</script>

if you just want to get the value of price just add value . like so
try this.
<td><input id="box2" type="text" oninput="calculate()" value="<?php echo $price; ?>"/></td>

l3aronsansgland's suggestion will work. Rather then using a HTML file, I created a PHP file and placed all of the scripts inside it, as below. I've tested it and it worked fine:
<!DOCTYPE html>
<?php
$url = "https://btc-e.com/api/3/ticker/btc_usd";
$decode = json_decode(file_get_contents($url), true);
$price = $decode["btc_usd"]["last"];
?>
<script>
function calculate() {
var myBox1 = document.getElementById('box1').value;
var myBox2 = document.getElementById('box2').value;
var result = document.getElementById('result');
var myResult = myBox1 * myBox2;
result.value = myResult;
}
</script>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<table width="80%" border="0">
<tr>
<th>Box 1</th>
<th>Box 2</th>
<th>Result</th>
</tr>
<tr>
<td><input id="box1" type="text" oninput="calculate()" /></td>
<td><input id="box2" value="<?php echo($price); ?>" type="text" oninput="calculate()" /></td>
<td><input id="result" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>

i am trying to clone multiple fieldset but after clicking it 3 to 4 times next cloned fieldset remains to 4 and 5 number

i am trying to clone the fieldset as name + 1,2,3 and so on and as well as the inputs id but after cloning one pair of worker compensation fieldset when i click on another fieldset type it gives its input id after the previous cloned fieldset like 4 5 6 as id. i am a novice programmer so plz help me.attached image to understand more and reply me if there is problem.
<script type="text/javascript">
function cloneit(a,b)
{
var fieldset = a;
var fi_class = b;
//alert(fi_class);
var count = fi_class.split(/woc_class1/g).length - 1;
alert(count);
if(count == 1)
{
var newNum = new Number(1);
}
else
{
var num = $('.cloned').length;
var newNum = new Number(num + 1);
}
var newElem = $(fieldset).clone().attr('id', fieldset + newNum).addClass('cloned');
$(newElem).css('margin-top','20px');
//set all div id's and the input id's
newElem.children('div').each(function(i) {
this.id = 'input' + (newNum * 5 + i);
});
newElem.find('input').each(function() {
this.id = this.id + newNum;
this.name = this.name + newNum;
});
if (num > 0) {
$('.cloned:last').after(newElem);
} else {
$(fieldset).after(newElem);
}
$('#delete').removeAttr('disabled');
if (newNum == 5) $('#add').attr('disabled', 'disabled');
}
function remclone()
{
$('.cloned:last').remove();
$('#add').removeAttr('disabled');
if ($('.cloned').length == 0) {
$('#delete').attr('disabled', 'disabled');
}
}
</script>
Screenshot
here is the html for it
<fieldset id="woc_fieldset">
<legend>Worker Compensation</legend>
<table border="0">
<tr>
<td>Carier </td>
<td><input type="text" name="worker_compensation_carrier" id="worker_compensation_carrier" value="<?php echo $a->worker_compensation_carrier; ?>" required="required"/></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" name="worker_compensation_phone" id="worker_compensation_phone" class="phone" value="<?php echo $a->worker_compensation_phone; ?>" required="required"/></td>
</tr>
<tr>
<td>Premium</td>
<td><input type="text" name="worker_compensation_premium" id="worker_compensation_premium" value="<?php echo $a->worker_compensation_premium; ?>" required="required"/></td>
</tr>
<tr>
<td>Renewal Date</td>
<td><input type="text" name="worker_compensation_renewal_date" id="worker_compensation_renewal_date" value="<?php echo $a->worker_compensation_renewal_date; ?>" required="required"/></td>
</tr>
</table>
<button type="button" id="delete" onclick="remclone();">Delete</button>
</fieldset>
<button type="button" id="add" onclick="cloneit('#woc_fieldset');">Add</button>
<fieldset id="two">
<legend>General Liability</legend>
<table border="0">
<tr>
<td>Carier</td>
<td><input type="text" name="general_liability_carrier" id="general_liability_carrier" value="<?php echo $b->general_liability_carrier; ?>" required="required"/></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" name="general_liability_phone" id="general_liability_phone" value="<?php echo $b->general_liability_phone; ?>" required="required"/></td>
</tr>
<tr>
<td>Premium</td>
<td><input type="text" name="general_liability_premium" id="general_liability_premium" value="<?php echo $b->general_liability_premium; ?>" required="required"/></td>
</tr>
<tr>
<td>Renewal Date</td>
<td><input type="text" name="general_liability_renewal_date" id="general_liability_renewal_date" value="<?php echo $b->general_liability_renewal_date; ?>" required="required" /></td>
</tr>
</table>
</fieldset>
<fieldset id="three">
<legend>Group Health</legend>
<table border="0">
<tr>
<td>Carier</td>
<td><input type="text" name="group_health_carrier" id="group_health_carrier" value="<?php echo $c->group_health_carrier; ?>" required="required"/></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" name="group_health_phone" id="group_health_phone" value="<?php echo $c->group_health_phone; ?>" required="required" /></td>
</tr>
<tr>
<td>Premium</td>
<td><input type="text" name="group_health_premium" id="group_health_premium" value="<?php echo $c->group_health_premium; ?>" required="required"/></td>
</tr>
<tr>
<td>Renewal Date</td>
<td><input type="text" name="group_health_renewal_date" id="group_health_renewal_date" value="<?php echo $c->group_health_renewal_date; ?>" required="required"/></td>
</tr>
</table>
</fieldset>
<fieldset id="four">
<legend>Property</legend>
<table border="0">
<tr>
<td>Carier</td>
<td><input type="text" name="property_carrier" id="property_carrier" value="<?php echo $d->property_carrier; ?>" required="required"/></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" name="property_phone" id="property_phone" value="<?php echo $d->property_phone; ?>" required="required"/></td>
</tr>
<tr>
<td>Premium</td>
<td><input type="text" name="property_premium" id="property_premium" value="<?php echo $d->property_premium; ?>" required="required"/></td>
</tr>
<tr>
<td>Renewal Date</td>
<td><input type="text" name="property_renewal_date" id="property_renewal_date" value="<?php echo $d->property_renewal_date; ?>" required="required"/></td>
</tr>
</table>
</fieldset>
<fieldset id="five">
<legend>Commercial Auto</legend>
<table border="0">
<tr>
<td>Carier</td>
<td><input type="text" name="commercial_auto_carrier" id="commercial_auto_carrier" value="<?php echo $e->commercial_auto_carrier; ?>" required="required"/></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" name="commercial_auto_phone" id="commercial_auto_phone" value="<?php echo $e->commercial_auto_phone; ?>" required="required" /></td>
</tr>
<tr>
<td>Premium</td>
<td><input type="text" name="commercial_auto_premium" id="commercial_auto_premium" value="<?php echo $e->commercial_auto_premium; ?>" required="required" /></td>
</tr>
<tr>
<td>Renewal Date</td>
<td><input type="text" name="commercial_auto_renewal_date" id="commercial_auto_renewal_date" value="<?php echo $e->commercial_auto_renewal_date; ?>" required="required" /></td>
</tr>
</table>
</fieldset>

function cloneit(a,b)
{
var fieldset = a;
var fi_class = b;
alert(fi_class);
var num = $('.'+fi_class).length;
alert(num);
var newNum = new Number((num - 1) +1);
var newElem = $(fieldset).clone().attr('id', fieldset + newNum);
$(newElem).css('margin-top','20px');
//set all div id's and the input id's
newElem.children('div').each(function(i) {
this.id = 'input' + (newNum * 5 + i);
});
newElem.find('input').each(function() {
this.id = this.id + newNum;
this.name = this.name + newNum;
});
if (num > 0) {
$('.'+fi_class+':last').after(newElem);
} else {
$(fieldset).after(newElem);
}
$('#delete').removeAttr('disabled');
if (newNum == 5) $('#add').attr('disabled', 'disabled');
}
function remclone()
{
$('.'+fi_class+':last').remove();
$('#add').removeAttr('disabled');
if ($('.cloned').length == 0) {
$('#delete').attr('disabled', 'disabled');
}
}

Categories