I have HTML form fields on a contact page which then send the data to a php page.
I would like to make the form fields required and show a red (*) next to the label if the user does not enter a value.
How can I do this?
<form id="contact_form" method="post" action="contact.php">
<p style="margin-top:20px">
<label for="title">Title</label><br/>
<input id="your_name" name="your_name" type="text" style="width:94%"/>
</p>
<p style="margin-top:20px">
<label for="initial">Initial</label><br/>
<input id="initial" name="initial" type="text" style="width:94%"/>
</p>
<p style="margin-top:20px">
<label for="surname">Surname</label><br/>
<input id="surname" name="surname" type="text" style="width:94%"/>
</p>
<p style="margin-top:20px">
<label for="tel_number">Tel number</label><br/>
<input id="tel_number" name="tel_number" type="text" style="width:94%"/>
</p>
<p style="margin-top:20px">
<label for="email">Email</label><br/>
<input id="email" name="email" type="text" style="width:94%"/>
</p>
<p style="margin-top:20px">
<label for="enquiry">Enquiry</label><br/>
<textarea id="enquiry" name="enquiry" rows="7" cols="10" style="width:94%"></textarea>
</p>
<p style="margin-top:50px">
<input type="submit" value="Send Message"/><br/>
</p>
</form>
You will have to put the form in a php file (or .phtml recommended*). Add a css class like .input-error.
.input-error { color: red; }
In your form you'll need something like this for each field:
if (empty($postData['field']) {
echo "<span class=\"input-error\">*</span>";
}
To give a clear-cut example:
<p style="margin-top:20px">
<?php if (empty($postData['your_name']): ?>
<span class="input-error">*</span>
<?php endif; ?>
<label for="title">Title</label><br/>
<input id="your_name" name="your_name" type="text" style="width:94%"/>
</p>
The form will have to submit to a php file that will process the form and bring you back to this page. In that file you'd need a line like this:
$postData = $_POST;
Or, if that script redirects to another page then you'll need to store the post data in the session. like:
$_SESSION['postData'] = $_POST;
In which case, at the top of your form or somewhere in the controller (if there is one), retrieve that data like so:
$postData = $_SESSION['postData'];
Related
My form which contains the summernote editor:
<form class="form-group" action="upload.php" style="width: 700px;" method="post" enctype="multipart/form-data">
<label> Title: </label>
<input name="title" class="form-control" type="text" required placeholder="Title"/><br><br>
<label> Header Image: </label>
<input class="form-control" type="file" name="file" id="file"><br><br>
<label> Body: </label><div id="summernote"></div>
<button class="btn btn-primary" onclick="getContent()" name="submit"> Submit </button>
</form>
script to get the content of the editor:
<script>
$(document).ready(function()
{
$('#summernote').summernote();
});
function getContent(){$(document).ready(function()
{
var content = $('#summernote').summernote('code');
content=document.getElementById('content').value;});
}
Php code to save the content of the summernote:
$uname= $_SESSION['id'];
$title=$_POST['title'];
$path= "uploads/".$name;
$body= ;
I am trying to save the content of the summernote in the variable $body which is in another file called upload.php
Instead of div use text area .
<textarea name="content" id="summernote"></textarea>
Form.
<form class="form-group" action="upload.php" style="width: 700px;" method="post" enctype="multipart/form-data">
<label> Title: </label>
<input name="title" class="form-control" type="text" required placeholder="Title"/><br><br>
<label> Header Image: </label>
<input class="form-control" type="file" name="file" id="file"><br><br>
<label> Body: </label>
<!--Instead of div use text area .-->
<textarea name="content" id="summernote"></textarea>
<button type="submit" class="btn btn-primary" name="submit"> Submit </button>
</form>
Then no need use getContent. only call summernote for editor.
<script>
$(document).ready(function()
{
$('#summernote').summernote();
});
</script>
in upload.php you can get the content by $_POST['content']
<?php
$title=$_POST['title'];
$path= "uploads/".$name;
echo $body=$_POST['content'];
?>
I am not really a professional when it comes to this but I would add a hidden input to the form and put the content (getContent) in that field.
<form class="form-group" id="theForm" action="upload.php" style="width: 700px;" method="post" enctype="multipart/form-data">
<label> Title: </label>
<input name="title" class="form-control" type="text" required placeholder="Title"/><br><br>
<label> Header Image: </label>
<input class="form-control" type="file" name="file" id="file"><br><br>
<label> Body: </label><div id="summernote"></div>
<input id="content-catcher" type="hidden" name="contentOfEditor" />
<button class="btn btn-primary" onclick="getContent()" name="submit"> Submit </button>
</form>
Script:
function getContent(){$(document).ready(function()
{
var content = $('#summernote').summernote('code');
content=document.getElementById('content').value;});
$('#content-catcher').val(content);
$('#theForm').submit();
}
PHP:
$body= $_POST['contentOfEditor'];
This question already has answers here:
File not uploading PHP
(11 answers)
Closed 4 years ago.
I am trying to upload an user image on server in php, but its giving me the error like bellow:
Notice: Undefined index: images in C:\xampp\htdocs\PDF\Registration\index_registration.php on line 20
Notice: Undefined index: images in C:\xampp\htdocs\PDF\Registration\index_registration.php on line 21
here's my code:
<?php include "includes/header.php"?>
<?php include "../db.php" ?>
<?php include "../functions.php" ?>
<!-- banner -->
<div class="center-container">
<div class="banner-dott">
<div class="main">
<h1 class="w3layouts_head">Readers Registration</h1>
<div class="w3layouts_main_grid">
<?php
if (isset($_POST['submit'])){
$name = escape($_POST['name']);
$password = escape($_POST['password']);
$first_name = escape($_POST['first_name']);
$last_name = escape($_POST['last_name']);
$email = escape($_POST['email']);
$p_image = $_FILES['images']['name'];
$post_image_temp = $_FILES['images']['tmp_name'];
$role = 'subscriber';
move_uploaded_file($post_image_temp, "user_picture/$p_image");
$query = "insert into user (name, password, first_name, last_name, email, image, role) values ('{$name}', '{$password}', '{$first_name}', '{$last_name}', '{$email}','{$p_image}', '{$role}')";
$execute = mysqli_query($connection, $query);
}
?>
<form action="" method="post" class="w3_form_post">
<div class="w3_agileits_main_grid w3l_main_grid">
<span class="agileits_grid">
<label>First Name </label>
<input autocomplete="off" type="text" name="first_name" placeholder="First Name" required="">
</span>
</div>
<div class="w3_agileits_main_grid w3l_main_grid">
<span class="agileits_grid">
<label>Last Name </label>
<input autocomplete="off" type="text" name="last_name" placeholder="Last Name" required="">
</span>
</div>
<div class="w3_agileits_main_grid w3l_main_grid">
<span class="agileits_grid">
<label>Your Email </label>
<input autocomplete="off" type="email" name="email" placeholder="Your Email" required="">
</span>
</div>
<div class="w3_agileits_main_grid w3l_main_grid">
<span class="agileits_grid">
<label>User Name </label>
<input autocomplete="off" type="text" name="name" placeholder="User Name" required="">
</span>
</div>
<div class="w3_agileits_main_grid w3l_main_grid">
<span class="agileits_grid">
<label>Password </label>
<input autocomplete="off" class="form-control mx-sm-3" type="text" name="password" placeholder="Password" required="">
</span>
</div>
<br>
<div class="input-group mb-3">
<div class="custom-file">
<input type="file" class="custom-file-input" id="inputGroupFile01">
<label class="custom-file-label" for="inputGroupFile01">Choose file</label>
</div>
</div>
<div class="w3_main_grid">
<div class="w3_main_grid_right">
<input type="submit" name="submit" value="Submit">
</div>
</div>
</form>
</div>
<?php include "includes/footer.php"?>
Note:
I took a folder named user_picture to store all pictures, and using a bootstrap class as a file uploader. CAN ANYONE PLEASE HELP ME TO FIGURE OUT MY ERROR...!
Need to add name attribute to file input field, only then images can be retrieved from $_FILES variable in PHP file. Code for reference:
<input type="file" class="custom-file-input" id="inputGroupFile01" name="images">
Also add enctype attribute to form to allow posting media files like:
<form action="" method="post" class="w3_form_post" enctype="multipart/form-data">
Form element must look like this:
<form action="" method="post" class="w3_form_post" enctype="multipart/form-data">
In your code i found this two issue please check,
<form action="" method="post" class="w3_form_post" enctype="multipart/form-data">
<input type="file" class="custom-file-input" name="images" id="inputGroupFile01">
I hope this will help you.
I wrote a simple HTML/PHP form that takes input from a form and outputs to HTML to create a company standard email signature. It just echoes the strings from the form fields into the HTML for the signature.
Form:
<form action="sig.php" method="post">
Full Name: <input type="text" name="fullName"><br>
Job Title: <input type="text" name="jobTitle"><br>
Direct Phone Number (xxx.xxx.xxxx) <input type="text" name="phoneNumber"><br>
Email: <input type="text" name="email"><br>
<input type="submit">
</form>
PHP:
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#0E5881">
Please copy/paste the following into your email signature:
</div>
<hr>
<br>
<br>
<div style="font-size:12pt; font-family:'Arial',sans-serif;color:#133467">
<b><?php echo $_POST["fullName"]; ?></b>
</div>
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#0E5881">
<?php echo $_POST["jobTitle"]; ?>
</div>
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#656565">
Direct:</b> <?php echo $_POST["phoneNumber"]; ?>
<br>
<?php echo $_POST["email"]; ?> | www.Example.com
</div>
<br>
<div style="font-size:20pt; font-family:'Arial',sans-serif;color:#676767">
<b>Example.com</b>
It works great, but now they tell me they want to put it on our company's SharePoint Online site.
As far as I can tell, there is no way to run the PHP on SharePoint. I also can't use a PageViewer Web Part.
What is my best option for doing this through SharePoint? Something client side that will run inside of SharePoint? I think Java Script is an option, but I don't know anything about it. I know SharePoint uses ASP, but I know even less about that.
Any help would be appreciated!
PHP is server-side code, which you cannot add in SharePoint online unless you're willing to write your own SharePoint apps.
For something like this, your best bet is probably just a page with some JavaScript.
document.getElementById("btnSubmit").addEventListener("click", function() {
document.getElementById("signaturePanel").style.display = "inherit";
document.getElementById("fullNameOut").innerHTML = document.getElementById("fullName").value;
document.getElementById("jobTitleOut").innerHTML = document.getElementById("jobTitle").value;
document.getElementById("phoneNumberOut").innerHTML = document.getElementById("phoneNumber").value;
var email = document.getElementById("email").value;
var emailOut = document.getElementById("emailOut");
emailOut.innerHTML = email;
emailOut.href = "mailto:" + email;
document.getElementById("socialOut").style.display = document.getElementById("social").checked ? "inherit" : "none";
});
Full Name:
<input type="text" id="fullName" />
<br>Job Title:
<input type="text" id="jobTitle" />
<br>Direct Phone Number (xxx.xxx.xxxx)
<input type="text" id="phoneNumber" />
<br>Email:
<input type="text" id="email" />
<br>
<input type="checkbox" id="social" checked="checked" />Include social media links
<br/>
<input type="button" id="btnSubmit" value="submit" />
<div id="signaturePanel" style="display:none">
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#0E5881;">
Please copy/paste the following into your email signature:
</div>
<hr>
<br>
<br>
<div style="font-size:12pt; font-family:'Arial',sans-serif;color:#133467">
<b><span id="fullNameOut"></span></b>
</div>
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#0E5881">
<span id="jobTitleOut"></span>
</div>
<div style="font-size:10pt; font-family:'Arial',sans-serif;color:#656565">
Direct:</b> <span id="phoneNumberOut"></span>
<br>
<a id="emailOut" href="mailto:"></a> | www.Example.com
</div>
<br>
<div style="font-size:20pt; font-family:'Arial',sans-serif;color:#676767">
<b>Example.com</b>
<div id="socialOut" style="display:none">
<a href="http://example.com">
<img src="https://placeholdit.imgix.net/~text?txtsize=15&txt=twitter+link&w=90&h=90&txttrack=0" />
</a>
</div>
</div>
I'm creating a checkout system. I have three parts to it:
Shipping info
Payment info
Order confirmation
I'm trying to figure out a way that when the customer enters their shipping information, that data can be echo'd out onto my order confirmation part, so they can confirm that is where they want it shipped to.
The way I designed my checkout system is that all three parts are on the same page. Only one part shows at once and the others are hidden until the customer would click 'Proceed to xxxx'. When they click that Proceed button, nothing is being sent. It is just taking the div and showing it and hiding the previous div. Nothing is sent until when the customer clicks Submit order on the confirmation div.
I validate the fields and assigned them to variables so I can post the shipping and product info into my db.
if($validation->passed()) {
if(isset($_POST['create'])){
$fullname = trim( $_POST['customer_name'] );
$streetline1 = trim( $_POST['streetline1'] );
$streetline2 = trim( $_POST['streetline2'] );
$city = trim( $_POST['city'] );
$state = trim( $_POST['state'] );
$zipcode = trim( $_POST['zipcode'] );
$phone_number = trim( $_POST['phone_number'] );
$email = ( $_POST['email'] );
//etc...
Shipping Information Section:
<div class="shippinginfocontainer">
<span class="summarytitle">
<p>Enter Shipping Information</p>
</span><br>
<div class="center">
<div class="field">
<label class="paddingleft" for="fullname">Full Name</label>
<div class="center">
<input type="text" class="biginputbarinline" name="fullname" value="<?php echo escape(Input::get('firstname')); ?>" required>
</div>
</div>
<div class="field">
<label class="paddingleft" for="streetline1">Street Line 1</label>
<div class="center">
<input type="text" class="biginputbarinline" name="streetline1" value="<?php echo escape($user->data()->streetline1); ?>" required>
</div>
</div>
<div class="field">
<label class="paddingleft" for="streetline2">Street Line 2</label>
<div class="center">
<input type="text" class="biginputbarinline" name="streetline2" value="<?php echo escape($user->data()->streetline2); ?>">
</div>
</div>
<div class="field">
<label class="paddingleft" for="city">City</label>
<div class="center">
<input type="text" class="biginputbarinline" name="city" value="<?php echo escape($user->data()->city); ?>" required>
</div>
</div>
</div>
<div class="formleftcenter">
<div class="field">
<label for="state">State</label>
<input type="text" class="mediuminputbar" name="state" value="<?php echo escape($user->data()->state); ?>" required>
</div>
<div class="field">
<label for="Phone Number">Phone Number</label>
<input type="text" class="mediuminputbar" name="Phone Number" value="<?php echo escape($user->data()->phone_number); ?>">
</div>
</div>
<div class="formrightcenter">
<div class="field">
<label for="zipcode">Zip Code</label>
<input type="text" class="mediuminputbar" name="zipcode" value="<?php echo escape($user->data()->zipcode); ?>" required>
</div>
<div class="field">
<label for="email">Email</label>
<input type="text" class="mediuminputbar" name="email" value="<?php echo escape($user->data()->email); ?>" required>
</div>
</div>
<div class="clear">
<button class="checkoutbutton" id="button2">Proceed to Payment Information</button>
</div>
</div>
I won't add my payment part as it is irrelevant to this question.
Then this is the relevant part of the Confirmation part. I wasn't sure how to do this, so I just wrote in echo's to show what I am trying to do.
<div class="confirmshippinginfo">
<p>Shipping to:</p>
<p><?php echo $fullname; ?></p>
<p><?php echo $streetline1; ?></p>
<p><?php echo $streetline2; ?></p>
<p><?php echo $city . $state . $zipcode; ?></p>
</div>
</div>
<input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
<input class="widebutton" type="submit" value="Place Your Order">
Is there a way to do this with keeping this all on the same page? I really do not want to have multiple pages for this and I like the way I have all of this formatted. I just can't figure out this part.
You could possibly use AJAX via serialize() of your form when you click a review button (as Matthew Johnson suggested). Second idea is something like this where you copy from one input to another, in a different part of your page. It would take a bit more work to set up than something like AJAX because you are basically duplicating a form. Using .html() inside a div or span placeholder would probably work too:
HTML:
<input type="text" class="copy-from" data-copy="name" name="name" />
<input type="text" class="this-elem" id="name" disabled />
CSS
.this-elem {
border: none;
font-size: 18px;
color: #333;
}
jQuery
$(document).ready(function() {
$(".copy-from").keyup(function() {
var ElemId = $(this).data('copy');
$("#"+ElemId).val($(this).val());
});
});
Demo
http://jsfiddle.net/fh5kfhtm/4/
EDIT: AJAX/PHP Solution
<!-- This is the placeholder for the data after submission -->
<div id="final"></div>
<!-- FORM, well really simplified form -->
<form id="orderform" method="post" action="process.php">
<input type="hidden" name="order_form" />
<input type="text" name="address" />
<!--
This triggers the ajax (you would use your
"Proceed to Order Confirmation" button)
-->
<div id="confirm">CONFIRM</div>
<input type="submit" name="submit" value="ORDER" />
</form>
new.php
File name/path must match what's in the AJAX url
<?php
if(isset($_POST['order_form'])) {
print_r($_POST);
exit;
}?>
jQuery AJAX
<!-- GET THE LIBRARIES (YOU SHOULD ALREADY HAVE THEM) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script>
$(document).ready(function() {
$("#confirm").click(function() {
$.ajax({
// This is where you need the right path to the new php file
url:'/path/to/new.php',
type: 'post',
data: $("#orderform").serialize(),
success: function(response) {
$("#final").html(response);
}
});
});
});
</script>
I have added an aweber form on my project file called adduser.php. It has three fields First name, Last Name and Email. When user will submit form data they will go to welcome.php page. In welcome.php page I have some welcome message and and button called "Start". When a user click on "Start" Button they will get a custom form.
So, My question is now, How can i show previously data that was submited by user on adduser.php on my custom form.
Remember that I did not use any custom database to store adduser.php form data. This page handled by aweber.com embedded Perl script.
There are total four pages on my Project folder. one is adduser.php and then welcom.php, then custom.from.php and last one is thankyou.php.
This is the form script for adduser.php. It is a embedded from script provided by aweber.com.
<form method="post" class="af-form-wrapper" action="https://www.aweber.com/scripts/addlead.pl" >
<div style="display: none;">
<input type="hidden" name="meta_web_form_id" value="1305186106" />
<input type="hidden" name="meta_split_id" value="" />
<input type="hidden" name="listname" value="awlist3791609" />
<input type="hidden" name="redirect" value="http://localhost/php/intro.php?" id="redirect_33699466c49909887d43ec924c761a52" />
<input type="hidden" name="meta_adtracking" value="My_Web_Form" />
<input type="hidden" name="meta_message" value="1" />
<input type="hidden" name="meta_required" value="name (awf_first),name (awf_last),email" />
<input type="hidden" name="meta_tooltip" value="" />
</div>
<div id="af-form-1305186106" class="af-form">
<div id="af-header-1305186106" class="af-header">
<div class="bodyText">
<p> </p>
</div>
</div>
<div id="af-body-1305186106" class="af-body af-standards">
<div class="af-element">
<label class="previewLabel" for="awf_field-71044792-first">First Name:</label>
<div class="af-textWrap">
<input id="awf_field-71044792-first" type="text" class="text" name="name (awf_first)" value=""/>
</div>
<div class="af-clear"></div>
</div>
<div class="af-element">
<label class="previewLabel" for="awf_field-71044792-last">Last Name:</label>
<div class="af-textWrap">
<input id="awf_field-71044792-last" class="text" type="text" name="name (awf_last)" value=""/>
</div>
<div class="af-clear"></div>
</div>
<div class="af-element">
<label class="previewLabel" for="awf_field-71044793">Email: </label>
<div class="af-textWrap">
<input class="text" id="awf_field-71044793" type="text" name="email" value=""/>
</div>
<div class="af-clear"></div>
</div>
<div class="af-element buttonContainer">
<input name="submit" type="submit" class="btn btn-success" value="Start Screening"/>
</div>
</div>
</div>
</form>
I'm in big trouble, I'm unable to handle I'm waiting for support from expert developer. I'm still working on local server connected with internet.
You can use $_SESSION to use your variables through your entire application runtime. At the end, just close them to clear your users browsers.
It's a common practice used by "flash session messages". They setup the message by $_SESSION and close when the variables has no use anymore.
Change the default action of your form
<form method="post" class="af-form-wrapper" action="https://www.aweber.com/scripts/addlead.pl" >
to
<form method="post" class="af-form-wrapper" action="trial.php" >
In this file trial.php, start the seeion first and then use the session variables as follows
session_start();
$_SESSION["first-title"] = $_POST['awf-first'];
and so on for each of the form inputs and then redirect the page to default action using location
header('Location : Aweber perl script link');