A simple popup HTML form when submits need to do two actions. 1. Send customer information to the existing database 2. Redirect customer to Thank you page.
With the help of another Stackoverflow member were able to work on this code. But,the code is not working. I feel that I am doing something terribly wrong to the code, sorry unable to figure it out. Please help!
Currently, the form is getting sent to database, but redirects to the existing Mailing list signup page, if I change the action to thank you page, then the form is sent to thank you page, but no submission to database.
I prefer to use Jquery, I am not much familiar with PHP, if someone can guide me, I can implement PHP as well. The form is getting redirected even if nothing entered in the Email Adress Input. Is there a way to tell the customer to enter valid email address and then to take him to Thankyou page? Thanks
Database address:"http://www.mywebsite.com/MailingList_subscribe.asp" Thank you page address: "https://www.mywebsite.com/Articles.asp?ID=252"
HTML Header
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
$(document).ready(function(){
$('#formId').submit(function(){
$.ajax({
type: "POST",
url: "http://www.mywebsite.com/MailingList_subscribe.asp",
context: document.body
}).success(function() {
location.href = "https://www.mywebsite.com/Articles.asp?ID=252";
});
});
)};
</script>
HTML BODY:
<form name="MailingList" id="formId" method="post" action="http://www.mywebsite.com/MailingList_subscribe.asp">
<input type="text" name="emailaddress" placeholder="Email Address" maxlength="100" size="28"> <br>
<input type="submit" name="Submit" value="Submit" width="260px">
</form>
CSS:
input[type=text] {
padding:1px; border:1px solid #c6c7cc;
box-shadow: inset 0 1px 1px
-webkit-border-radius: 13px;
width: 98%;
font-size:14px;
font-family: Lucida Grande;
font-weight: regular;
margin-left: 2px;
margin-top:10px;
}
input[type=submit] {
background: #9B1C1F;
width: 100%;
font-family: Lucida Grande;
color: #ffffff;
font-weight: bold;
font-size:18px;
text-align:left;
margin-top:10px;
padding:5px 15px;
margin-left:0px;
border:0 none;
cursor:pointer;
display: inline-block;
}