I'm having an issue getting my second of two forms on a single html to process data. I'm using Bootstrap 3 framework and have a form in a modal that processes correctly i.e. a user clicks the submit button and the form is processed correctly.
There is another form on the page which does not process correctly. When a user clicks the submit button, the form is supposed to be processed and bring the user to a new page (goodsub.html) but when the submit button is clicked, nothing happens. Is there something wrong with my HTML?
I am very new to PHP so I used some pre-made PHP documents that seem to work fine for the first form on the page. Note that when I comment out the form within the modal, my "second" form processes correctly and sends the user to goodsub.html.
Page in question can be viewed at http://josephsamora.com/contact.html
Here is my code for the working:
<!--modal-->
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">I look forward to hearing from you.</h3>
</div>
<div class="modal-body">
<form id="personalform" name="personalform" action="mail_form.php" method="post" class="form-horizontal col-sm-12">
<div class="form-group"><input class="form-control required" placeholder="Your name*" data-placement="top" data-trigger="manual" data-content="Must be at least 3 characters long, and must only contain letters." type="text" name="Name"></div>
<div class="form-group"><textarea name="Message" class="form-control" placeholder="Your message here..*" data-placement="top" data-trigger="manual"></textarea></div>
<div class="form-group"><input name="email" class="form-control email" placeholder="email#you.com (so that I can contact you)*" data-placement="top" data-trigger="manual" data-content="Must be a valid e-mail address (user#gmail.com)" type="text"></div>
<div class="form-group"><input type="hidden" name="recipients"
value="walshv10#gmail.com" />
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>
<div class="form-group"><input Name="Phone Number" class="form-control phone" placeholder="Phone Number: 999-999-9999" data-placement="top" data-trigger="manual" data-content="Must be a valid phone number (999-999-9999)" type="text"></div>
<div class="form-group"><button type="submit" name="Sendit" value="Sendit" class="btn btn-success pull-right">Send It!</button> <p class="help-block pull-left text-danger hide" id="form-error"> The form is not valid. </p></div>
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
</div>
</div>
And the non-working form:
<div class="row">
<div class="col-md-4 col-md-offset-4">
<form id="fullform" name="fullform" action="mail_form.php" method="post" class="form-horizontal" role="form">
<!--Hidden Section-->
<div class="form-group"><input type="hidden" name="recipients"
value="walshv10#gmail.com"/>
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>
<!-- Form Section Name -->
<h3>Name & Email</h3>
<hr>
<!-- Text Input -->
<div class="form-group">
<label class="col-sm-3 control-label">First Name*</label>
<div class="col-sm-9">
<input type="text" placeholder="First Name" class="form-control" data-placement="top" data-trigger="manual" name="First Name" required="">
</div>
</div>
<!-- Text Input -->
<div class="form-group">
<label class="col-sm-3 control-label">Last Name*</label>
<div class="col-sm-9">
<input type="text" placeholder="Last Name" class="form-control" data-placement="top" data-trigger="manual" name="Last Name" required="">
</div>
</div>
<!-- Text Input -->
<div class="form-group">
<label class="col-sm-3 control-label">Email*</label>
<div class="col-sm-9">
<input type="text" placeholder="Email" class="form-control" data-placement="top" data-trigger="manual" name="Email" required="">
</div>
</div>
<!-- Form Section Name -->
<h3>Address Details</h3>
<hr>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label">Line 1</label>
<div class="col-sm-10">
<input type="text" placeholder="Address Line 1" class="form-control" data-placement="top" data-trigger="manual" name="Address Line 1">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label">Line 2</label>
<div class="col-sm-10">
<input type="text" placeholder="Address Line 2" class="form-control" data-placement="top" data-trigger="manual" name="Address Line 2">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label">City</label>
<div class="col-sm-10">
<input type="text" placeholder="City" class="form-control" data-placement="top" data-trigger="manual" name="City">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label">State</label>
<div class="col-sm-4">
<input type="text" placeholder="State" class="form-control" data-placement="top" data-trigger="manual" name="State">
</div>
<label class="col-sm-2 control-label">Postcode</label>
<div class="col-sm-4">
<input type="text" placeholder="Post Code" class="form-control" data-placement="top" data-trigger="manual" name="Post code">
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label">Country</label>
<div class="col-sm-10">
<input type="text" placeholder="Country" class="form-control" data-placement="top" data-trigger="manual" name="Country">
</div>
</div>
<!-- Form Section Name -->
<h3>Other Contact Info</h3>
<hr>
<!--Text Input -->
<div class="form-group">
<label class="col-sm-3 control-label">Phone Number</label>
<div class="col-sm-9">
<input type="text" placeholder="Phone Number" class="form-control" data-placement="top" data-trigger="manual" name="Phone Number">
</div>
</div>
<!--Text Input -->
<div class="form-group">
<label class="col-sm-3 control-label">Organization</label>
<div class="col-sm-9">
<input type="text" placeholder="Organization" class="form-control" data-placement="top" data-trigger="manual" name="Organization">
</div>
</div>
<!-- Form Section Name -->
<h3>Message</h3>
<hr>
<!--Text Input -->
<div class="form-group">
<label class="col-sm-2 control-label">Subject</label>
<div class="col-sm-10">
<input type="text" placeholder="Subject" class="form-control" data-placement="top" data-trigger="manual" name="Subject">
</div>
</div>
<!-- Textarea -->
<div class="form-group">
<label class="col-sm-2 control-label" for="Message">Message*</label>
<div class="col-sm-10">
<textarea class="form-control" id="Message" name="Message" placeholder="Message" required data-placement="top" data-trigger="manual"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="pull-right">
<div class="form-group"><button type="submit" name="submit" value="submit" class="btn btn-success pull-right">Submit</button></div>
</div>
</div>
</div>
</form>
</div>
</div>
I also have the following PHP above the head tag:
<?php
if (!empty($_POST['submit'])) {
//send to submit;
}
if (!empty($_POST['Sendit'])) {
//send to Sendit;
}
?>
Thanks!
remove this section from your non working form
<!--Hidden Section-->
<div class="form-group"><input type="hidden" name="recipients"
value="walshv10#gmail.com"/>
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>
Related
I want to create a login form to log system in php. But I can't do it, below I mentioned my code. I have coded registration form also. It works successfully, but the login form does not works properly. The registration form code is included in the index page. But the login code is include in login.php page.
Help me to solve this problem.
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×</button>
<h4 style="text-align: center" class="modal-title" id="myModalLabel">
Login & Registration</a></h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-8" style="border-right: 1px dotted #C2C2C2;padding-right: 30px;">
<!-- Nav tabs -->
<ul class="nav nav-tabs">
<li class="active">Login</li>
<li>Registration</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane active" id="Login">
<form class="form-horizontal" actoin="login.php" method="post" >
<div class="form-group">
<label class="col-sm-2 control-label">
Username</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="username2" id="username2" placeholder="Username" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="pwd2" id="pwd2" placeholder="Password" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
User Type</label>
<div class="col-sm-10">
<select class="form-control" name="utype" id="utype">
<option selected disabled>User Type</option>
<option value="Admin">Admin</option>
<option value="Student">Student</option>
<option value="Company">Company</option>
</select>
</div>
</div>
<div class="row">
<div class="col-sm-2">
</div>
<div class="col-sm-10">
<input type="submit" class="btn btn-primary btn-sm" name="buttonsubmit" id="buttonsubmit" value="Login">
Forgot your password?
</div>
</div>
</form>
</div>
<div class="tab-pane" id="Registration">
<form class="form-horizontal" action="index.php" method="post">
<div class="form-group">
<label class="col-sm-2 control-label">
Title</label>
<div class="col-sm-10">
<div class="row">
<div class="col-md-3">
<select class="form-control" id="uutypex" name="uutype">
<option>Mr.</option>
<option>Ms.</option>
<option>Mrs.</option>
</select>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="name" id="name" placeholder="Name" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
User Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="username1" id="username1" placeholder="User Name" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Password</label>
<div class="col-sm-10">
<input class="form-control" name="pwd" id="pwd" type="password" placeholder="Password" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Birth Date
</label>
<div class="col-sm-10">
<input class="form-control" name="bdate" id="bdate" type="date">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" name="email" id="email" placeholder="User Name" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Mobile
</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="mobile" id="mobile" placeholder="Mobile" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
University</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="uni" id="uni" placeholder="University" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
User Type
</label>
<div class="col-sm-10">
<select class="form-control" name="type" id="type">
<option selected disabled>User Type</option>
<option value="Admin">Admin</option>
<option value="Student">Student</option>
<option value="Company">Company</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
GPA</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="gpa" id="gpa" placeholder="GPA" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">
Address</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="address" id="address" placeholder="Address" />
</div>
</div>
<div class="row">
<div class="col-sm-2">
</div>
<div class="col-sm-10">
<input type="submit" class="btn btn-primary btn-sm" name="buttonregister" id="buttonregister" value="Submit and Save">
<button type="button" class="btn btn-default btn-sm">
Cancel
</button>
</div>
</div>
</form>
</div>
</div>
<div id="OR" class="hidden-xs">
OR</div>
</div>
<div class="col-md-4">
<div class="row text-center sign-with">
<div class="col-md-12">
<h3>
Sign in with
</h3>
</div>
<div class="col-md-12">
<div class="btn-group btn-group-justified">
Facebook <a href="#" class="btn btn-danger">
Google
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
php code
<?php
$conn=mysqli_connect("localhost","root","","internship");
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
if(isset($_POST['buttonsubmit'])){
$username=$_POST['username2'];
$password=$_POST['pwd2'];
$type=$_POST['utype'];
$result=mysqli_query($conn,'select * from registration where username="'.$username.'" and password="'.$password.'" and usertype="'.$type.'"');
if(mysqli_num_rows($result)==1 && $type=="Student"){
header('Location: student.php');
}
else
?>
<script> alert("Account invalid!!!! Enter valid Username Password and Usertype")</script>
<?php
}
?>
<?php
$conn=mysqli_connect("localhost","root","","internship");
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
if(isset($_POST['buttonsubmit'])){
$username=$_POST['username2'];
$password=$_POST['pwd2'];
$type=$_POST['utype'];
$result=mysqli_query($conn,'select * from registration where username="'.$username.'" and password="'.$password.'" and usertype="'.$type.'"');
if(mysqli_num_rows($result)==1 && $type=="Student"){
session_start();
$_SESSION['user'] = $result;
header('Location: student.php');
}
else
?>
<script> alert("Account invalid!!!! Enter valid Username Password and Usertype")</script>
<?php
}
Can you post the error that you are getting...?
Plus Your code is not secure. You should use php's hash functions to match passwords and use must use PDO to avoid sql injection.
I have implemented google re captcha in a modal popup. I have also included the api ,i.e recaptcha/api.js to enable the recpatcha. But it is not showing up when I invoke the popup.
When I right click on the popup and inspect, the div tag which includes the google recaptcha is being seen in the elements section .
I have included the modal popup in my footer page which is called by every page in my website.
My code:
<script src="https://www.google.com/recaptcha/api.js"></script>
<!-- Request A Demo POPUP(Start) -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<?php echo form_open(base_url( 'employer-request-demo/request-demo/submit' ), array( 'id' => 'idfrmdemo', 'name' =>'frmdemo', 'method'=>'post'));?>
<!-- input type="text" name="<?php //echo $this->security->get_csrf_token_name();?>" value="<?php //echo $this->security->get_csrf_hash();?>"-->
<div class="modal-content">
<div class="modal-header" align="center">
<button type="button" id="frmdemo-close" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title"><strong>Request a Demo</strong></h4>
</div>
<div class="modal-body" id="idmodalcontent">
<div class="row">
<div class="form-group col-md-6">
<label for="txtfirstname">FIRST NAME</label>
<input name="txtfirstname" type="text" class="form-control required" placeholder="Please enter your first name" id="idfirstname" >
</div>
<div class="form-group col-md-6">
<label for="txtlastname">LAST NAME</label>
<input name="txtlastname" type="text" class="form-control required" placeholder="Please enter your last name" id="idlastname">
</div>
</div>
<div class="form-group">
<label for="Email">CORPORATE EMAIL</label>
<input type="email" name="txtemail" class="form-control" placeholder="Please enter your email id" id="idemail">
<div class="divstyle"></div>
</div>
<div class="form-group">
<label for="idcompany">COMPANY NAME</label>
<input type="text" name="txtcompany" placeholder="Please enter the name of your company" class="form-control" id="idcompany" >
</div>
<div class="form-group">
<label for="Phone">PHONE</label>
<input type="tel" name="txtphone" placeholder="Please enter your phone number" class="form-control" id="idphone">
</div>
<div class="form-group">
<label for="">MODE OF CONTACT</label>
<select name="selmode" id="idmode" class="form-control">
<option value="" disabled selected>Select mode of contact</option>
<option value="email">Email</option>
<option value="phone">Phone</option>
<option value="any">Any</option>
</select>
</div>
<div class="form-group">
<div class="g-recaptcha" data-sitekey="6LexRREUAAAAAELhZaiO5FxRbgnyWEwIxFTWeHhE"></div>
<input type="hidden" class="hiddenRecaptcha required" name="cphiddenRecaptcha" id="idcphiddenRecaptcha">
</div>
</div>
<div class="modal-footer">
<div id="btn-smb">
<input type="submit" id="idsubmit" name="submit" value="Submit" class="btn btn-warning" />
</div>
<div id="btn-close" style="display:none;">
<input type="button" name="close" value="Close" class="btn btn-warning" id="idclose"/>
</div>
</div>
</div>
<input type="hidden" name="context" id="frm_context" value="Request A Demo" />
<?php echo form_close();?>
</div>
</div>
<!-- Request A Demo POPUP(End) -->
I am getting the following error in the console:
XMLHttpRequest cannot load javascript:void(0);. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
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
I am new to both bootstrap and php. I have created a registration modal form to register users for my site and it registers perfectly. However, I would like to retrieve a users details from my database based on their User ID and display their details in a registration form for them to edit and update.
What I don't know how to do is display the records in the form fields...
Please help by providing a simple syntax for this.
I am using PHP and MySql
This is my modal form
<div class="modal fade" id="updatelecModal" tabindex="-1" role="dialog" aria-labelledby="updatelecModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<!--End of modal-->
<!-- Start of form-->
<form id="updatelecForm" class="form-horizontal" role="form" method="post" action="#" nonvalidate>
<div class="form-group">
<label for="student_id" class="col-sm-3 control-label">Lecturer ID</label>
<div class="col-lg-9">
<input type="text" class="form-control" name="lec_id" required placeholder="Enter User ID">
</div>
</div>
<div class="form-group">
<label class="col-lg-3 control-label">Full name</label>
<div class="col-lg-4">
<input type="text" class="form-control" name="firstName" required placeholder="First name" />
</div>
<div class="col-lg-4">
<input type="text" class="form-control" name="lastName" required placeholder="Last name" />
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-3 control-label">Email</label>
<div class="col-lg-9">
<input type="email" class="form-control" name="lec_email" required placeholder="#######.com">
</div>
</div>
<label class="col-xs-3 control-label" name="lec_gender">Gender:</label>
<label class="radio-inline control-label">
<input type="radio" name="optionsRadio" id="gender" value="Male">Male
</label>
<label class="radio-inline control-label">
<input type="radio" name="optionsRadio" id="gender" value="Female">Female
</label>
<div class="form-group">
<label for="password" class="col-sm-3 control-label">Password</label>
<div class="col-sm-7">
<input type="password" id="password" class="form-control" name="password" required placeholder ="Enter your Password">
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-3 control-label">Confirm Password</label>
<div class="col-sm-7">
<input type="password" id="password2" class="form-control" name="cpassword" data-validate-linked="password" required placeholder ="Re-enter your Password">
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Register</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="reset" class="btn btn-default">Reset</button>
</div>
</form>
<!--End of registration form-->
</div>
</div>
</div>
</div>
I dont know how to include the php in this form as it disappears
Also if you could include links for further reading on php I would really appreciate.
Without seeing any code it's difficult to give more specific help. However, what I would do is store the user's id in a session. When they view the form brab the id from the session and do a SQL call to your db, something like:
SELECT firstName,lastName,email, FROM table_name WHERE id=$id
Obviously what you select, the table_name, and the where clause depends on your own tables and variables.
Run your SQL command and store the columns into variables. Then place the variable into the value of the input:
<input type="text" value="<?php echo $name != '' ? $name : ''; ?>" />
Basically, what I did above is a shorthand if statement that says if $name isn't blank they print it, otherwise print nothing.
I'm in the process of migrating a Drupal build out to Bootstrap framework. In the new Bootstrap framework, I've built out a form to pull results from a database.
Bootstrap form HTML:
<form class="form-horizontal" role="form" method="post" action="<?php echo lookup_dosearchx() ?>">
<br>
<div class="form-group">
<label for="county2" class="col-sm-3 control-label">County:</label>
<div class="col-sm-6">
<input type="text" name="county2" id="county2" class="form-control" placeholder="Enter County Name" required />
</div>
</div>
<hr>
<center><i>Include Payroll Notes:</i></center><br>
<div class="form-group">
<label for="employee" class="col-sm-3 control-label">Employee:</label>
<div class="col-sm-6">
<select class="form-control" name="employee" id="employee" placeholder="Enter Employee Name" /><option>Any</option></select>
</div>
</div>
<div class="form-group">
<label for="startdate" class="col-sm-3 control-label">State Date (mm/dd/yyyy):</label>
<div class="col-sm-6">
<input type="date" name="startdate" id="startdate" class="form-control" placeholder="Enter Start Date" />
</div>
</div>
<div class="form-group">
<label for="enddate" class="col-sm-3 control-label">End Date (mm/dd/yyyy):</label>
<div class="col-sm-6">
<input type="date" name="enddate" id="enddate" class="form-control" placeholder="Enter End Date" />
</div>
</div>
<div class="form-group">
<label for="fulltext" class="col-sm-3 control-label">Fulltext Query:</label>
<div class="col-sm-6">
<textarea class="form-control" name="fulltext" id="fulltext" rows="4" /></textarea>
</div>
</div>
<div class="form-group">
<label for="contain" class="col-sm-3 control-label">Phrase:</label>
<div class="col-sm-6">
<textarea class="form-control" name="contain" id="contain" rows="4" /></textarea>
</div>
</div>
<div class="form-group">
<label for="jobid" class="col-sm-3 control-label">VCS Job Code:</label>
<div class="col-sm-6">
<select class="form-control" name="jobid" id="jobid" placeholder="Enter Job Code" /><option>Any</option></select>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-6">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-default">Clear</button>
</div>
</div>
</div>
<br>
</form>
I was provided with a large PHP query set from the prior build out, but that code isn't working when I hit submit. The database is connecting fine as I had trouble getting that to work before.
Would it be possible to be pointed in the direction of a simple example or recommended way to build out the PHP query code I'm calling out?