We Keep Coding

Three Forms, One Submit button on the same page. Need it to submit to one line in the mysql database

First, the reason why I have three forms on one page is for layout purposes. I have three input boxes going across one line and then another under it and so on. If I place them under one form tag, I get bad looking input boxes that goes from top to bottom. I have tried some solutions but they have not worked. Each line would put 3 three entries instead of one and some data would not show up or only one form would show up in the database.
HTML
<form class="form-inline" id="Test1" method="POST">
<div class="form-group">
<label>Name: <input name="FN" type="text" class="form-control" id="" value=""> </label> </div> </form>
<form class="form-inline" id="Test2" method="POST">
<div class="form-group">
<label>Name: <input name="LN" type="text" class="form-control" id="" value=""> </label> </div> </form>
<form class="form-inline" id="Test3" method="POST">
<div class="form-group">
<label>Name: <input name="EM" type="text" class="form-control" id="" value=""> </label> </div> </form>
<div class="form-group"><br>
<div class="col-sm-offset-2"> <button type="button" class="SB btn btn-default">Book Now</button> </div>
<script>
$(document).on('click','.SB',function(e) {
formData = $('#Test1, #Test2', '#Test3').serialize();
$.post(
'Process.php', formData
);
});
I only get the first form with this and the other two are blank but are on a single line. All inputs are unique. I have also tried the docbyid and it would add three lines but not work correctly. Any Help would be great.
PHP:
require('DBCon.php');
$statement = $link->prepare("INSERT INTO Database (FN, LN, EM) VALUES( :CFN, :CLN, :CE)");
$ClientFN = $_POST['FN'];
$ClientLN = $_POST['LN'];
$ClientEmail = $_POST['EM'];
$statement->execute(array(
":CFN" => "$ClientFN",
":CLN" => "$ClientLN",
":CE" => "$ClientEmail"));
$statement = null;
$link = null;
// Echo Successful attempt
echo "<p Data added to database.</p></br></br>";
?>

Your button should call a function rather than submit the form. Submitting will only send the data from the first form.
You should really use one form and use CSS to correct any display issues, but if you were to use separate forms, the following should do what you are looking for (make sure your closing tags are in the correct place):
<form class="form-inline" id="Test1">
<div class="form-group">
<label>Name: <input name="FN" type="text" class="form-control" id="" value=""></label>
</div>
</form>
<form class="form-inline" id="Test2" method="POST">
<div class="form-group">
<label>Name: <input name="LN" type="text" class="form-control" id="" value=""> </label>
</div>
</form>
<form class="form-inline" id="Test3" method="POST">
<div class="form-group">
<label>Name: <input name="EM" type="text" class="form-control" id="" value=""> </label>
</div>
</form>
<div class="form-group">
<div class="col-sm-offset-2"> <button type="button" class="sumbitButton btn btn-default">Book Now</button>
</div>
<script>
$(document).on('click','.sumbitButton',function(e) {
formData = $('#Test1, #Test2', '#Test3').serialize();
$.post(
'Process.PHP', formData
);
});
</script>

Try this:
<form method="post" action="Process.PHP">
<div class="form-inline">
<div class="form-group">
<label>Name: <input name="FN" type="text" class="form-control" id="" value=""></label>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label>Name: <input name="LN" type="text" class="form-control" id="" value=""> </label>
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label>Name: <input name="EM" type="text" class="form-control" id="" value=""> </label>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2"> <button type="submit" class="sumbitButton btn btn-default">Book Now</button>
</div>
</form>

Pass data from one date picker to another

I have this situation:
2 files (contact.html and booking.php)
On my contact.html I have the following code:
<form action="booking.php" method="POST" role="form" class="formular">
<h3>Online booking!</h3>
<br />
<div class="control-group">
<div class="controls">
<div class="input-group">
<input type="text" id="dateFrom" name="dateFrom" class="form-control" placeholder="Check in" style="width: 258px;"/>
</div>
</div>
</div>
<div class="control-group">
<div class="controls">
<div class="input-group">
<input type="text" id="dateToInput" name="dateToInput" class="form-control" placeholder="Check out" style="width: 258px;"/>
</div>
</div>
</div>
</form>
On my booking.php file I have the following code:
<form>
<div class="booking">
<form name="" action=" " method="post">
<h1>BOOKING</h1>
<div class="bookingDate">
<p>Check in:</p>
<div id="dateFrom">
</div>
</div>
</div>
<div class="bookingDate">
<p>Check out:</p>
<div id="dateTo">
</div>
</div>
<input type="hidden" name="dateFrom" id="dateFromInput" value= $_POST["dateFrom"] />
<input type="hidden" name="dateTo" id="dateToInput" value=$_POST["dateTo"]/>
</form>
So, I have two calendars on my contact.html page and two calendars on booking.php.
I want that when I choose 2 dates (on my contact.html) form, those exact dates to be passed to the other two calendars that I have on booking.php
Could anyone please help me? I have searched a lot and I can't find an answer.

Modify the code to following in value section. Similary for other field as well.
<input type="hidden" name="dateFrom" id="dateFromInput" value= "<?php echo $_POST["dateFrom"] ?>" />

Contact has name="dateToInput" yet booking is looking for dateTo
Fix one: correct the name of the input in contact
<input type="text" id="dateToInput" name="dateTo" class="form-
Fix two: You have no PHP tags in your booking code, without them $_POST is not available, nor are those values being printed.
<input type="hidden" name="dateFrom"
id="dateFromInput" value="<?php echo $_POST["dateFrom"];?>">
<input type="hidden" name="dateTo"
id="dateToInput" value="<?php echo $_POST["dateTo"]; ">
Note I also wrapped the values with quotes

PHP file update cannot takeplace

I am trying to update and upload image to folder using php fileupload also some contents in the text area and text field. Here is my code,problem is I am not getting any result from the database. Please help.
$id=(isset($_GET['id']))?$_GET['id']:'';
$val=view_data_event($id);
if (isset($_POST["events"])&&isset($_POST["description"]))
{
$id=$_POST["id"];
$title=$_POST["events"];
$description=$_POST["description"];
$filetmp=$_FILES["images"]["tmp_name"];
$filename=$_FILES["images"]["name"];
$filetype=$_FILES["images"]["type"];
$filepath= "photo2/".$filename;
move_uploaded_file( $filetmp,$filepath);
$data=array( $title,$description,$filename,$filepath,$id);
$update1=update_event($data);
if($update1)
{
echo "<script>location.href='hotel2_galery_event.php'</script>";
}
}
HTML
<form action="hotel2_galery_eventedit.php" method="post" class="col-sm-4">
<input type="hidden" name="id" value="">
<div class="form-group has-info">
<label class="control-label" for="inputSuccess">Event title</label>
<input type="text" class="form-control" name="events" value="">
</div>
<div class="form-group has-info">
<label>Event Description</label>
<textarea name="description" class="form-control " rows="3">
</textarea><br><br>
</div>
<div class="form-group has-info">
<label>Event Related images</label>
<input type="file" name="images">
<input type="hidden" value="">
<input type="hidden" value="">
</div>
<button type="submit" class="btn btn-primary">
<span>UPDATE</span>
</button>
</form>

Whenever you want to upload files, you must put a enctype="multipart/form-data" attribute on the form tag. Standard POST encoding cannot handle files.

Attempting to get popup to appear after register in a form with a getElementId not working

I have successfully created a popup to display after clicking on a link by using a JavaScript onclick event like this:
However, I am now trying to get figure out how to get this to work without a link needing to be present. I want it to work when a php form is submitted. So basically when someone registers I want a popup to appear after the account has been successfully registered.
I am attempting to do this now like this, but it isn't working at all
<form action="" method="POST">
<div class="field">
<label for="fullname">Full Name</label>
<input type="text" class="inputbar" name="fullname" value="<?php echo escape(Input::get('fullname')); ?>" required>
</div>
<div class="field">
<label for="email">Email</label>
<input type="email" class="inputbaremail" name="email" value="<?php echo escape(Input::get('email')); ?>" required>
</div>
<div class="field">
<label for="username">Username</label>
<input type="text" class="inputbar" name="username" value="<?php echo escape(Input::get('username')); ?>" autocomplete="off" required>
</div>
<div class="field">
<label for="password">Choose a password</label>
<input type="password" name="password" class="inputbarp" required>
</div>
<div class="field">
<label for="password_again">Confirm password</label>
<input type="password" name="password_again" class="inputbarp" required>
</div>
<input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
<label for="signinButton">
<input id="signinButton" type="submit" value="Register">
</label><br>
<onsubmit = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">
<div id="light" class="signInpopup"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
<?php $success;?>
</div>
How could I change what I have to get this to work? Also is Ajax a better method for this or should I scrap what I'm trying to do and have it done another way?
Updated Code:
<form action="" method="POST"
onsubmit="document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
return false;">
<div class="field">
<label for="fullname">Full Name</label>
<input type="text" class="inputbar" name="fullname" value="<?php echo escape(Input::get('fullname')); ?>" required>
</div>
<div class="field">
<label for="email">Email</label>
<input type="email" class="inputbaremail" name="email" value="<?php echo escape(Input::get('email')); ?>" required>
</div>
<div class="field">
<label for="username">Username</label>
<input type="text" class="inputbar" name="username" value="<?php echo escape(Input::get('username')); ?>" autocomplete="off" required>
</div>
<div class="field">
<label for="password">Choose a password</label>
<input type="password" name="password" class="inputbarp" required>
</div>
<div class="field">
<label for="password_again">Confirm password</label>
<input type="password" name="password_again" class="inputbarp" required>
</div>
<input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
<label for="signinButton">
<input id="signinButton" type="submit" value="Register">
</label><br>
<div id="light" class="signInpopup"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
<?php $success;?>
</div>
</form>

What's <onsubmit = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">? It is not valid! Use it this way:
<form action="" method="POST"
onsubmit="document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
return false;">
ps: Don't give breaks inside the attribute. This is just for the readability! Use the above code like:
<form action="" method="POST" onsubmit="document.getElementById('light').style.display='block'; document.getElementById('fade').style.display='block'; return false;">

onclick event hide and show 2 forms using javascript

I have two forms in single page, I want to hide class="register" form onclick "func(1)" and to show class="sign" form, using java script. And onclick "func(2)" hide class="sign" form and show class="register" form.
<form method="post" action="agent.php" id="register_form" class="register" style="display:block;" name="form1" >
<h2>Sign-up </h2>
<input type="text" id="name" name="agent_name" placeholder="Agent Name.."/>
<input type="text" id="mail" name="agent_email" placeholder="E-Mail.." />
<input type="text" id="password" name="agent_password" placeholder="Password.." />
<input type="text" id="number" name="agent_mobile" placeholder="Mobile...." />
<br><br><br><br><br><br><br><br><br>
<select class="form-control sele" name="agent_state" id="country" for="u_state" style="background: rgb(235,235,235);" onChange="getCity('findcity.php?country='+this.value)">
<option value="" selected class="below">Choose state from below...</option>
<?php
while($row = mysql_fetch_array($result))
{
$State = $row['state'];
$StateID = $row['state_id'];
echo "<option value=". $StateID ." cna=".$State.">" . $State ."</option>";
}
?>
</select>
<br>
<div id="citydiv">
<select class="form-control sele" name="agent_location" for="u_city" style="background: rgb(235,235,235);">
<option value="" selected class="below">Choose Location from below...</option>
</select>
</div>
<!-- Agree with the term of services -->
<input type="checkbox" id="tos" name="tos" />
<label for="tos">Accept the Terms of service</label>
<!--<input type="checkbox" id="news" name="news">
<label for="news">Subscribe to our newsltetter !</label>-->
<!-- // // // // // // // // // // -->
<input type="submit" id="" name="reg_agent" value="Register" />
<input type="submit" id="sign2" value="Already A Member ? Sign_In" onclick="func(1)"/>
</form>
<!--//////// AGENT SIGN IN FORM ///////////-->
<div>
<form method="post" action="#" id="signin_form" class="sign" style="display:none;" name="form1" id="">
<h2>Sign-In </h2>
<input type="text" id="name" name="name" placeholder="Agent Name / E-Mail_Id"/>
<input type="text" id="password" name="password" placeholder="Password.." />
<!-- Agree with the term of services -->
<input type="checkbox" id="tos" name="tos" />
<label for="tos">Remember Me</label>
<!--<input type="checkbox" id="news" name="news">
<label for="news">Subscribe to our newsltetter !</label>-->
<!-- // // // // // // // // // // -->
<input type="submit" id="" value="Sign_In" onclick="window.location.href = 'agent_profile.php' " />
<input type="submit" id="register2" value="Not A Member.... Register" onclick="func(2)"/>
<div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
</form>
</div>

Try hide and show,
function func(para)
{
if(para==1)
{
$(".sign").show();
$(".register").hide();
}
else if(para==2)
{
$(".sign").hide();
$(".register").show();
}
}