Send an e-mail automatically with data from a form - html

I need some advice in order to generate automatically an email that sends the answers from a form to my email adress.
We used the mailto method included in the html API, but it just opens a mail window, we would like to trigger the sending of the email by clicking on the validation button of the form.
<form>
<input type="checkbox" id="item1" name="interest" value="item1">
<label for="coding">Male</label>
<br/>
<input type="checkbox" id="item2" name="interest" value="item2">
<label for="coding">Female</label>
<br/>
<input type="submit" name="Submit" value="Submit">
</form>
Thank you for your time !

This is not possible with client-side code alone. If it were possible, then any website could use every visitor's browser to send any email to any email address. That would be a spammer's dream.
You must send the data over HTTP to a server (this is most easily done by using an HTTP URL in the action attribute, but you could also look to JavaScript (Ajax)) and then use server-side code to send it.
The specifics of the server-side code will depend on your choice of programming language.
You might also seek out a third party service which will provide a pre-existing HTTP endpoint hosted on their servers which you can use.

Related

POST to external form that has reCAPTCHA

I'm using a cloud CRM service that has a web form functionality, but the design of the form is limited.
I'm trying to create a custom http form that POST to the original form.
<form method="POST" action="//externalForm.Url/path">
<input type="text" name="name">
<textarea name="message"></textarea></div>
<input class="btn btn-primary" type="submit" value="Submit"></div>
</form>
The problem is, the form uses reCAPTCHA, so I couldn't do this.
Would it help if I had reCAPTCHA in my form?
what should I do?
If your cloud CRM service has a CRUD API you can post by way of Webservice via the server or even on the front-end, but because of security reasons you wont be able to recreate the exact form action on your server and simply post to theirs.

How to send a post request to GTMetrix

I want my users to write his website on my site and then be sent to gtmetrix.com to start a new test, but without needing to write his website again.
I am trying with this:
<form method="post" action="https://gtmetrix.com/analyze.html">
<input type="text" placeholder="Enter your Website URL"></input>
<input type="submit">CHECK IT</input>
</form>
But i get a
Analysis Error
You tried to analyze an invalid/malformed URL
What i am doing wrong? is possible to do this?
It seems they require the url in the form data field called url.
You must use the following input tag:
<input type="url" name="url" value="" placeholder="Enter your website URL" maxlength="1024" autofocus="" required="">
Also, they could be blocking external referrers. But first try adding the name attribute.
First of all, I don't know if that website allows you to submit that form from external websites. Make sure that's possible!
Seccond of all, you are trying to sent a form without setting the name of the input field. The resource that receives your request don't know anything to do with it.
If you want to analyse websites on your own website, search for services that provide APIs for using it external.
I am not familiar with gtmetrix, but you need to set the name attribute on your input to send it with the request.

Proper HTML markup and authentication flow for password manager compatibility?

I'm working on a webapp written in angular that seems to have trouble interacting with the various password managers (Dashlane, LastPass, etc) that are out there. Are there any guidelines around HTML markup and authentication flow to ensure compatibility? This is not just for login flow, but also includes things like password reset, user name changes, and so on.
It appears that this question has already been asked, but not in the context of AngularJS.
From https://lastpass.com/support.php?cmd=showfaq&id=3385
While LastPass can work on most website logins, if you are developing your own site you can help make it LastPass-compatible by using a simple form submit with a username, password, and submit field.
Here's an example:
<form action="https://mypage.com/blah" method="post">
<input type="text" name="username" id="username" value=""/>
<input type="password" name="password" id="password" value=""/>
<input type="submit" value="LOGIN"/>
</form>
As far as what to avoid -- always create the form on page load, even if you hide and show it to people clicking log in, it's better to be there on page load. Avoid ajax for logging in and avoid method=GET
So besides giving name attributes to your controls, LastPass recommends having the login form markup already in the HTML when it is first loaded.

How do I make a simple email form submission in HTML?

I tried w3schools but it didn't help and I tried other websites too. I just wanna make a short html script that sends an email to an email address, but I keep reloading my email inbox and nothing comes up. Can you help?
<form action="MAILTO:MY_EMAIL#yahoo.com" method="post" enctype="text/plain">
<input type="text" name="email" value="Email">
<input type="text" name="message" value="Message">
<input value="Submit" type="submit">
</form>
You need to use a server side script here. HTML alone won't help you here. HTML is just the frontend logic. You need some script on backend that accepts this data you submit and actually sends out an email. To take the example in PHP, assuming u have the server set up and all or that your shared
<form action="sendmail.php" method="post" enctype="text/plain">
<input type="text" name="email" value="Email">
<input type="text" name="message" value="Message">
<input value="Submit" type="submit">
</form>
sendmail.php
$email=$_POST['email'];
$message=json_encode($_POST);
$receiver="MY_EMAIL#yahoo.com";
$mailer="mailer#myservice.com";
mail($email,"Message for enquiry or whatever",$message, array("from"=>$mailer));
There were, at some point, browsers that supported forms of this type. However, they're all gone now -- you will need a server-side script to send email. It's impossible to do using HTML alone.
You are confusing a few things.
When you Submit a form, it goes from the client (browser) to your server, which acts upon it. The form action needs to be a URL which handles the request. The mailto: URI scheme is not a valid action to use.
You have two choices:
You can create a mailto: link like this:
Send email
which will open your default email client,
OR
You can put a URL corresponding to an end point on your server, something like
form action="/send/mail"...
and have your server send the email
I believe the easiest way to do this is using a service like Zapier or IFTTT. Both of them offer a way to create Zaps/Applets that can send an email when you post to a specific url.
This is what configuration would look like in IFTTT and Zapier .
IFTTT is simpler to setup, Zapier has more options, like sending to more than one emails. I believe IFTTT only lets you send to your account's email.

I want to pass form data from my website to a website not owned by me

I want to create a donation form on my website that forwards donors to the PayPal donation page at wikileaks.org. Wikileaks allows donations targeted for specific causes that Wikileaks supports. My website is fundraising for one of these causes.
My form won't pass any secure information like credit card #s, etc. I want it to send only the amount my visitors wish to donate, and the name of my charitable cause.
Here is some sample code: donate.htm
<html><head></head>
<body>
How much would you like to donate?
<form action="receive.php" method="get">
<label for="25">25</label>
<input name="amount" type="radio" value="25"></input>
<label for="50">50</label>
<input name="amount" type="radio" value="50"></input>
<input type="submit" value="Send" />
</form>
</body>
</html>
And here : receive.php
<html><head></head>
<body>
<form>
<input type="text" value="<?php echo $_GET['amount'] ?>"/>
</form>
</body>
</html>
This works because I own both pages. I don't own the wikileaks page, which may or may not run on PHP. My goal is to post "Hello Wikileaks" to the 'custom' form field below which is located at http://www.wikileaks.org/wiki/Special:Support#go_pp
I should be able to figure out the rest if I can accomplish this.
<label>Message with your donation</label>
<input class='text' name='custom' type='text' value='' />
This is most likely not possible, as there would have to be PHP (or other) code actively adding the value from the GET parameter inside the target page. Doing that in a PayPal payment form would not be very security conscious.
There is no Javascript workaround either, because you can't access the DOM of a page on another server from within your page (Single Origin Policy).
You will have to talk to Wikileaks and ask them whether there is any way to add the message.
As the form on wikileaks directly posts its data to PayPal I think your chances of success are limited. The wikileaks page does no processing of form data. Neither can you access the wikileaks form via Javascript from your page due to security restrictions.
You could however directly post to PayPal, thus copying the form from Wikileaks directly to your page and forwarding the user to PayPal.
If you don't mind submitting the form straight to Paypal on Wikileak's behalf, just copy the form's HTML from that page, including action='https://www.paypal.com/cgi-bin/webscr'.
You cannot, under no circumstances, decide with which data a field on a foreign website will be pre-filled. That's entirely up to the author of the foreign website.
What about another way:
The WikiLeaks PayPal donation form has its form action set to PayPal (which is how PayPal donations work), which means that no form data is posted to WikiLeaks itself.
If you want to offer your visitors a possibility to donate to WikiLeaks via PayPal, why don't you simply include the WikiLeaks donation form in your own website? Change the custom form field type from text to hidden and enter your charitable cause statically.
In either case, the visitor will be redirected to PayPal to authorize the payment.