How do I make a radio button automatically check when i press a radio button?
I have 2 tables, when i click a radio button in table1, the radio button in table2 should also be checked.
here is the radio button code for table1
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="COD") echo "checked";?> value="COD"></td>
<td><img src="img/Cash on Delivery.jpg" alt="COE" class="picture" height="90" width="125"/></td>
<td><p>This service is only available for Meto Manila and Metro Cebu.<p>
<div id='price'> Additional ₱180 </div></td>
</tr>
and here the radio button in table2 that needs to be automatically checked when i check the radio button in table1
<tr>
<td><input type="radio" name="carrier" <?php if (isset($payment) && $payment=="COD") echo "checked";?> value="COD"></td>
<td><img src="img/Cash on Delivery.jpg" height="90" width="125"/></td>
<td><p>Pay with your Cash on Delivery (COD)<br>Choose this option if you have selected COD under shipping. Otherwise, choose other options for payment.<p></td>
</tr>
Here are the full codes.
if(isset($_GET['command']) && $_GET['command']=='update'){
$first_name=$_SESSION['first_name'];
$email=$_SESSION['email'];
$home_address=$_SESSION['home_address'];
$mobile_phone=$_SESSION['mobile_phone'];
$carrier=$_REQUEST['carrier'];
$payment=$_REQUEST['payment'];
$result=mysql_query("insert into customers values('','$first_name','$email','$home_address','$mobile_phone','$carrier','$payment')");
$customerid=mysql_insert_id();
date_default_timezone_set("Asia/Hong_Kong");
$date=date('Y-m-d h:i:s');
$result=mysql_query("insert into orders values('','$date','$customerid')");
$orderid=mysql_insert_id();
$max=count($_SESSION['cart']);
for($i=0;$i<$max;$i++){
$pid=$_SESSION['cart'][$i]['productid'];
$q=$_SESSION['cart'][$i]['qty'];
$price=get_prod_price($pid);
mysql_query("insert into order_detail values ($orderid,$pid,$q,$price)");
}
header('refresh: 0; url=homeframe.html'); // to be redirected
exit(); // para mawala ang puta, tumigil ang script.
}
// else if(isset($_REQUEST['success']) && $_REQUEST['success']=='1'){
// header('refresh: 0; url=samplebrand.php');
// $message = "Thank you for buying, You will now be redirected";
// echo("<script type='text/javascript'>alert('$message');</script>");
// }
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Billing Info</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script language="javascript">
function validate(){
var f=document.form1;
f.command.value='update';
f.submit();
alert("Order submitted");
}
$('#super').change(function(){
var radio1 = $('input:radio[name=carrier]:checked').val();
if(radio1 == 'on'){
$( "input:radio[name=carrier2]" ).prop( "checked", true ).checkboxradio( "refresh" );
}
});
</script>
<style>
#price{
color:red;
font-size:20px;
padding-right: 10px;
font-family: "Times New Roman", Times, serif;
float:right;
}
td{
display:block;
}
</style>
</head>
<body>
<form name="form1" onsubmit="return validate()">
<input type="hidden" name="command" />
<div align="center">
<h1 align="center">Shipping and Payment</h1>
<table border="0" cellpadding="2px">
<tr><td>Order Total:</td><td>₱ <?php echo get_order_total()?></td><td> </td>
</tr>
</table>
<center><h1>Shipping Method</h1></center>
<form method="post">
<table width="900" border="0" align="center" cellpadding="2" cellspacing="0" id='center'>
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="LBC") echo "checked";?> value="LBC"></td>
<td><img src="img/LBC.jpg" alt="LBC" class="picture"/></td>
<td><p>The Shipping takes 1-2 days for NCR and 2-3 days for any provincial.<p>
<div id='price'> Additional ₱250 </div></td>
</tr>
<tr>
<td><input type="radio" id="super" name="carrier" <?php if (isset($carrier) && $carrier=="COD") echo "checked";?> value="COD"></td>
<td><img src="img/Cash on Delivery.jpg" alt="COE" class="picture" height="90" width="125"/></td>
<td><p>This service is only available for Meto Manila and Metro Cebu.<p>
<div id='price'> Additional ₱180 </div></td>
</tr>
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="Personal") echo "checked";?> value="Personal"></td>
<td><img src="img/buybranded2.jpg" alt="buybranded" class="picture"/></td>
<td><p>The Shipping takes 2-3 days after processing for NCR and 3-5 days for any provincial.<p>
<div id='price'> Additional ₱100 </div></td>
</tr>
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="NextDayDelivery") echo "checked";?> value="NextDayDelivery"></td>
<td><img src="img/NextdayDelivery.jpg" alt="NextDayDelivery" class="picture"/></td>
<td><p>The Shipping takes 1-2 days for NCR and 2-3 days for any provincial.<p>
<div id='price'> Additional ₱150 </div></td>
</tr>
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="SameDayDelivery") echo "checked";?> value="SameDayDelivery"></td>
<td><img src="img/Same day Delivery.jpg" alt="SameDayDelivery" class="picture"/></td>
<td><p>Available only for NCR. Get your sporting good/s the same day you purchase the item. Cutoff is 12noon.<p>
<div id='price'> Additional ₱250 </div></td>
</tr>
<tr>
<td><input type="radio" name="carrier" <?php if (isset($carrier) && $carrier=="PickUp") echo "checked";?> value="PickUp"></td>
<td><img src="img/Pick-up.jpg" alt="Pick-Up" class="picture"/></td>
<td><p>Office hours: 10:00 am to 6:00 pm<p>
<div id='price'> Free!! </div></td>
</tr>
</table>
<br>
<br>
<center><h1>Payment Method</h1></center>
<table width="900" border="0" align="center" cellpadding="2" cellspacing="0" id='centerdown'>
<tr>
<td><input type="radio" name="payment" <?php if (isset($payment) && $payment=="BPI") echo "checked";?> value="BPI"></td>
<td><img src="img/BPI.jpg"></td>
<td><p>Pay by BPI bank deposit (we need confirmation of payment through email.)<p></td>
</tr>
<!--
<tr>
<td><input type="radio" name="payment" <?php if (isset($payment) && $payment=="PayPal") echo "checked";?> value="PayPal"></td>
<td><img src="img/paypal.gif"></td>
<td><p>Pay with your PayPal account, credit card (CB, Visa, Mastercard...), or private credit card.<p></td>
</tr>
-->
<tr>
<td><input type="radio" name="payment" <?php if (isset($payment) && $payment=="PickUp") echo "checked";?> value="PickUp"></td>
<td><img src="img/cashondelivery.gif"></td>
<td><p>Pick up. You have 5 days reservation period. You pay for the merchandise upon pick-up<p></td>
</tr>
<tr>
<td><input type="radio" name="carrier2" <?php if (isset($payment) && $payment=="COD") echo "checked";?> value="COD"></td>
<td><img src="img/Cash on Delivery.jpg" height="90" width="125"/></td>
<td><p>Pay with your Cash on Delivery (COD)<br>Choose this option if you have selected COD under shipping. Otherwise, choose other options for payment.<p></td>
</tr>
</table>
<table>
<tr><td><!--<input type="submit" value="Place Order"/> --> <input type="button" value="Confirm Order" onclick="window.location='quotation.php?'"></td></tr>
</table>
</form>
</div>
</form>
</body>
</html>
You could achieve this using JQuery. Assuming your forms have ids of form1 and form2:
<script>
$(document).ready(function () {
$("#form1 input[name='carrier']").click(function () {
if (this.checked) {
$("#form2 input[name='carrier']").prop("checked", true);
} // end if checked
});
}); // end doc ready
</script>
You will also need to include a reference to the JQuery library, before adding the aforementioned code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Please note that this will only update the form2 carrier radio button when the form1 button is clicked, and not the other way around.
See this JSFiddle as an example.
i slightly change your second radio name, and you can automatically set it with jquery like below :
$('input:radio[name=carrier]').change(function(){
var radio1 = $('input:radio[name=carrier]:checked').val();
if(radio1 == 'on'){
$( "input:radio[name=carrier2]" ).prop( "checked", true ).checkboxradio( "refresh" );
}
});
DEMO
Related
I am trying to create a simple login page for a server:
<html>
<head>
<title>Login Page</title>
</head>
<body>
<form name="loginForm" method="post" action="login.php">
<table>
<tr>
<td colspan=2><center><font size=4><b>HTML Login Page</b></font>
</center></td>
</tr>
<tr>
<td>Username:</td>
<td><input type="text" size=25 name="userid"></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="Password" size=25 name="pwd"></td>
</tr>
<tr>
<td ><input type="Reset"></td>
<td><input type="submit" onclick="return check(this.form); load();"
value="Login">
</td>
</tr>
</table>
</form>
<script language="javascript">
function check(form)
{
if(form.userid.value == "n" && form.pwd.value == "n")
{
return true;
}
else
{
alert("Error Password or Username")
return false;
}
</script>
</body>
</html>
The HTML above is how i would like the page to look, however i want to add another function that when the login button is pressed i would like the page to take me to a different page like google for example.
Is there anyway I can do this?
Through Html you can do something like:
<form action="http://google.com">
<input type="submit" value="Go to Google">
</form>
Please excuse me if this question is elementary - fairly new to working with mysql. I left out the query and loop/references in the code below, because my question is on formatting the table. (I hope that info isn't needed)
Right now the result of the code below is the info being displayed in one single table row that spans the width of the table, these rows continue until all data is displayed.
How can I format this so instead of one long cell in one table row, I get two cells per table row?
I haven't been able to figure out if this is a matter of formatting the table into 2 columns or formatting the tr or td.
Thank you very much for your help and guidance on this!!
echo('<table width="85%" align="center" cellspacing="15">');
//query,loop, references
echo('<tr>
<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px">
<div style="float:right">
<form action="index.php" method="get">
<input type="hidden" name="page" value="viewproject">
<input type="hidden" name="projectid" value="'.$projectid.'">
<input type="submit" value="View Event"></form>
<br>
<form action="jump_delete.php" method="post" align="right">
<input type="hidden" name="projectid" value="'.$projectid.'">
<input type="submit" value="Delete"></form>
</div>
<div style="font-weight:bold; font-size:18px">'.$projectclient.'</div>
<div style="font-size:15px"><b>Event:</b> '.$projectname.'</div>
<div style="font-size:15px">Date: '.$duedateformatted.'</div>
<div style="font-size:15px">Staff Count: '.$projectstaffcount.'</div>
</td>
</tr>');
UPDATE: With using my own version of the help from below - I came to an answer that gets the job done for me. Thanks to all who chimed in with help and advice!!! Using an if statement to create when new rows happen.
if($i % 2 == 1) {
if($i != 0) {
echo(‘</tr>');
}
td means table data which is basically a cell or column
tr stands for table row
The number of td inside your tr will determine how many columns you are going to get.
Also, have a look at the td attribute colspan and rowspan here
In your specific case my guess is that you want to add another td inside your table
<table width="85%" align="center" cellspacing="15">
<tr>
<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>
<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>
</tr>
</table>
UPDATE:
to loop through your data you need something like this
echo '<table width="85%" align="center" cellspacing="15">';
echo '<tr>';
$i = 0;
while(...) {
// skip the first iteration
// then after every second <td> close the <tr> and open a newone
if($i > 0 and $i % 2 == 0) {
echo '</tr><tr>';
}
echo '<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px"></td>';
$i++;
}
echo '</tr>';
echo '</table>';
Try to avoid echo for html code, and use tr for rows and td for
I shall post the code how it works for me:
?>
<table width="85%" align="center" cellspacing="15">
<?php
//query,loop, references
?>
<tr>
<td bgcolor="#dddddd" style="border:1px solid black; padding:12px;">
<form action="index.php" method="get">
<input type="hidden" name="page" value="viewproject">
<input type="hidden" name="projectid" value="<?php $echo projectid;?>">
<input type="submit" value="View Event">
</form>
</td>
<td>
<form action="jump_delete.php" method="post" align="right">
<input type="hidden" name="projectid" value="<?php $echo projectid;?>">
<input type="submit" value="Delete">
</form>
</td>
</tr>
<tr>
<td style="font-weight:bold; font-size:18px;">
<?php echo $projectclient;?>
</td>
<td style="font-size:15px">
Event:<?php echo $projectname;?>
</td>
</tr>
<tr>
<td style="font-size:15px">
Date: <?php echo $duedateformatted;?>
</td>
<td style="font-size:15px">
Staff Count: <?php echo $projectstaffcount;?>
</td>
</tr>
<?php
//close loop
?>
</table>
<?php
tr add rows to you table
td add cells inside a row tr
Assuming you need the additional cell after the second form, you will need an additional <td></td>
echo('<table width="85%" align="center" cellspacing="15">');
//query,loop, references
echo('<tr>
<td bgcolor="#dddddd" style="border:1px solid #000000; padding:12px">
<div style="float:right">
<form action="index.php" method="get">
<input type="hidden" name="page" value="viewproject">
<input type="hidden" name="projectid" value="'.$projectid.'">
<input type="submit" value="View Event"></form>
<br>
<form action="jump_delete.php" method="post" align="right">
<input type="hidden" name="projectid" value="'.$projectid.'">
<input type="submit" value="Delete"></form>
</div>
// Additional td here
</td>
<td>
<div style="font-weight:bold; font-size:18px">'.$projectclient.'</div>
<div style="font-size:15px"><b>Event:</b> '.$projectname.'</div>
<div style="font-size:15px">Date: '.$duedateformatted.'</div>
<div style="font-size:15px">Staff Count: '.$projectstaffcount.'</div>
</td>
</tr>');
I have radio buttons for each row of my table. On clicking radio button and clicking on submit button selected values must appear in the dialogue box.
My code is:
<form action="" method="POST">
<table border="1" id="escalationTable" >
<thead>
<tr>
<td style="width: 20px;"></td>
<td><h3>Date<h3></td>
<td><h3>Status<h3></td>
<td><h3>Ward<h3></td>
<td><h3>Source Address<h3></td>
<td><h3>Escalated by MPW on<h3></td>
<td><h3>Action to be taken<h3></td>
</tr>
</thead>
<tbody>
<?php for($i=$start;$i<$end;$i++)
{
$address=$ARRAY[$i]['source_address'];
$add=str_replace('"',"'",$address);
$wardd=$ARRAY[$i]['ward_name'];
$typo=$ARRAY[$i]['type_desc'];
$action=$ARRAY[$i]['action_required'];
$Reptime = date('d-m-Y',strtotime($ARRAY[$i]['source_repTime']));
$category=$ARRAY[$i]['scat_desc'];
$subtype_s=$ARRAY[$i]['subtype_desc'];
$credai_s=$ARRAY[$i]['source_credai'];
$floor=$ARRAY[$i]['source_floorNo'];
$breed_s=$ARRAY[$i]['source_breedingSite'];
$recc_s=$ARRAY[$i]['source_recurrence'];
$closedate = date('d-m-Y',strtotime($ARRAY[$i]['action_closeDate']));
$statuss=$ARRAY[$i]['escl_status'];
$source_id=$ARRAY[$i]['source_id'];
$escl_id=$ARRAY[$i]['escl_id'];
$comma="(!#!)";
$tot1=$add.$comma.$wardd.$comma.$typo.$comma.$action.$comma.$Reptime.$comma.$category.$comma;
$tot2=$subtype_s.$comma.$credai_s.$comma.$floor.$comma.$breed_s.$comma.$recc_s.$comma.$closedate.$comma.$statuss.$comma.$source_id.$comma.$escl_id;
$total=$tot1.$tot2;
?><tr>
<td><input type="radio" name="ID[]" value="<?php echo $total; ?>" <?php echo $_POST['ID'][0]==$total ? 'checked':'';?> required /></td>
<?php
$dmydate = date('d-m-Y',strtotime($ARRAY[$i]['escl_date']));
echo'<td>'.$dmydate.'</td>';
echo'<td>'.$ARRAY[$i]['escl_status'].'</td>';
echo'<td>'.$ARRAY[$i]['ward_name'].'</td>';
echo'<td>'.$ARRAY[$i]['source_address'].'</td>';
echo'<td>'.$ARRAY[$i]['source_escMPW_Date'].'</td>';
echo'<td>'.$ARRAY[$i]['action_required'].'</td>';
?>
</tr>
<?php }?>
</tbody>
</table>
<div id="RecordNo">
<?php echo"<p id='messages'>$records:$match</p>";?>
</div>
<table id="escButtons">
<tr>
<td>
<input type="submit" name="details" value="Details" id="btndetails" />
</td>
</tr>
</table>
<?php
if(isset($_POST['details']))
{
$n=$_POST['ID'];
$a=implode("</br>",$n);
echo"</br>";
list($add, $ward,$typo,$action,$Reptime,$category,$subtype_s,$credai_s,$floor,$breed_s,$recc_s,$closedate) = explode("(!#!)", $a);
$address=str_replace("'",'"',$add);
if($breed_s=='1')
{$breed_s="Yes";}
else{$breed_s="No";}
if($recc_s=='1')
{$recc_s="Yes";}
else{$recc_s="No";}
?><div id="element_to_pop_up">
<a class="b-close">x<a/>
<table id="RowDetails">
<tr>
<td>
<ul><?php echo"<b>Source reported date:</b>$Reptime</br>";?></ul>
<ul><?php echo"<b>Source Address:</b>$address</br>";?></ul>
<ul><?php echo"<b>Source Category:</b>$category</br>";?></ul>
<ul><?php echo"<b>Source Type:</b>$typo</br>";?></ul>
<ul><?php echo"<b>Source Subtype:</b>$subtype_s</br>";?></ul>
<ul><?php echo"<b>Source CREDAI:</b>$credai_s</br>";?></ul>
<ul><?php echo"<b>Source Floor No :</b>$floor</br>";?></ul>
<ul><?php echo"<b>Breeding site:</b>$breed_s</br>";?></ul>
<ul><?php echo"<b>Recurrence:</b>$recc_s</br>";?></ul>
<ul><?php echo"<b>Source Action Required:</b>$action</br>";?></ul>
<ul><?php echo"<b>Suggested Closure Date:</b>$closedate</br>";?></ul>
</td>
</tr>
</table></div><?php
}
I need my control flow as Click radio->click details button->Pop up with radio button details message. Please help me !
First you dont have any form submit action means you dint submit the form anywhere is the reason you dint get any value from post.If you dont want to reload page you can use jquery to set the value of popup.
Fiddle
Second to place required field in radio button just put required in only one radio button.Source
Do this
<form id="myform">
<p>
Untraced :<input type="radio" name="inc_untraced" value="No" required />No
<input type="radio" name="inc_untraced" value="Yes" />Yes
</p>
<input type="submit" name="details" value="Details" id="my-button" />
</form>
<!-- Element to pop up -->
<div id="element_to_pop_up">
<a class="b-close">x<a/>
U have clicked on <?php $_POST['inc_untraced'];?>
</div>
Fiddle
(function($) {
$(function() {
// Binding a click event
// From jQuery v.1.7.0 use .on() instead of .bind()
$('#my-button').bind('click', function(e) {
// Prevents the default action to be triggered.
e.preventDefault();
if($('input:radio:checked')){
var v = $('input:radio:checked').val();
if(v!=undefined){
$('.radioVal').text(v)
}else{
alert('please select radio button')
return false;
};
}
// Triggering bPopup when click event is fired
$('#element_to_pop_up').bPopup();
});
});
})(jQuery);
<p>
Untraced :<input type="radio" name="inc_untraced" value="No" required />No
<input type="radio" name="inc_untraced" value="Yes" required />Yes
</p>
<input type="submit" name="details" value="Details" id="my-button" />
<!-- Element to pop up -->
<div id="element_to_pop_up">
<a class="b-close">x<a/>
U have clicked on <span class="radioVal"> </span> <?php $_POST['inc_untraced'];?>
</div>
In a HTML form I am using JavaScript Form validation to avoid empty fields. This is the code for the form:
<form method="post" name="form1" onsubmit="return validateForm()" action="<?php echo $editFormAction; ?>">
<table align="center">
<tr valign="baseline">
<td nowrap align="right">Nickname:</td>
<td>
<input type="text" name="nickname" value="" size="32">
</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Email:</td>
<td><input type="text" name="email" value="" size="32"></td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Password:</td>
<td><input type="text" name="password" value="" size="32"></td>
</tr>
<tr valign="baseline">
<td nowrap align="right"> </td>
<td><input type="submit" value="Insert record"></td>
</tr>
</table>
<input type="hidden" name="estado" value="0">
<input type="hidden" name="MM_insert" value="form1">
</form>
And this is the JavaScript function:
<script>
function validateForm()
{
var x=document.forms["form1"]["nickname"].value;
if (x==null || x=="")
{
alert("First name must be filled out");
return false;
}
}
</script>
As expected, if the user clicks on the submit button and the field 'nickname' is empty, the Alert Dialog is shown, but after closing it, the form is submitted. I am using Dreamweaver as editor and JQuery Mobile in my web, may be this is the problem.
Any help is welcome.
Working example: http://jsfiddle.net/Gajotres/vds2U/50/
HTML:
<!DOCTYPE html>
<html>
<head>
<title>jQM Complex Demo</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
<!--<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>-->
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
</head>
<body>
<div data-role="page" id="index" data-theme="a" >
<div data-role="header">
<h3>
First Page
</h3>
Next
</div>
<div data-role="content">
<form method="post" id="form1" name="form1" action="" data-ajax="false">
<table align="center">
<tr valign="baseline">
<td nowrap align="right">Nickname:</td>
<td>
<input type="text" name="nickname" value="" size="32"/>
</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Email:</td>
<td><input type="text" name="email" value="" size="32"/></td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Password:</td>
<td><input type="text" name="password" value="" size="32"/></td>
</tr>
<tr valign="baseline">
<td nowrap align="right"> </td>
<td><input type="submit" value="Insert record"/></td>
</tr>
</table>
<input type="hidden" name="estado" value="0"/>
<input type="hidden" name="MM_insert" value="form1"/>
</form>
</div>
<div data-role="footer" data-position="fixed">
</div>
</div>
<div data-role="page" id="second" data-theme="a" >
<div data-role="header">
<h3>
Second Page
</h3>
Back
</div>
<div data-role="content">
</div>
<div data-role="footer" data-position="fixed">
</div>
</div>
</body>
</html>
JavaScript:
$(document).on('submit', '#form1', function(){
var x=document.forms["form1"]["nickname"].value;
if (x==null || x=="") {
alert("First name must be filled out");
return false;
} else {
return true;
}
});
Changes:
jQuery Mobile has its own way of form handling, you need to disable it if you want to have classic form handling. It is done via attribute data-ajax="false".
Never use inline javascript with jQuery Mobile, I mean NEVER.
For me this is working fine :
<script>
function validateForm()
{
var x=document.forms["form1"]["nickname"].value;
if (x==null || x=="")
{
alert("First name must be filled out");
return false;
}else{
return true;
}
}
</script>
Just added a else statement. It's working fine for me.
I think your code should work. But If not you can make some changes as
Change 1 Remove Submit event from tag
<form method="post" name="form1" action="<?php echo $editFormAction; ?>">
Change 2.
Change submit button to default button and validate event here
<input type="button" onclick="javascript:validateForm();" value="Insert record">
Change 3.
Now change in javascript Add code form sub
<script>
function validateForm()
{
var x=document.forms["form1"]["nickname"].value;
if (x==null || x=="")
{
alert("First name must be filled out");
}else{
document.forms["form1"].submit();
}
}
</script>
I'm trying to tamper with my html table settings to set borders but I think my syntax is wrong. I've looked around online and tried multiple things with no success. Any suggestions?
For example, this code is applied to the first table but does not appear correctly on page.
<table BORDER="30" CELLPADDING="10" CELLSPACING="3" BORDERCOLOR="00FF00" width='80%' style="margin: 0 auto;">
</table>
HTML code is applied here: http://macrorevolution.com/calculators/bmr/
The only table settings that seem to work are "width='80%' style="margin: 0 auto;""
<?php
$answer = "";
$agev = "";
$feetv = "";
$inchesv = "";
$weightv = "";
$sex = "";
if(isset($_POST['agev']) && isset($_POST['feetv']) && isset($_POST['inchesv']) && isset($_POST['weightv']) && isset($_POST['sex'])) {
$agev = $_POST['agev'];
$feetv = $_POST['feetv'];
$inchesv = $_POST['inchesv'];
$weightv = $_POST['weightv'];
$sex = $_POST['sex'];
$totalheightv = $inchesv + ($feetv*12);
$heightcm = $totalheightv*2.54;
$weightkg = $weightv/2.2;
if($sex=='male') $answer = 66.47 + (13.75*$weightkg) + (5*$heightcm) - (6.75*$agev);
if($sex=='female') $answer = 665.09 + (9.56*$weightkg) + (1.84*$heightcm) - (4.67*$agev);
}
?>
<!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=utf-8" />
<title>Basal Metabolic Rate Calculator</title>
</head>
<body>
<div class="box pt20">
<table BORDER="30" CELLPADDING="10" CELLSPACING="3" BORDERCOLOR="00FF00" width='80%' style="margin: 0 auto;">
<td colspan="4">
<h4 style="background: #99FF99;">
<strong>BMR = Basal Metabolic Rate</strong> (similar to RMR = Resting Metabolic Rate). Your BMR represents the number of calories your body burns at rest. Regular routine of cardiovascular exercise can increase your BMR, improving your health and fitness when your body's ability to burn energy gradually slows down.
</h4>
</td>
</table>
<form method='post' action=''>
<table border='5' width='80%' font-family:Georgia; font-size:1; class="table" style="margin: 0 auto;" bgcolor="FFFFFF">
<tr class="calcheading">
<td colspan="2"><font size="10">MacroRevolution BMR Calculator</font></td>
</tr>
<tr class="calcrow">
<td>Age:</td>
<td><input type='text' name='agev' value="<?php echo $agev; ?>"/>Years</td>
</tr>
<tr class="calcrow2">
<td>Height:</td>
<td align="justify"><input type='text' name='feetv' value="<?php echo $feetv; ?>"/>Ft<input type='text' name='inchesv' value="<?php echo $inchesv; ?>"/>In</td>
</tr>
<tr class="calcrow">
<td>Weight:</td>
<td align="left"><input type='text' name='weightv' value="<?php echo $weightv; ?>"/>lbs</td>
</tr>
<tr class="gender">
<td colspan="2"><input type='radio' name='sex' value='male'>Male
<input type='radio' name='sex' value='female'>Female</td>
</tr>
<tr class="submit">
<td colspan="2"><input type='submit' class="button highlight small" value='Calculate'/></td>
</tr>
<tr class="calcrow">
<td colspan="2">Your BMR is <span style="background-color: #00CC33"><?php echo $answer?></span></td>
</tr>
</table>
</form>
<table border='0' width='80%' class="table" align="center" style="margin: 0 auto;">
<td colspan="4">
<h2 style="background: #99FF66;">Formula for BMR</h2>
<h4 style="background: #99FF66;">
If you want to manually calculate your BMR, use the (Harris-Benedict formula) <br> below. <br><br>
Men: BMR=66.47+ (13.75 x W) + (5.0 x H) - (6.75 x A) <br>
Women: BMR=665.09 + (9.56 x W) + (1.84 x H) - (4.67 x A) <br><br>
W = Weight in kilograms (lbs/2.2)<br>
H = Height in centimeters (inches x 2.54)<br>
A = Age in years
</h4>
</td>
</table>
</div>
</body>
</html>
<!-- ///////////////////////////////////////////////////////////////////////////////////////////-->
Avoid HTML attributes like border="30" cellpadding="10" cellspacing="3" bordercolor="#00ff00" and use CSS instead:
<style>
table {
border: 30px solid #00ff00;
}
</style>
Even better, move the styles to another file
<link rel="stylesheet" type="text/css" href="stylesheet.css">