I'm working on a contact form for a static website at www.peek.solutions. The contact form works, in that I'm (after confirmation of my e-mail address) able to receive e-mails at the given address. Here is the code used:
<form id="contactform" action="//formspree.io/kurt.peek#gmail.com" method="POST">
<div class="col-sm-7 slideanim">
<div class="row">
<div class="col-sm-6 form-group">
<input class="form-control" id="name" name="name" placeholder="Name" type="text" required>
</div>
<div class="col-sm-6 form-group">
<input class="form-control" id="email" name="_replyto" placeholder="Email" type="email" required>
</div>
</div>
<textarea class="form-control" id="comments" name="message" placeholder="Message" rows="5"></textarea><br>
<div class="row">
<div class="col-sm-12 form-group">
<button class="btn btn-default pull-right" type="submit">Send</button>
</div>
</div>
</div>
<input type="hidden" name="_next" value="//peek.solutions/confirmation.html" />
<input type="text" name="_gotcha" style="display:none" />
</form>
The problem is that when I submit the form by pressing the "Submit" button, I'm redirected to Formspree's default confirmation page:
However, through the line
<input type="hidden" name="_next" value="//peek.solutions/confirmation.html" />
I was trying to make this confirmation page default to www.peek.solutions/confirmation.html. As far as I can tell, this line follows the documentation at https://formspree.io/. Can anyone tell why this is not working?
Updating your URLs to include http: will fix the issue. so for the _next value it should be http://peek.solutions/confirmation.html,
To prevent exposing your email, and using the now legacy method of using your email in forms, you can sign up for a free Formspree account and generate a custom endpoint. More info on legacy forms can be found here.
Related
i'm using formsubmit to send my emails my problem is when i submits the form google recaptcha page will open with url like https://formsubmit.co/myemail#gmail.com i wanted to change this url to my website url . is that possible???
below is my form
<form class="app_form_wrapper" action="https://formsubmit.co/myemail#gmail.com" method="POST" >
<div class="col-lg-6 text-left">
<div class="form-group apps-pulldown-20">
<div class="apps_input">
<input type="text" class="form-control" name="name" placeholder="Name"required>
</div>
</div>
<div class="form-group apps-pulldown-20">
<div class="apps_input">
<input type="email" class="form-control" name="email" placeholder="Email"required>
</div>
</div>
<div class="form-group apps-pulldown-20">
<div class="apps_input">
<input type="tel" class="form-control" name="phone" placeholder="Phone Number" minlength="10" maxlength="15"required>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="form-group apps-pulldown-20">
<div class="apps_input">
<input type="text" class="form-control" name="company" placeholder="Company"required>
</div>
</div>
<div class="form-group apps-pulldown-20">
<div class="apps_input">
<textarea rows="10" class="form-control" name="message" placeholder="Message"required></textarea>
</div>
</div>
</div>
<input type="hidden" name="_url" value="http://localhost/app/contact">
<input type="hidden" name="_next" value="http://localhost/app/mailSent.html">
<input type="text" name="_honey" style="display:none">
<input type="hidden" name="_template" value="table">
<div class="col-lg-12">
<p>
This site is protected by reCAPTCHA and the Google
Privacy Policy and
Terms of Service apply.
</p>
<button type="submit" class="btn btn-default btn-lg contact_btn">Send</button>
</div>
</form>
Thanks
Harshith
FormSubmit has gives you 2 different options, you can either skip the ReCaptcha page (It's not recommended but offered.) or you can replace your naked email address with a random string.
Option 1
You can use below hidden input field to skip the captcha page:
<input type="hidden" name="_captcha" value="false">
Option 2
Get a random-like string to replace your naked email address in the
action attribute of your form. Your email address will remain unknown
to spam-bots and human visitors.
This random string will send to you when you confirm your email
address.
Please also refer to their official documentation: https://formsubmit.co/documentation
I deconstructed my email address into a javascript variable so that the email address isn't hard coded into the html. This avoids spam.
//email
const email = 'youremail#youremail.com';
const encodedEmail = encodeURIComponent(email);
const url = `https://formsubmit.co/${encodedEmail}`;
<form
target="_blank"
action={url}
method="POST"
>
<input
type="email"
name="email"
className="form-control"
placeholder="Email Address"
required
/>
<button type="submit">
SUBMIT FORM
</button>
</form>
Hello I have a really strange problem with html form. I am using Wordpress and I created my custom html form. When i submit the form it redirects me on the same page url, but showing me that the page doesnt exist.
My form:
<form action="" method="post">
<div class="form-group">
<input type="text" name="name" class="form-control input-text" placeholder="Vaše jméno a příjmení" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="email" class="form-control input-text" name="email" placeholder="Váš e-mail" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="text" class="form-control input-text" name="subject" placeholder="Předmět zprávy" />
<div class="validation"></div>
</div>
<div class="form-group">
<textarea class="form-control input-text text-area" name="message" rows="5" placeholder="Vaše zpráva pro nás..."></textarea>
<div class="validation"></div>
</div>
<div class="row">
<!-- Google reCAPTCHA widget -->
<div class="col-lg-8 col-sm-8">
<!-- recaptcha here -->
</div>
<div class="col-lg-4 col-sm-4" style="padding-right: 0; padding-left: 0;">
<div class="text-center" style="margin-right: 7px;"><button name="submit" style="width: 135px; height: 75px; padding:0 !important;" type="submit" class="input-btn">Odeslat</button></div>
</div>
</div>
</form>
I tried to hide all my php code behind, also hide google recaptcha, but nothing works and the problem is elsewhere. My action is also empty, just set method.
What is wrong, any suggestions?
You have to change the name of your field name="name" to something else.
for more information you can read here
https://wordpress.stackexchange.com/questions/11749/why-when-i-submit-a-form-in-wordpress-it-loads-a-404-page-though-url-is-correct
Perhaps the problem is the submit button.
When you create a form, the submit button is an input as well.
You may try
<input type="submit" value="submit" yourtags="yourvalue">
See https://www.w3schools.com/html/html_forms.asp for more data.
EDIT: if you are trying to send the action to the same page, omit the action attribute. Perhaps leaving it blank causes an error.
I am hosting a site on github i.e. githubpages.AS It is a static site I used Formspree for my contact form but unfortunately it is not working with custom designed Contact form (with required parameters put in specified fields).
But finally the clicking of submit button does no action at all..
Here is the code I am implementing for the form.
<div class="col-lg-6">
<form action="action="https://formspree.io/jmscb56#gmail.com" method="POST" role="form" class="contactForm">
<div class="row">
<div id="sendmessage">Your message has been sent. Thank you!</div>
<div id="errormessage"></div>
<div class="col-lg-6">
<div class="form-group contact-block1">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validation"></div>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validation"></div>
</div>
</div>
<div class="col-lg-12">
<div class="form-group">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validation"></div>
</div>
</div>
<div class="col-lg-12">
<div class="form-group">
<textarea class="form-control" name="message" rows="6" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
<div class="validation"></div>
</div>
</div>
<div class="col-lg-12">
<!-- <input type="submit" class="btn btn-defeault btn-send" value="Send"> -->
<button type="submit" value="Send">Send</button>
</div>
<input type="hidden" name="_next" value="https://ghac-2017.github.io/#contact" />
</div>
</form>
</div>
Any help would be appreciated..As I cannot find what i felt short of..
Actually You cannot use formspree form as per your own customization , i.e. editing the basic (given/allotted) form values. It will work well when you use the given form values without your own customization , it will loose its functionality if you edit the basic layout of the given form by formspree.
<div class="row contact__main">
<div class="col-eight tab-full contact__form">
<form name="contactForm" id="contactForm" method="post" action="https://formspree.io/censored#gmail.com">
<fieldset>
<div class="form-field">
<input name="contactName" type="text" id="contactName" placeholder="Name" value="" minlength="2" required="" aria-required="true" class="full-width">
</div>
<div class="form-field">
<input name="contactEmail" type="email" id="contactEmail" placeholder="Email" value="" required="" aria-required="true" class="full-width">
</div>
<div class="form-field">
<input name="contactSubject" type="text" id="contactSubject" placeholder="Subject" value="" class="full-width">
</div>
<div class="form-field">
<textarea name="contactMessage" id="contactMessage" placeholder="message" rows="10" cols="50" required="" aria-required="true" class="full-width"></textarea>
</div>
<div class="form-field">
<button class="full-width btn--primary">Submit</button>
<div class="submit-loader">
<div class="text-loader">Sending...</div>
<div class="s-loader">
<div class="bounce1"></div>
<div class="bounce2"></div>
<div class="bounce3"></div>
</div>
</div>
</div>
</fieldset>
</form>
<!-- contact-warning -->
<div class="message-warning">
Something went wrong. Please try again.
</div>
<!-- contact-success -->
<div class="message-success">
Your message was sent, thank you!<br>
</div>
This is my website in question: https://xpmai.tumblr.com/test
According to what I see in Chrome Browser Console, the form tries to execute PHP from GitHub, but GitHub doesn't support PHP. So it failed. But the weird thing is, it's just a HTML form. The entire index.html doesn't have a single PHP code. So how can I resolve this??
Edit: To be more specific and plain, I have an HTML form. When I try to submit the form, it says PHP error. jquery-3.2.1.min.js:4 POST https://xpmai.tumblr.com/inc/sendEmail.php 404 () But in that code above, I can't figure out how to resolve it. How to like disable the PHP and make it do the POST action above?
I am working with Laravel 5.4 Framework and I get this issue when the form does not submit anything except the csrf_token().
If I put an input outside of those <div> it will work and submit it, otherwise the browser (Chrome) will only submit the token, as if everything inside the <div> is not part of the form.
How can I submit all the data while using Bootstrap's form-group divs? The layout is not the problem as it does not work even when removing it.
#extends('layouts.master')
#section('content')
<div class="container" style="margin-top: 1%">
<p>Welcome, {{$user->name}}, here you can submit a new company for our database.</p>
<form name="suggestCompanyForm" method="post">
{{csrf_field()}}
<div class="form-group">
<label for="companyName">Company Name</label>
<input type="text" class="form-control" id="companyName" aria-describedby="companyNameHelp" placeholder="Enter company name">
<small id="companyNameHelp" class="form-text text-muted">Enter the company's name you would like to suggest</small>
</div>
<div class="form-group">
<label for="companyEmail">Email address</label>
<input type="email" class="form-control" id="companyEmail" aria-describedby="emailHelp" placeholder="Enter email">
<small id="emailHelp" class="form-text text-muted">Enter the company contact email.</small>
</div>
<div class="form-group">
<label for="selectCategory">Select main category</label>
<select class="form-control" id="selectCategory">
<option>Food&Drink</option>
<option>Cosmetics</option>
<option>Electronics</option>
<option>Consumer Goods</option>
<option>Services</option>
</select>
</div>
<div class="form-group">
<label for="description">Company description.</label>
<textarea class="form-control" id="description" rows="5"></textarea>
</div>
<div class="form-group">
<label for="logo">File input</label>
<input type="file" class="form-control-file" id="logo" aria-describedby="logoHelp">
<small id="fileHelp" class="form-text text-muted">Add company logo.</small>
</div>
<div class="form-check">
<label class="form-check-label">
<input type="checkbox" id="check" class="form-check-input">
I agree that my submission follows the website rules.
</label>
</div>
<button id="submitCompany" type="submit" class="btn btn-primary" >Submit</button>
</form>
</div>
#endsection
your form inputs are not being submitted because you didn't give them names ...
Try
<textarea class="form-control" name="description" id="description" rows="5"></textarea>
You have to add the action attribute to the form tag.
Edit this line
<form name="suggestCompanyForm" method="post">
to
<form name="suggestCompanyForm" action = "<url-for-the-submission>" method="post">
.You will also need to add this
name="name_of_input_to_submit"
to each input not only the textarea and you are also uploading a file you have to add this to the form tag too.
enctype="multipart/form-data"