Use PHP to display user inputs - javascript

What I'm trying to do is to use PHP to display the user inputs on a separate page, but when I process the form none of the input values display. I'm having to use javascript for input validation and that works fine but the PHP page is not working.
Here is my code:
HTML and Javascript
survey.php:
<!DOCTYPE html>
<html>
<head>
<title>Survey Page</title>
<link rel="stylesheet" type="text/css" href="mystylepage.css" />
<script type="text/javascript">
function validate()
{
if (document.information.name.value == "" )
{
alert("Please provide your name!" );
document.information.value.focus();
return false;
}
if (document.information.email.value == "")
{
alert("Please provide an email!");
document.information.value.focus();
return false;
}
if (document.information.major.value == false)
{
alert("Please enter your major");
document.information.value.focus();
return false;
}
return true;
}
</script>
</head>
<div id="bodycolor">
<body>
<div id="container">
<div id="menu">Menu:
<a class="menu" href="index.htm">Home</a> | <a class="menu"
`href="faculty.htm">Faculty</a> |
<a class="menu" href="courses.htm">
Courses</a> | <a class="gradecalculator" href="gradecalculator.htm">Grade
Calculator</a> | <a class="survey" href="survey.htm">Survey</a>
</div>
</div>
<div id="header">
<h1><center>CSE Center for Health Information Technology</center></h1>
<br>
<div id="links">
<center><a href="https://www.kennesaw.edu/"><img src="KSU Logo.jpg"
alt="Logo" style="width:100px;height:100px;" /></a></center>
<br>
<center><a href="http://ccse.kennesaw.edu/">College of Computing and
Software Engineering</a></center>
</div>
</div>
<h1>Please enter you information below</h1>
<form name="information" method="POST" action="action.php"
onsubmit="return
validate();">
<table width="500" border="0">
<tr>
<td width="150" bgcolor="#99CCFF"><strong>Name</strong></td>
<td><input type="text" name="name" size="20" maxlength="20" /></td>
</tr>
<tr>
<td bgcolor="#99CCFF"><strong>Email</strong></td>
<td><input type="text" name="email" size="20" maxlength="20" /></td>
</table>
<p> Major:
<input name="major" type="radio" value="Information Technology" />
Information Technology
<input name="major" type="radio" value="Software Engineering" />
Software Engineering
<input name="major" type="radio" value="Computer Science" />
Computer Science</p>
<p>
<input type="submit" value="Process" />
</p>
<p id="msg"></p>
</form>
</body>
</html>
Here is the PHP page:
action.php
<!DOCTYPE html>
<html>
<head>
<title>Survey Information Processing</title>
</head>
<body>
<h1>Form data</h1>
<p>Name: <?php echo $_POST["name"]?></p>
<p>Email: <?php echo $_POST["email"]?</p>
<p>Major: <?php echo $_POST["major"]?</p>
</body>
</html>
I'm totally new to PHP, so any help is greatly appreciated!

Your form method should be POST.
<form name="information" method="POST" action="action.php" onsubmit="return validate();">
And add a name to the submit button:
<input type="submit" value="Process" name="submit" />
Also, you could add this if condition:
<?php
echo "<pre>";
print_r($_POST); // Check if you're getting any POST data
echo "</pre>";
?>
<?php if (isset($_POST['name'])) { ?>
<h1>Form data</h1>
<p>Name: <?php echo $_POST["name"]; ?>
</p>
<p>Email: <?php echo $_POST["email"]; ?>
</p>
<p>Major: <?php echo $_POST["major"]; ?>
</p>
<?php } ?>
Hope this helps.

So the issue is your method is get but you're trying to access through post
Change
method="GET"
to
method="POST"
On your form.

Related

Getting user inputs from HTML form

I want to be able to get the inputs that a user enters in my HTML form and be able to print them later on my website. I would love to be able to print all the user info with the selections they have made to there pizzas. I have been trying for the last few hours to do this and no luck :( Looking to get the date, first name, last name, address and phone.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Daves Pizza</title>
<link href="new.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="pizza.js"></script>
</head>
<body>
<div align="center">
<h5>Today is: <span id="dtfield"></span></h5>
</div>
<br>
<div align="center">
<h1>Dave's Pizza Place</h1>
</div>
<div align="center">
<div class="user">
<form id="contact_form" action="mailto: david.genge#edu.sait.ca" name="userInfo" method="POST" enctype="text">
<br>
<div>
<label for="datetime">Date:</label>
<input type="date" name="user_date" />
</div>
<div>
<label for="firstname">Firstname:</label>
<input type="text" pattern="[A-Za-z-']+" name="firstname" value="Firstname" maxlength="20"/>
</div>
<div>
<label for="lastname">Lastname:</label>
<input type="text" pattern="[A-Za-z-']+" name="lastname" placeholder="Lastname" maxlength="20"/>
</div>
<div>
<label for="mail">Address:</label>
<input type="text" name="user_mail" placeholder="Full Address"/>
</div>
<div>
<label for="tel">Phone#:</label>
<input type="tel" pattern="[0-9]+"" name="user_phone" placeholder="(403)123-1234"/>
</div>
</form>
</div>
</div>
<div align="center">
<div class="pizza">
<form name="costEstimation">
<table border="0">
<tr valign="middle">
<td>
<br>
<b>Choose Your Pizza Type<b><br>
<input type="radio" name="pizzasize" value="8" checked>Small $8<br>
<input type="radio" name="pizzasize" value="10">Medium $10<br>
<input type="radio" name="pizzasize" value="15">Large $15<br>
<input type="radio" name="pizzasize" value="18">Extra Large $18<br></td>
<td></td>
</tr>
<tr>
<td>
<b>Specialities<b><br>
<input type="radio" name="special" value="3">Super Cheesy $3<br>
<input type="radio" name="special" value="5">Extra Meaty $5<br>
<input type="radio" name="special" value="2">Really Veggie $2<br></td>
<td>
<b>Extra Toppings </b>
<br>
<input type="checkbox" name="cheese" value="1.5">Extra Cheese $1.50<br>
<input type="checkbox" name="pepperoni" value="1.5">Pepperoni $1.50<br>
<input type="checkbox" name="mushrooms" value="1.5">Mushrooms $1.50<br>
<input type="checkbox" name="bacon" value="1.5">Bacon $1.50<br>
<input type="checkbox" name="olives" value="1.5">Olives $1.50<br>
</td>
</tr>
</table>
</form>
<h2>Pizza Cost: </h2><h2><span id="result"></span></h2>
<input type=button value="Price Your Pizza" onClick="pizza(); return false;">
<button type="submit">Send your message</button>
<br><br><br>
<table>
<tr>
<td>
<figure>
<center>
<img src="cheese.jpg" alt="cheese" height="100" width="100">
</center>
</figure>
</td>
<td>
<figure>
<center>
<img src="veg.jpg" alt="veg" height="100" width="100">
</center>
</figure>
</td>
<td>
<figure>
<center>
<img src="meat.jpg" alt="meat" height="100" width="100">
</center>
</figure>
</td>
</tr>
</table>
</div>
<br>
<br>
<br>
</div>
</body>
</html>
You need to use form for saving the input values entered by user. you can do it by either GET or POST method. here is the sample demo with Validation:
<!DOCTYPE HTML>
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>
<?php
// define variables and set to empty values
$nameErr = $emailErr = $genderErr = $websiteErr = "";
$name = $email = $gender = $comment = $website = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["name"])) {
$nameErr = "Name is required";
} else {
$name = test_input($_POST["name"]);
// check if name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameErr = "Only letters and white space allowed";
}
}
if (empty($_POST["email"])) {
$emailErr = "Email is required";
} else {
$email = test_input($_POST["email"]);
// check if e-mail address is well-formed
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$emailErr = "Invalid email format";
}
}
if (empty($_POST["website"])) {
$website = "";
} else {
$website = test_input($_POST["website"]);
// check if URL address syntax is valid (this regular expression also allows dashes in the URL)
if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&##\/%?=~_|!:,.;]*[-a-z0-9+&##\/%=~_|]/i",$website)) {
$websiteErr = "Invalid URL";
}
}
if (empty($_POST["comment"])) {
$comment = "";
} else {
$comment = test_input($_POST["comment"]);
}
if (empty($_POST["gender"])) {
$genderErr = "Gender is required";
} else {
$gender = test_input($_POST["gender"]);
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>
<h2>PHP Form Validation Example</h2>
<p><span class="error">* required field.</span></p>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
Name: <input type="text" name="name" value="<?php echo $name;?>">
<span class="error">* <?php echo $nameErr;?></span>
<br><br>
E-mail: <input type="text" name="email" value="<?php echo $email;?>">
<span class="error">* <?php echo $emailErr;?></span>
<br><br>
Website: <input type="text" name="website" value="<?php echo $website;?>">
<span class="error"><?php echo $websiteErr;?></span>
<br><br>
Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea>
<br><br>
Gender:
<input type="radio" name="gender" <?php if (isset($gender) && $gender=="female") echo "checked";?> value="female">Female
<input type="radio" name="gender" <?php if (isset($gender) && $gender=="male") echo "checked";?> value="male">Male
<span class="error">* <?php echo $genderErr;?></span>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>
<?php
echo "<h2>Your Input:</h2>";
echo $name;
echo "<br>";
echo $email;
echo "<br>";
echo $website;
echo "<br>";
echo $comment;
echo "<br>";
echo $gender;
?>
you need to use any server side language to get input from user.
Use this statement
<form method="GET or POST" action="file_location/file_name(on which you want to get input)">
Php is very simple language you can learn it easly
i am giving you an example:
index.html
<form method="GET" action="localhost://getdata.php">
<input type="text" name="UserName" />
<input type="button" value="Submit" />
</form>
Focus on name tag i used in input statement "UserName" your data will be send by binding user input in it and then you can display data using php with this name as showing below
getdata.php
<?php
echo "$_GET['UserName']";
?>
if you want to get the data using javascript then,
HTML:
<input type="text" name="name" id="uniqueID" value="value" />
<span id="output"></span>
JS:
var nameValue = document.getElementById("uniqueID").value;
document.getElementById("output").innerHTML=nameValue;
will work for you !

upload a particular picture instead of submitting full form

I have a form name editdata.php. around 10 html controls(text box,file,select) using. I have a file control their picture of user is displaying and below this a file control is attached to change picture. I want that when a user browse and then change picture picture will automatically changed but form will not submit. so is this possible to upload picture without submitting the full form.
<html>
<head>
<meta charset="UTF-8">
<html lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1"> <!--requuired for bootstrap -->
<link rel="stylesheet" href="Bootstrap/bootstrap.min.css" /> <!--bootstrap files -->
<script src="Bootstrap/jquery.min.js"></script>
<script src="Bootstrap/bootstrap.min.js"></script>
<style>
.error
{
color: red;
}
</style>
<title></title>
</head>
<body>
<div class="container">
<h1>Login Form</h1>
<h2><?php if(isset($_REQUEST['msg'])) echo $_REQUEST['msg'] ?></h2> <!-- Successful messgaeg if chnaged password -->
<form action="index.php" method="post" onsubmit="return checkData()" role="">
<div class="form-group">
<label>Username*</label>
<div><input type="text" class="form-control" id="uname" value="<?php if(isset($un)) echo $un; ?>" name="uname" onblur="setTimeout(function abc(){check_login_data('uname erruname blur', 'Username Must Be Entered')},130)" onfocus="check_login_data('uname erruname focus')" placeholder="Enter Username" /> <!-- textbox for username and checking value for cookie -->
</div>
</div>
<span class="error" id="erruname"> <?php if (isset($errorforusrnam)) echo $errorforusrnam; ?> </span> <!-- set a span for displaying error on emplty textbox -->
<div class="form-group">
<label>Password*</label>
<div><input type="password" class="form-control" id="password_id" name="upass" value="<?php if(isset($up)) echo ($up); ?>" placeholder="Enter Password" onblur="setTimeout(function abc(){check_login_data('password_id errpassword blur','Password Should Entered')},130)" onfocus="check_login_data('password_id errpassword focus')" /> <!-- textbox for Password and checking value for cookie -->
</div>
</div>
<span class="error" id="errpassword"> <?php if(isset($errorforpwd)) echo $errorforpwd ?> </span> <!-- set a span for displaying error on emplty textbox -->
<?php
if(isset($_SESSION['counter']) && $_SESSION['counter']>3) //captcha will show if user attempts more then 3
{
echo "<div class=form-group >"; //div for captcha
echo "<label for=captcha >Captcha*</label>";
echo "<div id=captcha_id>";
echo "<img id=imgCaptcha class=img-responsive src=captcha/create_image.php >";
echo '</div>';
echo '<div>';
echo "<div>";
echo "<input id=txtCaptcha class=form-control type=text name=txtCaptcha value='' placeholder='Enter Verification Code' />";
echo "<div><input class=btn btn-default type=button onclick=change_captcha() value=Reload /></div>";
echo "</div>";
echo "</div>";
echo "</div>"; //end of div
echo "<span class =error id=errco>"; //this will show error of div
if(isset($error))
{
echo $error;
}
echo '</span>';
}
?>
<div class="checkbox">
<label><input type="checkbox" name="chq" value="">Remember Me</label>
</div>
<div>
<input type="submit" name="sub" value="Login"class="btn btn-default" />
<a href="signup.php" />Signup</a>
<a href="forget_password.php" >Forgot Password</a>
</div>
<!-- <span id="span" ></span> span for showing output -->
</form>
</div>
</body>
</html>
and yeah all work will must have in single form...not is two forms. here I used two forms but I want to have a single form
GO through this liThis may Help You,
Ajax upload image on form showing thumbnail

Calling PHP function wth HTML button

I am developing website using php.I need to call php function using HTML Onclick event. How to do? Here I have given my code.
<?php
function insert() {
echo "in insert ";
$servername = "localhost";
$username = "shwetharao";
$password = "shwetha";
$dbname = "semilab";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$uname = $_POST['usernameu'];
$upass = $_POST['passwordu'];
echo $uname;
$sql = "INSERT INTO login (id, username, password)VALUES ('id','$uname','$upass')";
if ($conn->query($sql) === TRUE) {
echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
}
?>
<!DOCTYPE HTML>
<head>
<title></title>
</head>
<body>
<div id="main">
<div id="login">
<h2>Create User Account</h2>
<form action="" method="post">
<br><br><br>
<label>UserName :</label>
<br><br>
<input id="name" name="usernameu" placeholder="username" type="text">
<br><br><br>
<label>Password :</label>
<br><br>
<input id="password" name="passwordu" placeholder="**********" type="password">
<br><br><br>
<input name="button" type="button" value=" Create user " onclick="insert();">
</form>
</div>
</div>
</body>
</html>
I need to call function insert()[which is php function] on clicking button.How to achieve this?
Try this
<?php if(isset($_POST['submit'])){
insert();
}
?>
<!DOCTYPE HTML>
<head>
<title></title>
</head>
<body>
<div id="main">
<div id="login">
<h2>Create User Account</h2>
<form action="" method="post">
<br><br><br>
<label>UserName :</label>
<br><br>
<input id="name" name="usernameu" placeholder="username" type="text">
<br><br><br>
<label>Password :</label>
<br><br>
<input id="password" name="passwordu" placeholder="**********" type="password">
<br><br><br>
<input name="submit" type="submit" value=" Create user" >
</div>
</div>
</body>
</html>
you did two mistake first one is php tag at above, you wrote only "?" please change it to '<form action="" method="post">
inside of form you don't write action page name ..for example action = "myFile.php"
PHP: Is only run by the server and responds to requests like clicking on a link (GET) or submitting a form (POST).
HTML & Javascript: Is only run in someone's browser
I'm assuming your file looks something like:
<?php
function insert() {
echo 'I just ran a php function';
}
if(isset($_POST['submit'])){
insert();
}
?>
<!DOCTYPE HTML>
<head>
<title></title>
</head>
<body>
<div id="main">
<div id="login">
<h2>Create User Account</h2>
<form action="" method="post">
<br><br><br>
<label>UserName :</label>
<br><br>
<input id="name" name="usernameu" placeholder="username" type="text">
<br><br><br>
<label>Password :</label>
<br><br>
<input id="password" name="passwordu" placeholder="**********" type="password">
<br><br><br>
<input name="submit" type="submit" value=" Create user" >
</div>
</div>
</body>
</html>
Just change
<input name="button" type="button" value="Create user" onclick="insert();">
to
<input name="button" type="submit" value="Create user">
And paste your php code inside this
<?php if(isset($_POST['submit'])){
//paste you php code here
}
?>
<?php
if($_GET){
if(isset($_GET['insert'])){
insert();
}elseif(isset($_GET['select'])){
select();
}
}
function select()
{
echo "The select function is called.";
}
function insert()
{
echo "The insert function is called.";
}
?>
<input type="submit" class="button" name="insert" value="insert" />
<input type="submit" class="button" name="select" value="select" />
===============================================
<?php
if($_GET['button1']){fun1();}
if($_GET['button2']){fun2();}
function fun1()
{
//This function will update some column in database to 1
}
function fun2()
{
//This function will update some column in database to 2
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
</head>
<body>
<button id="btnfun1" name="btnfun1" onClick='location.href="?button1=1"'>Update to 1</button>
<button id="btnfun2" name="btnfun2" onClick='location.href="?button2=1"'>Update to 2</button>
</body>
</html>
I did it using this code. Hope this helps.

html form,db submission,empty data on refresh or back

I have a from submitting data to db,and after entering in to db thank you message comes,everything is in same page.the problem is wheni refresh or go back the same data or empty data is entered in to db. Please help`
<?php
$myServer = "localhost";
$myUser = "root";
$myPass = "";
$myDB = "sample";
$name=$_POST['fname'];
$mobile=$_POST['mobile'];
$email=$_POST['email'];
//connection to the database
$dbhandle = mysql_connect($myServer, $myUser, $myPass)
or die("Couldn't connect to SQL Server on $myServer");
//select a database to work with
$selected = mysql_select_db($myDB, $dbhandle)
or die("Couldn't open database $myDB");
//echo "$myDB";
//Insert data into db
mysql_query("INSERT INTO reg(name,mobile,email) values ('$name','$mobile','$email')");
/* echo "$name";
echo "$mobile";
echo "$email"; */
//header("location:thank.html");
?>
<!doctype html>
<html>
<head>
<title>Basic form with validation</title>
<link rel="stylesheet" href="style/style.css" type="text/css" media="all"/>
</head>
<body>
<div style="width:300px; background:#19a3d1;margin:0 auto;height:200px;">
<?php
if(empty($_POST))
{
?>
<form name="myform" id="frm1" action="index.php" method="post" style="margin:0 auto;"onsubmit="return(validate());">
<h1 style="text-align:center">Form</h1>
<div style="display: table; margin:0 auto;">
<div style="display: table-row;">
<div style="display: table-cell;padding:5px;">
<label>Name</label>
</div>
<div style="display: table-cell;">
<input type="text" name="fname" id="fname" placeholder="Name" />
</div>
</div>
<div style="display: table-row;">
<div style="display: table-cell;padding:5px;">
<label>Mobile</label>
</div>
<div>
<input type="text" name="mobile" id="mobile" placeholder="Mobile" />
</div>
</div>
<div style="display: table-row;">
<div style="display: table-cell;padding:5px;">
<label>Email</label>
</div>
<div>
<input type="text" name="email" id="email" placeholder="Email" />
</div>
</div>
<div style="display: table-row;">
<div style="display: table-cell;padding:5px;" ></div>
<div style="display: table-cell;padding:5px;"><input type="submit" value="Submit"></div>
</div>
</div>
</form>
<?php
}
else{
?>
<div id="thank" >
<span style="color:#ff0000;padding:30px;text-align:center;display:block;">Thank you!!</span>
</div>
<?php
}
?>
</div>
<script src="js/main.js"></script>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</body>
</html>`
Give name of your submit button.
Like
<input type="submit" value="Submit" name="btnSubmit">
And Write PHP Code like this :
<?php
......
......
if(isset($_POST['btnSubmit']))
{
Your code....
}
?>
Or
You can use ajax to submit the form data.
http://www.formget.com/submit-form-using-ajax-php-and-jquery/

Why javascript not showing value in textfield

<html>
<head>Testing</head>
<body>
<?php
if(isset($_POST['postbtn'])){
echo "<script>alert('I am here')</script>";
echo "<script>document.getElementById('txt_name').value='edit'</script>";
}
?>
<div id="wrap">
<form id="data_entry" method="POST" action="<?php echo $_SERVER['PHP_SELF'];?>">
<div class="rowbox">
<input type="text" class="textbox" id="txt_name" value="">
</div>
<div class="btn">
<input type="submit" id="postme" name="postbtn">
</div>
</form>
</div>
</body>
</html>
I'm new to javascript and php, what I need to know is after submitting the form I can see the alert message "I am here" but I don't see the value that I am posting using the document.getElementById in the textfield for the html form. Why?
Thanks
Because the element has not loaded yet, move your script to the end of the body.
<?php
if(isset($_POST['postbtn'])){
echo "<script>alert('I am here')</script>";
echo "<script>document.getElementById('txt_name').value='edit';</script>";
}
?>
</body>
</html>

Categories

Resources