How To Submit Two Forms With One Button? - javascript

Please I have these two forms below. The first is the form that submit it's data to my database after my customer buys my product and were redirected to the registration page where the form is, while the second form is the form that submit it's data to my getresponse autoresponder campaign.
Now only the first form is what I wanted to be visible, I don't want the second form to be visible and I want to use one button to submit the two forms at one time, please how will I do that?
Thanks!
<!--====================================================================
Form that submit to my database and register my customers after purchase
======================================================================-->
<form class="form-horizontal templatemo-contact-form-1" role="form" action="sold.php" method="post">
<input type="text" class="form-control" id="name" placeholder="Enter Your First Name Here..." name="fname" required><br>
<input type="text" name="lname" class="form-control" id="name" placeholder="Enter Your Last Name Here..." required><br>
<input type="email" name="email" class="form-control" id="email" placeholder="Enter Your Email Here..." required><br>
<input type="text" name="phone" class="form-control" id="name" placeholder="Enter Your Phone Number Here..." required><br>
<input type="password" name="pword" class="form-control" id="website" placeholder="Enter Your Password Here..." required><br>
<input type="password" name="cpword" class="form-control" id="subject" placeholder="Re-enter Your Password Here..." required><br>
<input type="text" name="addrss" class="form-control" id="name" placeholder="Enter Your Address Here..." required><br>
<input type="submit" value="Register" class="btn btn-success pull-right">
</form>
<!--======================================================
Form that submit to my getresponse autoresponder campaign
========================================================-->
<form action="https://app.getresponse.com/add_subscriber.html" accept-charset="utf-8" method="post">
<input type="text" name="name" value="Enter your name here..." type=text style="width: 100%">
<input type="text" name="email" value="Enter your email here..." type=text style="width: 100%">
<!-- Get the token at: https://app.getresponse.com/campaign_list.html -->
<input type="hidden" name="campaign_token" value="ljqOk" />
<!-- Thank you page (optional) -->
<input type="hidden" name="thankyou_url" value="https://www.moneycreativesecret.com/spages/smf-sp1/"/>
<!-- Add subscriber to the follow-up sequence with a specified day (optional) -->
<input type="hidden" name="start_day" value="0" />
<!-- Forward form data to your page (optional) -->
<input type="hidden" name="forward_data" value="post" />
<input type="submit" value="100% Free Access" class="btn btn-success pull-right">
</form>

Related

HTML required Field doesnt work on IOS

This is my custom build HTML form
<form id="i-recaptcha" action="#" method="POST">
<input class="first_name_popup" id="first_name" maxlength="40" name="first_name" size="20" type="text" placeholder="First Name" required="required">
<input class="last_name_popup" id="last_name" maxlength="80" name="last_name" size="20" type="text" placeholder="Last Name" required="required">
<input class="email_popup" id="email" maxlength="80" name="email" size="20" type="text" placeholder="Your Email" required="required">
<input class="submit_button_popup" id="submit_button" type="submit" name="submit" value="GET A FREE CONSULTATION!">
</form>
how can i make this work on IOS? right now im getting so many blank forms submitted.
Thank you.

How to send alert using inputted text

I'm trying to create a simple sign in/sign up form that sends an alert to the user once they've hit the submit button. The alert will show the user all the info they have put in (name, email, password). When I run the app the alert comes up as "undefined".
Here's my code:
HTML:
<form>
<h2>Sign In</h2>
<label>User Name:</label>
<input type="text" placeholder="Enter Username" name="username" required>
<label>Password:</label>
<input type="password" placeholder="Enter Password" name="password" required>
<input type="submit" class="submit-button si-submit" value="Sign In">
<div id="remember"><input type="checkbox" checked="checked"><span>Remember me</span></div>
</form>
</div>
<div class="sign-up">
<form>
<h2>Sign Up</h2>
<label>Name:</label>
<input type="text" placeholder="Enter your name" value="" id="name" required>
<label>Email:</label>
<input type="email" name="email" id="email" required placeholder="Enter a valid email address">
<label>Password:</label>
<input type="password" placeholder="Enter your password" name="password" id="password" required>
<input class="submit-button su-submit" type="submit" id="myButton">
</form>
JS:
var userInfo = document.getElementById("name");
document.getElementById("myButton").addEventListener("click", function() {
alert(userInfo.value);
});
Your code seems to work...
var userName = document.getElementById("name"),
userEmail = document.getElementById("email"),
userPassword = document.getElementById("password");
document.getElementById("myButton").addEventListener("click", function() {
alert(userName.value);
alert(userEmail.value);
alert(userPassword.value);
});
<div class="sign-up">
<form>
<h2>Sign Up</h2>
<label>Name:</label>
<input type="text" placeholder="Enter your name" value="" id="name" required>
<label>Email:</label>
<input type="email" name="email" id="email" required placeholder="Enter a valid email address">
<label>Password:</label>
<input type="password" placeholder="Enter your password" name="password" id="password" required>
<input class="submit-button su-submit" type="submit" id="myButton">
</form>
</div>

Send data of form to div on submitting , outside the form using jQuery, laravel 5.3

this is my form
<form method="post" action="{{url('/vpage')}}">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<label>First Name</label>
<input type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}" >
<label>Email Address</label>
<input type="text" name="email" placeholder="Email Address" value="{{$user->email}}" >
<label>Phone Number <span> (optional)</span></label>
<input type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}" >
<button id="hitme" class="submitBTN getstart" type="submit" onclick='return false;'> Get Started </button>
</form>
this is div outside the form
<div class="vgasRit">
<p>SUMMARY</p>
<div class="sfieldz w100">
<label>Name:</label>
<input type="text" placeholder="John Smith" value="{{$user->firstname}}">
</div>
<div class="w100">
<label>Email Address:</label>
<input type="text" placeholder="johnsmith#gmail.com" value="{{$user->email}}" >
</div>
<div class="w100">
<label>Phone Number:</label>
<input type="text" placeholder="(888) 888-888" value="{{$user->phone}}">
</div>
</div>
I want to access the value of the "fistname" , "lastname" and "phone" as user submit the form,so that i can display it in summary div.
Note: i have tried compact function of php in my controller so that i can send the whole database object in my view but this solution not working , after using compact function i was access the object like this
<input type="text" placeholder="John Smith" value="<?= (!empty($group_data)) ? $group_data->firstname : '';?>">
Any ideas regarding this ? i am new to laravel. I have served several hours on internet but nothing found out.
Assuming everything is on the same page, give your form's inputs an id:
<form id="form" method="post" action="{{url('/vpage')}}">
<label>First Name</label>
<input id="firstname" type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}" >
<label>Email Address</label>
<input id="email" type="text" name="email" placeholder="Email Address" value="{{$user->email}}" >
<label>Phone Number <span> (optional)</span></label>
<input id="phone" type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}" >
Give your summary div inputs an id too:
<p>SUMMARY</p>
<div class="sfieldz w100">
<label>Name:</label>
<input id="firstname2" type="text" placeholder="John Smith" value="{{$user->firstname}}">
</div>
<div class="w100">
<label>Email Address:</label>
<input id="email2" type="text" placeholder="johnsmith#gmail.com" value="{{$user->email}}" >
</div>
<div class="w100">
<label>Phone Number:</label>
<input id="phone2" type="text" placeholder="(888) 888-888" value="{{$user->phone}}">
</div>
Then, use jquery to get those values when the user submits the form:
$('#form').submit(function() {
// set our summary div inputs values with our form values
$('firstname2').val($('firstname').val());
$('email2').val($('email').val());
$('phone2').val($('phone').val());
});
That should be it.
Your view (I assumed that form and summery div in same view):
<form method="post" action="{{url('/vpage')}}">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<label>First Name</label>
<input type="text" name="firstname" placeholder="First Name" value="{{$user->firstname}}">
<label>Email Address</label>
<input type="text" name="email" placeholder="Email Address" value="{{$user->email}}">
<label>Phone Number <span> (optional)</span></label>
<input type="text" name="phone" placeholder="(888) 888-888" value="{{$user->phone}}">
<button id="hitme" class="submitBTN getstart" type="submit" onclick='return false;'> Get Started</button>
</form>
#if($Data->input('firstname'))
<p>SUMMARY</p>
<div class="sfieldz w100">
<label>Name:</label>
<input id="firstname2" type="text" placeholder="John Smith" value="{{$Data->input('firstname')}}">
</div>
<div class="w100">
<label>Email Address:</label>
<input id="email2" type="text" placeholder="johnsmith#gmail.com" value="{{$Data->input('email')}}" >
</div>
<div class="w100">
<label>Phone Number:</label>
<input id="phone2" type="text" placeholder="(888) 888-888" value="{{$Data->input('phone')}}">
</div>
#endif
Contoroller
function vpageController(Request $r){
return view("path.to.view",['Data'=>$r]);
}
Route:
Route::Route::match(['POST', 'GET'],'/vpage', 'ControllerName#vpageController');

Form get targeted at website load

Since adding a contact form to my website, when I refresh the page it constantly scrolls the page to where the form is.
I don't know what could provoke this, so I came to ask. I searched for similar issues but couldn't find any.
Thanks for all.
Form from site:
<form method="post" action="contact.php">
<input type="text" id="name" name="name" value="" placeholder="Nom prénom" required="required" autofocus="autofocus" />
<input type="email" id="email" name="email" value="" placeholder="email#example.com" required="required" />
<input type="phone" id="phone" name="phone" value="" placeholder="00.00.00.00.00" />
<textarea id="message" name="message" placeholder="Bonjour,..." required="required"></textarea>
<button type="submit" value="Envoyer!" id="submit-button" >Envoyer</button>
</form>
Corrected form :
<form method="post" action="contact.php">
<input type="text" id="name" name="name" value="" placeholder="Nom prénom" required="required" />
<input type="email" id="email" name="email" value="" placeholder="email#example.com" required="required" />
<input type="phone" id="phone" name="phone" value="" placeholder="00.00.00.00.00" />
<textarea id="message" name="message" placeholder="Bonjour,..." required="required"></textarea>
<button type="submit" value="Envoyer!" id="submit-button" >Envoyer</button>
</form>
When you copy an old form, be sure to properly read each line (my biggest error there).
There was an autofocus attribute in my form and that's what caused the problem.
Your problem seems to be with the 'autofocus' attribute.
http://www.w3schools.com/tags/att_input_autofocus.asp
You should remove it from the following form like so:
<form method="post" action="contact.php">
<input type="text" id="name" name="name" value="" placeholder="Maamar Miloud" required="required" />
<input type="email" id="email" name="email" value="" placeholder="contact.maamar#gmail.com" required="required" />
<input type="phone" id="phone" name="phone" value="" placeholder="06.15.73.0x.0x" />
<textarea id="message" name="message" placeholder="Bonjour,..." required="required"></textarea>
<button type="submit" value="Envoyer!" id="submit-button" >Envoyer</button>
</form>
Here's a fiddle showing an extreme example: http://jsfiddle.net/xefq9t0z/1/
It's much easier to help you when you provide snippets of code so we don't have to dig through your entire site! You're very lucky that I'm very bored!

Populate form field from form on previous page

I've have HTML code from Listrak to display a form on my site. In Listrak, I've asked this form to redirect to a new page on Submit, where there is a second Listrak form. How can I use Javascript or jQuery to auto-populate the email field from Form 1 to Form 2?
Form 1:
<form method="post" action="#" id="form1">
<input type="text" name="email" size="40" maxlength="100" id="email" value=""/>
<input type="text" name="name" size="40" maxlength="100" id="name" value=""/>
<input type="submit" id="submit" value="Submit">
</form>
Form 2:
<form method="post" action="#" id="form2">
<input type="text" name="email" size="40" maxlength="100" id="email" value="auto.populated.from.form1"/>
<input type="text" name="hobbies" size="40" maxlength="100" id="hobbies" value=""/>
<input type="submit" id="submit" value="Submit">
</form>

Categories

Resources