I want to add a contact form on my page but I've never worked with PHP before. I need help, please?
I'm working with the form below:
<a name="Contact"></a>
<div class="contact">
<div class="container">
<div class="row">
<div class="col-lg-8">
<h1 class="page-header text-center">Get in touch!</h1>
<form class="form-horizontal" role="form" method="post" action="index.php">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" placeholder="First & Last Name" value="<?php echo htmlspecialchars($_POST['name']); ?>">
<?php echo "<p class='text-danger'>$errName</p>";?>
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" name="email" placeholder="example#domain.com" value="<?php echo htmlspecialchars($_POST['email']); ?>">
<?php echo "<p class='text-danger'>$errEmail</p>";?>
</div>
</div>
<div class="form-group">
<label for="message" class="col-sm-2 control-label">Message</label>
<div class="col-sm-10">
<textarea class="form-control" rows="4" name="message"><?php echo htmlspecialchars($_POST['message']);?></textarea>
<?php echo "<p class='text-danger'>$errMessage</p>";?>
</div>
</div>
<div class="form-group">
<label for="human" class="col-sm-2 control-label">2 + 3 = ?</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="human" name="human" placeholder="Your Answer">
<?php echo "<p class='text-danger'>$errHuman</p>";?>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
</div>
</div>
<div class="form-group">
<div class="col-lg-10 col-sm-offset-2">
<?php echo $result; ?>
</div>
</div>
</form>
</div>
For for some reason, it's not displaying properly. This is how it looks:
screenshot of contact form
Related
I am a beginner in web development, I used have an html elements, like textbox and other type of elements, I want to use them as my object and when they have a value and click a button, it will save the value of all the elements in mysql.
I have a code like this, but it cannot be inserted and anything does not happen when clicking a button.
Please help.
PHP:
<?php
define('DB_SERVER', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_DATABASE', 'ytp');
$db = mysqli_connect(DB_SERVER,DB_USERNAME,DB_PASSWORD,DB_DATABASE);
if(!$db ) {
die('Could not connect: ' . mysqli_error());
}
$fname = "";
$mname = "";
$lname = "";
$funame = "";
$cnum = "";
$bday = "";
$age = "";
$add = "";
if (isset($_POST['submit'])){
$fname = $_POST['fName'];
$mname = $_POST['mName'];
$lname = $_POST['lName'];
$funame = $_POST['fuName'];
$cnum = $_POST['Cnumber'];
$bday = $_POST['bday'];
$age = $_POST['age'];
$add = $_POST["address"];
}
$sql = "INSERT INTO employee ".
"(fName,mName,lName,fuName,cNumber,bDay,Age,Address) ".
"VALUES ('$fname','$mname','$lname','$funame','$cnum','$bday','$age','$add' )";
if (! mysqli_query($db , $sql)){
echo 'Cannot Insert';
}
else{
echo 'Success';
}
?>
HTML:
<div class="content">
<div class="row">
<div class="col-md-10">
<div class="card">
<div class="card-header">
<h5 class="title">Add User Information</h5>
</div>
<div class="card-body">
<form method="POST" action="php_functions\saveEmployee.php" name="INSERT">
<div class="row">
<div class="col-md-5 pr-md-1">
<div class="form-group">
<label>Company (disabled)</label>
<input type="text" class="form-control" disabled="" placeholder="Company" value="Benchmark Valuer's Inc.">
</div>
</div>
<div class="col-md-3 px-md-1">
<div class="form-group">
<label>ID</label>
<input type="text" class="form-control" placeholder="User ID" value="" id="id" name ="id" disabled>
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" placeholder="s.sample#gmail.com" id="email" name ="email">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>First Name</label>
<input type="text" class="form-control" placeholder="First Name" id="fName" name ="fName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Middle Name</label>
<input type="text" class="form-control" placeholder="Middle Name" id="mName" name ="mName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Last Name</label>
<input type="text" class="form-control" placeholder="Last Name" id="lName" name ="lName">
</div>
</div>
<div class="col-md-4 pl-md-1" hidden>
<div class="form-group">
<label>Fullname</label>
<input type="text" class="form-control" placeholder="Full Name" id="fuName" name ="fuName">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Contact Number</label>
<input type="tel" class="form-control" placeholder="Contact Number" id="Cnumber" name="Cnumber">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Age</label>
<input type="number" class="form-control" placeholder="Age" id="age" name="age">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Birthday</label>
<input type="date" class="form-control" placeholder="Birthday" id="bday" name="bday">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label>Address</label>
<input type="text" class="form-control" placeholder="Home Address" id="address" name ="address">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" placeholder="Username" id="uName">
</div>
</div>
<div class="col-md-4 px-md-1">
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" placeholder="Password" id="pWord">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>UserType</label>
<input type="number" class="form-control" placeholder="0" id="uType">
</div>
</div>
</div>
<div class="row" hidden>
<div class="col-md-12">
<div class="form-group">
<label>Image Path:</label>
<input type="text" class="form-control" placeholder="C:\\" id="imageURL">
</div>
</div>
</div>
</form>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-fill btn-primary" id="submit" name="submit">Save</button>
<button class="btn btn-fill btn-success" id="btnBrowse">Browse</button>
<button class="btn btn-fill btn-danger" id="btnCancel">Cancel</button>
</div>
</div>
</div>
</div>
</div>
Your HTML form is closing before submit button. You should close that after submit button and also need to manage hierarchy of opening form tag as below:
<form method="POST" action="php_functions\saveEmployee.php" name="INSERT">
<div class="card-body">
<div class="row">
<div class="col-md-5 pr-md-1">
<div class="form-group">
<label>Company (disabled)</label>
<input type="text" class="form-control" disabled="" placeholder="Company" value="Benchmark Valuer's Inc.">
</div>
</div>
<div class="col-md-3 px-md-1">
<div class="form-group">
<label>ID</label>
<input type="text" class="form-control" placeholder="User ID" value="" id="id" name ="id" disabled>
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" placeholder="s.sample#gmail.com" id="email" name ="email">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>First Name</label>
<input type="text" class="form-control" placeholder="First Name" id="fName" name ="fName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Middle Name</label>
<input type="text" class="form-control" placeholder="Middle Name" id="mName" name ="mName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Last Name</label>
<input type="text" class="form-control" placeholder="Last Name" id="lName" name ="lName">
</div>
</div>
<div class="col-md-4 pl-md-1" hidden>
<div class="form-group">
<label>Fullname</label>
<input type="text" class="form-control" placeholder="Full Name" id="fuName" name ="fuName">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Contact Number</label>
<input type="tel" class="form-control" placeholder="Contact Number" id="Cnumber" name="Cnumber">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Age</label>
<input type="number" class="form-control" placeholder="Age" id="age" name="age">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Birthday</label>
<input type="date" class="form-control" placeholder="Birthday" id="bday" name="bday">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label>Address</label>
<input type="text" class="form-control" placeholder="Home Address" id="address" name ="address">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" placeholder="Username" id="uName">
</div>
</div>
<div class="col-md-4 px-md-1">
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" placeholder="Password" id="pWord">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>UserType</label>
<input type="number" class="form-control" placeholder="0" id="uType">
</div>
</div>
</div>
<div class="row" hidden>
<div class="col-md-12">
<div class="form-group">
<label>Image Path:</label>
<input type="text" class="form-control" placeholder="C:\\" id="imageURL">
</div>
</div>
</div>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-fill btn-primary" id="submit" name="submit">Save</button>
<button class="btn btn-fill btn-success" id="btnBrowse">Browse</button>
<button class="btn btn-fill btn-danger" id="btnCancel">Cancel</button>
</div>
</form>
Hope it helps you.
the form has been closed before the submit button.
the </form> tag should be placed after the <div class="card-footer">...</div>.
please try it. hope it will help.
I succesfully managed to add to my url an parameter but I can't increment it. For example, if I click on the submit button the url should transform from http://localhost/code/1 to http://localhost/code/2 . I have made an input hidden to access the url but I can't redirect it to the desired value, how can I do this? This is my PHP code:
<?php
$cod=strtoupper($_GET['params']);
$i=$_GET['params1'];
$id_rezervare="SELECT id FROM trezervare WHERE numar_rezervare = '$cod'";
$id_rezervare = $db->DbGetOne($id_rezervare);
$cod_rezervare="SELECT UPPER(numar_rezervare) FROM trezervare WHERE numar_rezervare = '$cod'";
$cod_rezervare = $db->DbGetOne($cod_rezervare);
$cod_rezervare1 = strtoupper($cod_rezervare);
$nr_camere="SELECT count(*) FROM trezervarecont WHERE idrezervare= $id_rezervare ";
$nr_camere = $db->DbGetOne($nr_camere);
$checkin_status=TRUE;
$actual_link = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$data_nasterii= $_GET['datanasterii'];
$test_arr = explode('/', $data_nasterii);
if(isset($_POST['trimite'])){
if (count($test_arr) == 3) {
if (checkdate($test_arr[0], $test_arr[1], $test_arr[2])) {
} else {
$message = "Date has an invalid format";
echo "<script type='text/javascript'>alert('$message');</script>";
}
} else {
$message = "No date selected";
echo "<script type='text/javascript'>alert('$message');</script>";
}
}
if(isset($_POST['trimite'])){
$i++;
}
?>
<div class="animated fadeOutZoom">
<div class="container container-sm animated fadeInDown">
<div class="center-block mt-xl">
<div class="panel">
<div class="panel-body">
<p class="pv text-bold">Check-in for room number <?php echo $i; ?></p>
<form action="" method="post">
<div class="row">
<div class="col-md-12 form-group">
<label for="nume">Nume</label>
<input type="text" id="text " class="form-control " name="nume" >
</div>
<input type="hidden" id="custId" name="checkin_status" value="<?php echo 1;?>">
<input type="text" id="custId" name="checkin_status" value="<?php echo $actual_link;?>">
<div class="col-md-12 form-group">
<label for="nume">Data Nasterii</label>
<input type="text" class="form-control" id="arrival_date" name="datanasterii"required/>
</div>
<div class="col-md-12 form-group">
<label for="nume">Locul nasterii</label>
<input type="text" id="text "class="form-control " name="loculnasterii" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Cetatenia</label>
<input type="text" id="text "class="form-control " name="cetatenie" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Localitate</label>
<input type="text" id="text "class="form-control " name="localitate" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Strada</label>
<input type="text" id="text "class="form-control " name="strada" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Numar strada</label>
<input type="text" id="text "class="form-control " name="nrstrada" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Tara</label>
<input type="text" id="text "class="form-control " name="tara" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Tip act</label>
<input type="text" id="text "class="form-control " name="tipact" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Serie act</label>
<input type="text" id="text "class="form-control " name="serieact" required>
</div>
<div class="col-md-12 form-group">
<label for="nume">Numar act</label>
<input type="text" id="text "class="form-control " name="nract" required>
</div>
</div>
<div class="row">
<div class="col-md-12 form-group">
<label for="telefon">Telefon</label>
<input type="phone" id="telefon " class="form-control " name="telefon" required>
</div>
</div>
<div class="row">
<div class="col-md-12 form-group">
<label for="email">Email</label>
<input type="email" id="email" class="form-control" name="email" required >
</div>
</div>
<div class="row">
<div class="col-md-6 form-group">
<?php if($i==$nr_camere) echo'
<input type="submit" value="Finalizeaza rezervarea" class="btn btn-primary" name="trimite">';
elseif ($i>$nr_camere) {
header("location:../finalizeaza.php");
}
else echo ' <input type="submit" value="Continua rezervarea" class="btn btn-primary" name="trimite">';
?>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.min.js"></script>
<script>
//$('#arrival_date, #departure_date').datepicker({format: 'yyyy/mm/dd'});
$('#arrival_date, #departure_date').datepicker({
format: 'yyyy-mm-dd',
endDate: '+0d',
minDate: '-120Y',
autoclose: true
});
</script>
I've created a form for a site that I'm developing as follows:
<div class="container contacts__container--02">
<? echo $this->Form->create('Email',array('class'=>'contact-form form','url'=>'/sendemail'));?>
<form class="contact-form form contacts__form--02">
<div class="contacts__form__inputs_box--02">
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4 contact_item">
<input
type="text"
placeholder="Your name"
value=""
name="data[Email][fullname]"
class="input input--cloud-border input--white"
minlength="3"
required
>
</div>
<div class="col-md-4 contact_item">
<input
type="text"
required placeholder="Your business"
value="" name="data[Email][business]"
class="input input--cloud-border input--white"
>
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4 contact_item">
<input
type="email"
required placeholder="Your email"
value=""
name="data[Email][email]"
class="input input--cloud-border input--white"
required
>
</div>
<div class="col-md-4 contact_item">
<input
type="text"
placeholder="Your phone"
value=""
name="data[Email][phone]"
class="input input--cloud-border input--white"
>
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4 contact_item">
<input
type="email"
required placeholder="Your website"
value="" name="data[Email][website]"
class="input input--cloud-border input--white"
>
</div>
<div class="col-md-4 contact_item">
<input
type="text"
placeholder="How did you hear about us?"
value="" name="data[Email][referer]"
class="input input--cloud-border input--white"
>
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<textarea
required placeholder="Your message"
value="" name="data[Email][message]"
class="contacts__form_textarea--02 input input--cloud-border input--white"
></textarea>
</div>
</div>
<div class="row submit_row">
<div class="col-md-2">
</div>
<div class="col-md-8 submit_button">
<div class="g-recaptcha" data-sitekey="<?php echo $siteKey ?>"></div>
</div>
</div>
<div class="row submit_row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<a id="sendForm" class="contacts__form_button--02 button button--yellow button--small-radius">send</a>
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<div id="response">
</div>
</div>
</div>
</form>
<? echo $this->Form->end(); ?>
</div>
</div>
But for some reason when I go to fill the form in all the fields, except for phone number are populated with my email address:
How can I set what autocomplete field should be used?
It was interpreting 'Email' as the field name rather than the form array. Changed to 'ContactForm' and it works fine now:
<? echo $this->Form->create('ContactForm',array('class'=>'contact-form form','url'=>'/sendemail'));?>
<form class="contact-form form contacts__form--02">
<div class="contacts__form__inputs_box--02">
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4 contact_item">
<input
type="text"
placeholder="Your name"
value=""
name="data[ContactForm][fullname]"
class="input input--cloud-border input--white"
minlength="3"
required
>
</div>
<div class="col-md-4 contact_item">
<input type="text" required placeholder="Your business" value="" name="data[ContactForm][business]" class="input input--cloud-border input--white">
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-4 contact_item">
<input type="email" required placeholder="Your email" value="" name="data[ContactForm][email]" class="input input--cloud-border input--white">
</div>
<div class="col-md-4 contact_item">
<input type="text" placeholder="Your phone" value="" name="data[ContactForm][phone]" class="input input--cloud-border input--white">
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<textarea required placeholder="Your message" value="" name="data[ContactForm][message]" class="contacts__form_textarea--02 input input--cloud-border input--white"></textarea>
</div>
</div>
<div class="row submit_row">
<div class="col-md-2">
</div>
<div class="col-md-8 submit_button">
<div class="g-recaptcha" data-sitekey="<?php echo $siteKey ?>"></div>
</div>
</div>
<div class="row submit_row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<a id="sendForm" class="contacts__form_button--02 button button--yellow button--small-radius">send</a>
</div>
</div>
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-8 contact_item">
<div id="response">
</div>
</div>
</div>
</form>
<? echo $this->Form->end(); ?>
I have a contact form in php which has has two tabs containing two different contact forms. I want to get all the values of both the forms and send it as an email. I have coded it for one of the tab, but i am not getting the values of each of the field in the contact form in that tab. Can anyone tell how to do this ? My code is shown below for one of the tab:
<form name="contactForm" id='contact_form' method="post" action=''>
<div tab-id="1" class="tab active">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="name" >
</div>
<div class="form-group col-sm-12 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="email address">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="telephone" placeholder="phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="Country" id="exampleInputName" placeholder="Country" >
</div>
<div class="form-group col-sm-12 padd">
<textarea class="form-control" name="message" rows="3" id="exampleInputMessage" placeholder="message" ></textarea>
</div>
</div>
<div class="form-group col-xs-12 padd">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-xs-8 padd">
<div class="g-recaptcha" data-sitekey="6LcJqyITAAAAABks5hnD6U_2ptu09RiXYOHvNNud"></div>
</div>
<div class="form-group col-sm-4 padd" id='submit'>
<input type="submit" id='send_message' name="send" class="btn btn-lg costom-btn" value="send">
</div>
</div>
<div tab-id="2" class="tab">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="full name" >
</div>
<div class="form-group col-sm-6 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="Email">
</div>
<div class="form-group col-sm-6 pad">
<input type="text" class="form-control" name="telephone" placeholder="Phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about your project in your own words ?" >
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about you or your company" >
</div>
<div class="form-group col-sm-12 padd">
<p>Which services are you interested in ?</p>
<p>
<input type="checkbox" id="test1" />
<label for="test1"></label>
</p>
<p>
<input type="checkbox" id="test2"/>
<label for="test2"></label>
</p>
<p>
<input type="checkbox" id="test3"/>
<label for="test3"></label>
</p>
<p>
<input type="checkbox" id="test4"/>
<label for="test4"></label>
</p>
<p>
<input type="checkbox" id="test5"/>
<label for="test5"></label>
</p>
<p>
<input type="checkbox" id="test6"/>
<label for="test6"></label>
</p>
</div>
</div>
<div class="form-group col-xs-12">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-sm-12" id='submit'>
<input type="submit" id='send_message' class="btn btn-lg costom-btn" value="send">
</div>
</div>
</form>
Please try with this code.
<form name="contactForm" id='contact_form' method="post" action='php/email.php'>
//This is the first tab
<div tab-id="1" class="tab active">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="name" >
</div>
<div class="form-group col-sm-12 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="email address">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="telephone" placeholder="phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="Country" id="exampleInputName" placeholder="Country" >
</div>
<div class="form-group col-sm-12 padd">
<textarea class="form-control" name="message" rows="3" id="exampleInputMessage" placeholder="message" ></textarea>
</div>
</div>
<div class="form-group col-xs-12 padd">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-xs-8 padd">
<div class="g-recaptcha" data-sitekey="6LcJqyITAAAAABks5hnD6U_2ptu09RiXYOHvNNud"></div>
</div>
<div class="form-group col-sm-4 padd" id='submit'>
<input type="submit" id='send_message' name="send" class="btn btn-lg costom-btn" value="send">
</div>
</div>
//This is the Second tab
<div tab-id="2" class="tab">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="full name" >
</div>
<div class="form-group col-sm-6 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="Email">
</div>
<div class="form-group col-sm-6 pad">
<input type="text" class="form-control" name="telephone" placeholder="Phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about your project in your own words ?" >
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about you or your company" >
</div>
<div class="form-group col-sm-12 padd">
<p>Which services are you interested in ?</p>
<form action="#">
<p>
<input type="checkbox" id="test1" />
<label for="test1">Web Design & development</label>
</p>
<p>
<input type="checkbox" id="test2"/>
<label for="test2">E-Commerce Solutions</label>
</p>
<p>
<input type="checkbox" id="test3"/>
<label for="test3">Digital Marketing</label>
</p>
<p>
<input type="checkbox" id="test4"/>
<label for="test4">SEO Solutions</label>
</p>
<p>
<input type="checkbox" id="test5"/>
<label for="test5">2D&3D Animation</label>
</p>
<p>
<input type="checkbox" id="test6"/>
<label for="test6">Game development</label>
</p>
</div>
</div>
<div class="form-group col-xs-12">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-sm-12" id='submit'>
<input type="submit" id='send_message' class="btn btn-lg costom-btn" value="send">
</div>
</form>
</div>
Assuming the following form-tab html structure:
<form name="contactForm" id='contact_form' method="post" action=''>
<div tab-id="1" class="tab active">
...
<input name="field1" value="" class="form-control" />
<input name="field2" value="" class="form-control" />
</div>
<div tab-id="2" class="tab">
...
<input name="field1" value="" class="form-control" />
<input name="field2" value="" class="form-control" />
</div>
</form>
As your div tabs have not attribute called id, and the class attribute you assigned is the same for every tab, it is not clear to see how to define the jquery selector for the inputs within those tabs you created.
You can access the values of each tab, using jquery as follows:
var fields = {}
fields.tab1 = {}
fields.tab1.field1 = $('div[tab-id=1] input[name=field1]').val()
fields.tab1.field2 = $('div[tab-id=1] input[name=field2]').val()
fields.tab2 = {}
fields.tab2.field1 = $('div[tab-id=2] input[name=field1]').val()
fields.tab2.field2 = $('div[tab-id=2] input[name=field2]').val()
Here is the fiddle of the working example.
var datastring = $("#contact_form").serialize();
alert(datastring);
try this in jquery after , you wiil get all the elements values between the
...
here data strings gives output as below
name=tj&email=tj#gmail.com&telephone=8888888888&Country=ind&message=msdfdf&name=tj&email=tj#gmail.com&telephone=12345689&subject=sub&subject=sub
In Codeigniter I am trying to call a function from form action and I get the following error:
requested URL /chat//layercake/form_validation was not found on this server.
<form class="form-horizontal" id="contact" data-toggle="validator" enctype="multipart/form-data" role="form" method="post" action="<?php echo base_url().'/layercake/form_validation'; ?>">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" placeholder="First & Last Name" value="" required>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" name="email" placeholder="example#domain.com" value="" required>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="message" class="col-sm-2 control-label">Message</label>
<div class="col-sm-10">
<textarea class="form-control" id="message" rows="4" name="message" required></textarea>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary">
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2 alert">
</div>
</div>
</form>
Please help.
Change your action url base_url().'/layercake/form_validation'; to base_url().'layercake/form_validation';
Please look at your error. There are two // after chat.
Your action URL is wrong. Change action="<?php echo base_url().'/layercake/form_validation'; ?>" this as following in form tag
action="<?php echo site_url('layercake/form_validation'); ?>"