I want to change my PHP table line to "form" by OnClick method, It's working properly using simple HTML line text or PHP line. But not working when adding a whole form
<button type="button" onclick='document.getElementById("<?php echo $row["id"]; ?>").innerHTML = "
<form name="form" method="post" action="">
<input type="hidden" name="new" value="1" />
<input name="id" type="hidden" value="<?php echo $row['id'];?>" />
<p><input type="text" name="name" required value="<?php echo $row['name'];?>" /></p>
<p><input type="text" name="age" required value="<?php echo $row['age'];?>" /></p>
<p><input name="submit" type="submit" value="UPDATE" /></p>
</form>"'>EDIT</button>
This is in PHP while loop repeating multiple time
working perfectly by adding \ after the "quotes
while($row = mysqli_fetch_assoc($result)) { ?>
<tr id="<?php echo $row["id"]; ?>">
<td align="center"><?php echo $row["id"]; ?></td>
<td align="center"><?php echo $row["name"]; ?></td>
<td align="center"><?php echo $row["age"]; ?></td>
<td align="center">
<button type="button" onclick='document.getElementById("<?php echo $row["id"]; ?>").innerHTML = "<fo1rm name=\"form\" method=\"post\" action=\"Dashboard.php\"><input type=\"hidden\" name=\"update\" value=\"1\" /><input name=\"id\" type=\"hidden\" value=\"<?php echo $row['id'];?>\" /><td align=\"center\"><?php echo $row['id']; ?></td><td align=\"center\"><input type=\"text\" name=\"name\" required value=\"<?php echo $row['name'];?>\" /></td><td align=\"center\"><input type=\"text\" name=\"age\" required value=\"<?php echo $row['age'];?>\" /></td><input name=\"submit\" type=\"submit\" value=\"UPDATE\" /></form><td align=\"center\">Delete</td>"'>EDIT</button>
</td>
<td align="center">Delete</td>
</tr>
<?php //$count++;
} ?>
BUT ERROR in inspecting at "FORM TAG"
<tr id="14">
<form name="form" method="post" action></form>
<input type="hidden" name="update" value="1">
<input name="id" type="hidden"value="14">
<td align="center">14</td>
<td align="center">
<input type="text" name="name" required="" value="vachinde">
</td>
<td align="center">
<input type="text" name="age" required="" value="98">
</td>
<input name="submit" type="submit" value="UPDATE">
<td align="center">
Delete
</td></tr>
form tag closing should be at end
You know, that your mixing client side logic (JS) and server side (PHP) things? Your code renders somethin like this and sends this finally static result html to the client:
Dataexample:
$row['id'] = '0815';
$row['name'] = 'Foo';
$row['age'] = '99';
<button type="button" onclick='document.getElementById("0815").innerHTML = "
<form name="form" method="post" action="">
<input type="hidden" name="new" value="1" />
<input name="id" type="hidden" value="0815" />
<p><input type="text" name="name" required value="Foo" /></p>
<p><input type="text" name="age" required value="99" /></p>
<p><input name="submit" type="submit" value="UPDATE" /></p>
</form>"'>EDIT</button>
Whenever you click at the button, you epect a form in the element with id '0185'. BUT: look at the quotation marks! innerHTML starts with <"> and ends with <'>. Addtionally you have to escape all of your <'> in the onclick-content.
I think, you'll have an easier job, if you call an custom javascript function, that builds or fills the form for you. Your button-onclick could look like this:
<button type="button" onclick="renderForm('<?=$row['id']?>', '<?=$row['name']?>', '<?=$row['age']?>')">EDIT</button>
The function renderForm would do this (optimizable, using js-template-strings):
let renderForm = function(id, name, age) {
document.querySelector('#' + id).innerHTML = `<form name="form" method="post" action="">
<input type="hidden" name="new" value="1" />
<input name="id" type="hidden" value="${id}" />
<p><input type="text" name="name" required value="${name}" /></p>
<p><input type="text" name="age" required value="${age}" /></p>
<p><input name="submit" type="submit" value="UPDATE" /></p>
</form>`;
}
Without knowing the context ;-)
Allowed childs of <tr> are <th> and <td> only (https://www.w3.org/TR/html4/struct/tables.html#edef-TR). That's why you get such an render result failure by your js-engine in the browser. I now realized, that you want an editable row, right? Escuse this, but this requires skills, that you might don't have right know.
In your case you could change your code like this (untested and it is still just an really simple example). Please avoid using it in production, especially the innerHTML-stuff is not good:
<form name="form" method="post" action="Dashboard.php">
<table>
<tr>
<td align="center" data-field="id"><?php echo $row["id"]; ?></td>
<td align="center" data-field="name"><?php echo $row["name"]; ?></td>
<td align="center" data-field="age"><?php echo $row["age"]; ?></td>
<td align="center">
<button type="button" onclick="edit(this)">Edit</button>
</td>
</tr>
</table>
</form>
<script type="text/javascript">
function edit(button) {
let sendData = button.innerText != 'Edit';
if (!sendData) {
this.closest('form').submit();
return;
}
button.innerText = 'Save';
let tr = this.closest('tr);
let fields = tr.querySelectorAll('[data-field]');
[].forEach.call(fields, field => {
let value = field.innerText;
field.innerHTML = `<input type="text" name="${field.dataset.field}" value="${value}" />`;
});
}
</script>
I hope you found enough pattern and ideas to teach yourself and to read tutorials, that bring up more skills in JS. A js-framework might be helpfull to build the solution you want.
Its Working by changing id from < tr > to < td >tag
i don't why
while($row = mysqli_fetch_assoc($result)) { ?>
<tr >
<td align="center"><?php echo $row["id"]; ?></td>
<td align="center"><?php echo $row["name"]; ?></td>
<td align="center"><?php echo $row["age"]; ?></td>
<td align="center" id="<?php echo $row["id"]; ?>">
<button type="button" onclick='document.getElementById("<?php echo $row["id"]; ?>").innerHTML = "<form name=\"form\" method=\"post\" action=\"Dashboard.php\"><input type=\"hidden\" name=\"update\" value=\"1\" /><input name=\"id\" type=\"hidden\" value=\"<?php echo $row['id'];?>\" /><input name=\"lang\" type=\"hidden\" value=\"<?php echo $lang;?>\" /><td align=\"center\"><?php echo $row['id']; ?></td><td align=\"center\"><input type=\"text\" name=\"name\" required value=\"<?php echo $row['name'];?>\" /></td><td align=\"center\"><input type=\"text\" name=\"age\" required value=\"<?php echo $row['age'];?>\" /></td><input name=\"submit\" type=\"submit\" value=\"UPDATE\" /></form>"'>Click Me!</button>
</td>
<td align="center">X</td>
</tr>
<?php
} ?>
Working in < td > tag but not in < tr > tag
Output -->
<td align="center" id="14"><form name="form" method="post" action="Dashboard.php"><input type="hidden" name="update" value="1"><input name="id" type="hidden" value="14"><input name="lang" type="hidden" value="telugu">14<input type="text" name="name" required="" value="vachinde"><input type="text" name="age" required="" value="98"><input name="submit" type="submit" value="UPDATE"></form></td>
Error in form if using < tr > tag
while($row = mysqli_fetch_assoc($result)) { ?>
<tr id="<?php echo $row["id"]; ?>">
<td align="center"><?php echo $row["id"]; ?></td>
<td align="center"><?php echo $row["name"]; ?></td>
<td align="center"><?php echo $row["age"]; ?></td>
<td align="center">
<button type="button" onclick='document.getElementById("<?php echo $row["id"]; ?>").innerHTML = "<form name=\"form\" method=\"post\" action=\"Dashboard.php\"><input type=\"hidden\" name=\"update\" value=\"1\" /><input name=\"id\" type=\"hidden\" value=\"<?php echo $row['id'];?>\" /><input name=\"lang\" type=\"hidden\" value=\"<?php echo $lang;?>\" /><td align=\"center\"><?php echo $row['id']; ?></td><td align=\"center\"><input type=\"text\" name=\"name\" required value=\"<?php echo $row['name'];?>\" /></td><td align=\"center\"><input type=\"text\" name=\"age\" required value=\"<?php echo $row['age'];?>\" /></td><input name=\"submit\" type=\"submit\" value=\"UPDATE\" /></form>"'>Click Me!</button>
</td>
<td align="center">Delete</td>
</tr>
<?php //$count++;
} ?>
Output -->
<tr>
<form name="form" method="post" action="Dashboard.php"></form><input type="hidden" name="update" value="1"><input name="id" type="hidden" value="14"><input name="lang" type="hidden" value="telugu">14<input type="text" name="name" required="" value="vachinde updated"><input type="text" name="age" required="" value="98"><input name="submit" type="submit" value="UPDATE">
</tr>
See form closing tag < / form > excluded all input
Related
I have a form that the user can add additional lines (using javaScript) but when the save button is clicked, how to I grab the new data to assign to a variable?
What's happening now: The user adds new rows, clicks save and the rows disappear from the page along with the data.
Here is my html:
<table id="desc_table" class="form">
<tbody id="desc_tbody">
<tr id="headings">
<td><font><h3>Description</h3></font></td>
<td><font><h3>Hours</h3></font></td>
<td><font><h3>Rate</h3></font></td>
<td><font><h3>Amount</h3></font></td>
<td></td>
</tr>
<tr>
<td><input name="desc1" type="text" value="<?php echo $desc1; ?>"></td>
<td> <input name="desc_hr1" type="text" value="<?php echo $desc_hr1; ?>"></td>
<td> <input name="desc_rt1" type="text" value="<?php echo $desc_rt1; ?>"></td>
<td><input name="desc_amt1" type="text" value="<?php echo $desc_amt1; ?>"></td>
<td><input type="button" value="X" name="delete" class="btnDelete" onclick="deleteLine(this)"></td>
</tr>
<tr>
<td><input name="desc2" type="text" value="<?php echo $desc2; ?>"></td>
<td> <input name="desc_hr2" type="text" value="<?php echo $desc_hr2; ?>"></td>
<td> <input name="desc_rt2" type="text" value="<?php echo $desc_rt2; ?>"></td>
<td><input name="desc_amt2" type="text" value="<?php echo $desc_amt2; ?>"></td>
<td><input type="button" value="X" name="delete" class="btnDelete" onclick="deleteLine(this)"></td>
</tr>
<tr>
<td><input name="desc3" type="text" value="<?php echo $desc3; ?>"></td>
<td> <input name="desc_hr3" type="text" value="<?php echo $desc_hr3; ?>"></td>
<td> <input name="desc_rt3" type="text" value="<?php echo $desc_rt3; ?>"></td>
<td><input name="desc_amt3" type="text" value="<?php echo $desc_amt3; ?>"></td>
<td><input type="button" value="X" name="delete" class="btnDelete" onclick="deleteLine(this)"></td>
</tr>
</tbody>
</table>
<div>
<center><input type="button" value="Add New Line" id="add_btn" name="add_btn" onclick="newLine()"></center>
</div>
JavaScript:
function newLine(){
//get the total amount of rows in the table
var $rowcount = $('#desc_table tr').length;
//add the row number to the field name to make it unique
var $desc = "desc" + $rowcount;
var $desc_hr = "desc_hr" + $rowcount;
var $desc_rt = "desc_rt" + $rowcount;
var $desc_amt = "desc_amt" + $rowcount;
//create new row data
var $newRowData = '<tr><td><input name=' + $desc + ' type=text></td><td><input name=' + $desc_hr + ' type=text></td><td><input name=' + $desc_rt + ' type=text></td><td><input name=' +$desc_amt+ ' type=text></td><td><input type="button" value="X" name="delete" class="btnDelete" onclick="deleteLine(this)"></td></tr>';
//append new row to bottom of the table
$($newRowData).appendTo($("#desc_table tbody"));
}
PHP variable declaration:
...
if (!empty($_POST['desc1'])){
$desc1 = $_POST['desc1'];
}
else{
$desc1 = NULL;
}
if (!empty($_POST['desc_hr1'])){
$desc_hr1 = $_POST['desc_hr1'];
}
else{
$desc_hr1 = NULL;
}
if (!empty($_POST['desc_rt1'])){
$desc_rt1 = $_POST['desc_rt1'];
}
else{
$desc_rt1 = NULL;
}
if (!empty($_POST['desc_amt1'])){
$desc_amt1 = $_POST['desc_amt1'];
}
else{
$desc_amt1 = NULL;
}
if (!empty($_POST['desc2'])){
$desc2 = $_POST['desc2'];
}
else{
$desc2 = NULL;
}
if (!empty($_POST['desc_hr2'])){
$desc_hr2 = $_POST['desc_hr2'];
}
...
When the page variables are captured with the POST, how do I find the new row variables to declare them and capture the data?
Use array-style names rather than incrementing the suffix on each row:
<tr>
<td><input name="desc[]" type="text" value="<?php echo $desc; ?>"></td>
<td> <input name="desc_hr[]" type="text" value="<?php echo $desc_hr; ?>"></td>
<td> <input name="desc_rt[]" type="text" value="<?php echo $desc_rt; ?>"></td>
<td><input name="desc_amt[]" type="text" value="<?php echo $desc_amt; ?>"></td>
<td><input type="button" value="X" name="delete" class="btnDelete" onclick="deleteLine(this)"></td>
</tr>
PHP will then put all the inputs into arrays, and you can loop through them.
foreach ($_POST['desc'] AS $i => $desc) {
$desc_hr = $_POST['desc_hr'][$i];
$desc_rt = $_POST['desc_rt'][$i];
$desc_amt = $_POST['desc_amt'][$i];
...
}
Put in a hidden input and then set its value to the amount of rows shown by default. When you add or delete a row update the value using JavaScript. When submitted you can then use this value in a loop.
However, the easiest and most appropriate solution would be just to use form arrays. For example, why not call each input name as "desc[]"? Then use the array index to figure out where/amount of rows etc. You could have 1 or 1000 inputs named that...
Hi i am working in a small eCommerce site right now, i am using payumoney as my gateway, i got test credentials to test my code with the gateway.
My question is, how to pass the values that i got through PHP session function to my HTML form.
The code i got in hand is working perfectly, but it is asking for the credentials from the user side. But i already got values for all the elements inside the form, so please help me to integrate the values from PHP variables to the HTML form.
<?php
$MERCHANT_KEY = "<merchant key here>";
$SALT = "<salt goes here>";
$PAYU_BASE_URL = "<Base URL here>";
$action = '';
$posted = array();
if(!empty($_POST)) {
//print_r($_POST);
foreach($_POST as $key => $value) {
$posted[$key] = $value;
}
}
$formError = 0;
if(empty($posted['txnid'])) {
// Generate random transaction id
$txnid = substr(hash('sha256', mt_rand() . microtime()), 0, 20);
} else {
$txnid = $posted['txnid'];
}
$hash = '';
// Hash Sequence
$hashSequence = "key|txnid|amount|productinfo|firstname|email|udf1|udf2|udf3|udf4|udf5|udf6|udf7|udf8|udf9|udf10";
if(empty($posted['hash']) && sizeof($posted) > 0) {
if(
empty($posted['key'])
|| empty($posted['txnid'])
|| empty($posted['amount'])
|| empty($posted['firstname'])
|| empty($posted['email'])
|| empty($posted['phone'])
|| empty($posted['productinfo'])
|| empty($posted['surl'])
|| empty($posted['furl'])
|| empty($posted['service_provider'])
) {
$formError = 1;
} else {
//$posted['productinfo'] = json_encode(json_decode('[{"name":"tutionfee","description":"","value":"500","isRequired":"false"},{"name":"developmentfee","description":"monthly tution fee","value":"1500","isRequired":"false"}]'));
$hashVarsSeq = explode('|', $hashSequence);
$hash_string = '';
foreach($hashVarsSeq as $hash_var) {
$hash_string .= isset($posted[$hash_var]) ? $posted[$hash_var] : '';
$hash_string .= '|';
}
$hash_string .= $SALT;
$hash = strtolower(hash('sha512', $hash_string));
$action = $PAYU_BASE_URL . '/_payment';
}
} elseif(!empty($posted['hash'])) {
$hash = $posted['hash'];
$action = $PAYU_BASE_URL . '/_payment';
}
?>
<html>
<head>
<script>
var hash = '<?php echo $hash ?>';
function submitPayuForm() {
if(hash == '') {
return;
}
var payuForm = document.forms.payuForm;
payuForm.submit();
}
</script>
</head>
<body onload="submitPayuForm()">
<h2>PayU Form</h2>
<br/>
<?php if($formError) { ?>
<span style="color:red">Please fill all mandatory fields.</span>
<br/>
<br/>
<?php } ?>
<form action="<?php echo $action; ?>" method="post" name="payuForm">
<input type="hidden" name="key" value="<?php echo $MERCHANT_KEY ?>" />
<input type="hidden" name="hash" value="<?php echo $hash ?>"/>
<input type="hidden" name="txnid" value="<?php echo $txnid ?>" />
<table>
<tr>
<td><b>Mandatory Parameters</b></td>
</tr>
<tr>
<td>Amount: </td>
<td><input name="amount" value="<?php echo (empty($posted['amount'])) ? '' : $posted['amount'] ?>" /></td>
<td>First Name: </td>
<td><input name="firstname" id="firstname" value="<?php echo (empty($posted['firstname'])) ? '' : $posted['firstname']; ?>" /></td>
</tr>
<tr>
<td>Email: </td>
<td><input name="email" id="email" value="<?php echo (empty($posted['email'])) ? '' : $posted['email']; ?>" /></td>
<td>Phone: </td>
<td><input name="phone" value="<?php echo (empty($posted['phone'])) ? '' : $posted['phone']; ?>" /></td>
</tr>
<tr>
<td>Product Info: </td>
<td colspan="3"><textarea name="productinfo"><?php echo (empty($posted['productinfo'])) ? '' : $posted['productinfo'] ?></textarea></td>
</tr>
<tr>
<td>Success URI: </td>
<td colspan="3"><input name="surl" value="<?php echo (empty($posted['surl'])) ? '' : $posted['surl'] ?>" size="64" /></td>
</tr>
<tr>
<td>Failure URI: </td>
<td colspan="3"><input name="furl" value="<?php echo (empty($posted['furl'])) ? '' : $posted['furl'] ?>" size="64" /></td>
</tr>
<tr>
<td colspan="3"><input type="hidden" name="service_provider" value="payu_paisa" size="64" /></td>
</tr>
<tr>
<td><b>Optional Parameters</b></td>
</tr>
<tr>
<td>Last Name: </td>
<td><input name="lastname" id="lastname" value="<?php echo (empty($posted['lastname'])) ? '' : $posted['lastname']; ?>" /></td>
<td>Cancel URI: </td>
<td><input name="curl" value="" /></td>
</tr>
<tr>
<td>Address1: </td>
<td><input name="address1" value="<?php echo (empty($posted['address1'])) ? '' : $posted['address1']; ?>" /></td>
<td>Address2: </td>
<td><input name="address2" value="<?php echo (empty($posted['address2'])) ? '' : $posted['address2']; ?>" /></td>
</tr>
<tr>
<td>City: </td>
<td><input name="city" value="<?php echo (empty($posted['city'])) ? '' : $posted['city']; ?>" /></td>
<td>State: </td>
<td><input name="state" value="<?php echo (empty($posted['state'])) ? '' : $posted['state']; ?>" /></td>
</tr>
<tr>
<td>Country: </td>
<td><input name="country" value="<?php echo (empty($posted['country'])) ? '' : $posted['country']; ?>" /></td>
<td>Zipcode: </td>
<td><input name="zipcode" value="<?php echo (empty($posted['zipcode'])) ? '' : $posted['zipcode']; ?>" /></td>
</tr>
<tr>
<td>UDF1: </td>
<td><input name="udf1" value="<?php echo (empty($posted['udf1'])) ? '' : $posted['udf1']; ?>" /></td>
<td>UDF2: </td>
<td><input name="udf2" value="<?php echo (empty($posted['udf2'])) ? '' : $posted['udf2']; ?>" /></td>
</tr>
<tr>
<td>UDF3: </td>
<td><input name="udf3" value="<?php echo (empty($posted['udf3'])) ? '' : $posted['udf3']; ?>" /></td>
<td>UDF4: </td>
<td><input name="udf4" value="<?php echo (empty($posted['udf4'])) ? '' : $posted['udf4']; ?>" /></td>
</tr>
<tr>
<td>UDF5: </td>
<td><input name="udf5" value="<?php echo (empty($posted['udf5'])) ? '' : $posted['udf5']; ?>" /></td>
<td>PG: </td>
<td><input name="pg" value="<?php echo (empty($posted['pg'])) ? '' : $posted['pg']; ?>" /></td>
</tr>
<tr>
<?php if(!$hash) { ?>
<td colspan="4"><input type="submit" value="Submit" /></td>
<?php } ?>
</tr>
</table>
</form>
</body>
</html>
I dont want to get the values for the element from the user. For example (firstname, phone,....)
since i already got values from another php file and save it as $name, $phone,...
Thank You.
In my project I need to make the subtotal of the line (quantite*montant) dynamicali.
For the moment I have there:
I want the montant total it is auto make 1*110 for example and it is directly displayed.
My code :
<div id="contenu">
<h2>Renseigner ma fiche de frais du mois <?php echo $numMois."-".$numAnnee ?></h2>
<form method="POST" action="index.php?uc=gererFrais&action=validerMajFraisForfait">
<div class="corpsForm">
<fieldset>
<legend>Eléments forfaitisés
</legend>
<table width=100%>
<tr>
<td>Libelle</td>
<td>Nombre</td>
<td>Montant unitaire</td>
<td>Montant total</td>
</tr>
<?php
foreach ($lesFraisForfait as $unFrais)
{
$idFrais = $unFrais['idfrais'];
$libelle = $unFrais['libelle'];
$quantite = $unFrais['quantite'];
$montant = $unFrais['montant'];
?>
<tr>
<td><?php echo $libelle ?></td>
<td><input type="number" id="idFrais" name="lesFrais[<?php echo $idFrais?>]" size="10" min="0" autocomplete="off" maxlength="5" value="<?php echo $quantite?>" onkeyup="calculer()">
<td><input type="text" id="montant" value="<?php echo $montant ?>" disabled></td>
</tr>
<?php
}
?>
</table>
</fieldset>
</div>
<div class="piedForm">
<p>
<input id="ok" type="submit" value="Valider" size="20" />
<input id="annuler" type="reset" value="Effacer" size="20" />
</p>
</div>
</form>
Here I added another Answer for you.
So basically in your FOREACH Loop you have to create INCREMENTAL VARIABLE
<?php
$incr = 1;
foreach ($lesFraisForfait as $unFrais)
{
$idFrais = $unFrais['idfrais'];
$libelle = $unFrais['libelle'];
$quantite = $unFrais['quantite'];
$montant = $unFrais['montant'];
?>
<tr>
<td><?php echo $libelle ?></td>
<td><input type="number" id="<?php echo 'idFrais'.$incr; ?>" size="10" min="0" autocomplete="off" maxlength="5" value="<?php echo $quantite?>" onkeyup="calculer(this)">
<td><input type="text" id="<?php echo 'montant'.$incr; ?>" value="<?php echo $montant ?>" disabled></td>
<td id='subtotal<?php echo $incr;?>'><?php echo $quantite*$montant; ?></td>
</tr>
<?php
$incr ++;
}
?>
Since you already have ONKEYUP='calculer' on your javascript code this below.
function calculer( e ){
var i = e.getAttribute('id').length;
var input_identifier = e.getAttribute('id').substring(i-1,i);
var subtotal = document.getElementById('subtotal'+input_identifier)
var quantity = e.value;
var montant = document.getElementById('montant'+input_identifier);
subtotal.textContent = parseInt(quantity) + parseInt(montant.value);
return;
}
This should work.
please add td for total :
<tr>
<td><?php echo $libelle ?></td>
<td><input type="number" id="idFrais" name="lesFrais[<?php echo $idFrais?>]" size="10" min="0" autocomplete="off" maxlength="5" value="<?php echo $quantite?>" onkeyup="calculer()">
<td><input type="text" id="montant" value="<?php echo $montant ?>" disabled></td>
<td><input type="text" value="<?php echo ($montant*$quantite) ?>" disabled></td>
</tr>
You just have to add the following 4th TD.
<td><?php echo $quantite*$montant; ?></td>
That should work.
Please help me. I have a php file that will be called by post method of jQuery. The html elements from this php file cannot be accessible in jquery.
Here comes my code snippet.
In query:
var getFinishOptions = $.post("ajax_finish_options.php",
{ event_id: event_name},
function(data)
{
$("#TimeToFinish").append(data);
}
);
HTML:
<div id="TimeToFinish"> </div>
PHP:
<tr style="width: 100%">
<th style="width: 100%" colspan="2"><?php echo $FinishCategory[0]; ?> </th>
<th style="width: 100%" colspan="3"><?php echo $FinishCategory[1]; ?> </th>
<th style="width: 100%" colspan="3"><?php echo $FinishCategory[2]; ?> </th>
</tr>
<tr>
<td> Option 1 </td>
<td> Option 2 </td>
<td> Option 1 </td>
<td> Option 2 </td>
<td> Option 3 </td>
<td> Option 1 </td>
<td> Option 2 </td>
<td> Option 3 </td>
</tr>
<tr>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[0]][$event_id][0]; ?>" /> <?php echo $FinishOption[$FinishCategory[0]][$event_id][0]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[0]][$event_id][1]; ?>" /> <?php echo $FinishOption[$FinishCategory[0]][$event_id][1]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][0]; ?>" /> <?php echo $FinishOption[$FinishCategory[1]][$event_id][0]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][1]; ?>" /> <?php echo $FinishOption[$FinishCategory[1]][$event_id][1]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[1]][$event_id][2]; ?>" /> <?php echo $FinishOption[$FinishCategory[1]][$event_id][2]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][0]; ?>" /> <?php echo $FinishOption[$FinishCategory[2]][$event_id][0]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][1]; ?>" /> <?php echo $FinishOption[$FinishCategory[2]][$event_id][1]; ?> </td>
<td> <input type="radio" class="FinishOptions" name="FinishOptions" value="<?php echo $FinishOption[$FinishCategory[2]][$event_id][2]; ?>" /> <?php echo $FinishOption[$FinishCategory[2]][$event_id][2]; ?> </td>
</tr>
Final piece of jquery:
$("input[type=radio][name=FinishOptions]").click(function() {
alert($(this).val());
});
All i want is, to get the value of any of one checked radio button.
Please give your valuable comment.
The reason why you cant get the values is that, upon your final piece of jquery, upon execution, you are binding and element which does not yet exist (remember, the radio buttons inside the table are loaded dynamically, thru your ajax call).
Therefore, it will not work. You must use .on() in order to catch that after it has been loaded. (its like .live())
Consider this example:
// change the final piece of jquery
$('#TimeToFinish').on('click', 'input[type="radio"][name="FinishOptions"]', function() {
var value = $(this).val();
alert(value);
});
I want to sum table rows dynamically as the user inputs values. Since the number of rows can vary I want to use a php loop to accomplish this. I'm having problems getting the loop to work correctly. If, for example, there are two individual rows to sum only the bottom row will be summed.
<script type="text/javascript">
var sumScoreF = function(a) {
var rowtotal = 0;
n = new Array();
for (i = 1; i <= 3; i++) {
if (parseInt(document.getElementById(a + i).value) > 0) {
n[i] = parseInt(document.getElementById(a + i).value);
rowtotal += n[i];
}
}
document.getElementById(a + 'total').value = rowtotal;
};
</script>
The following is an example of a single row sum. The total column continues to be summed as values are entered. This is a nice effect but not necessary.
<table>
<tr>
<td>col1</td>
<td>col2</td>
<td>col3</td>
<td>total</td>
</tr>
<tr>
<td>
<input name="p1g1" id="p1g1" type="text" value="" onChange="sumScoreF('p1g')" />
</td>
<td>
<input name="p1g2" id="p1g2" type="text" value="" onChange="sumScoreF('p1g')" />
</td>
<td>
<input name="p1g3" id="p1g3" type="text" value="" onChange="sumScoreF('p1g')" />
</td>
<td>
<input name="p1gtotal" id="p1gtotal" type="text" value="" />
</td>
</tr>
</table>
Here is my attempt at looping additional rows using php and javascript. The first row will not sum but the second row will. I think the problem is with the javascript variable "m" in that it goes directly to the last row but I can't figure out how to fix it.
<table>
<tr>
<td>col1</td>
<td>col2</td>
<td>col3</td>
<td>total</td>
</tr>
<?php for($j=1;$j<=3;$j++) { ?>
<script type="text/javascript">
var k = <?php echo json_encode($j); ?>;
var m = 'p'+k+'g';
</script>
<tr>
<td>
<input name="<?php echo 'p'.$j.'g1'; ?>" id="<?php echo 'p'.$j.'g1'; ?>" type="text" onChange="sumScoreF('m')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'g2'; ?>" id="<?php echo 'p'.$j.'g2'; ?>" type="text" onChange="sumScoreF('m')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'g3'; ?>" id="<?php echo 'p'.$j.'g3'; ?>" type="text" onChange="sumScoreF('m')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'gtotal'; ?>" id="<?php echo 'p'.$j.'gtotal'; ?>" type="text" />
</td>
</tr>
<?php } ?>
Any help is greatly appreciated. Thanks.
Used PHP to echo the loop variable within the onChange javascript function call:
<table>
<tr>
<td>col1</td>
<td>col2</td>
<td>col3</td>
<td>total</td>
</tr>
<?php for($j=1;$j<=3;$j++) { ?>
<tr>
<td>
<input name="<?php echo 'p'.$j.'g1'; ?>" id="<?php echo 'p'.$j.'g1'; ?>" type="text" onChange="sumScoreF('<?php echo 'p'.$j.'g'; ?>')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'g2'; ?>" id="<?php echo 'p'.$j.'g2'; ?>" type="text" onChange="sumScoreF('<?php echo 'p'.$j.'g'; ?>')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'g3'; ?>" id="<?php echo 'p'.$j.'g3'; ?>" type="text" onChange="sumScoreF('<?php echo 'p'.$j.'g'; ?>')" />
</td>
<td>
<input name="<?php echo 'p'.$j.'gtotal'; ?>" id="<?php echo 'p'.$j.'gtotal'; ?>" type="text" />
</td>
</tr>
<?php } ?>