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>