The protocol mailto is a special type of URL that opens the default application of user device emails.
The message was "disfigured" because the parameters were not passed to the URL. There are basically two: subject (subject of the message) and body (message body). The URL has the following format (removed from this link: Email sharing link)
mailto:[E-MAIL]?subject=[ASSUNTO]&body=[CORPO-DA-MENSAGEM]
If your goal is for the contact form to open the default email application from the user, then you can follow an approach like the following HTML (I basically modified your code), which gets the field values via Javascript, fills the URL mailto and opens it using the function window.open(url, target).
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Form</title>
</head>
<body>
<script>
function submitForm(){
var mailtoURL = "mailto:[email protected]?"; //URL do protocolo mailto
//obtém o equipamento
var equipamento = document.querySelector("#contato input[name='size']:checked").value;
//obtém o nome
var nome = document.querySelector("#contato input[name='Nome1']").value;
//obtém o valor do campo Cidade/Estado
var cidadeUf = document.querySelector("#contato input[name='cidade-uf']").value;
//obtém o e-mail do remetente
var emailremetente = document.querySelector("#contato input[name='mail']").value;
//obtém o telefone
var telefone = document.querySelector("#contato input[name='telefone']").value;
//o assunto da mensagem é o nome do equipamento (você pode mudar)
var assunto = encodeURIComponent(equipamento);
//corpo da mensagem: contém nome, cidade/estado, telefone e e-mail do remetente
var corpoMgs = encodeURIComponent("Nome: " + nome) + '%0D%0A';
corpoMgs += encodeURIComponent("Cidade/Estado: " + cidadeUf) + '%0D%0A';
corpoMgs += encodeURIComponent("Telefone: " + telefone) + '%0D%0A';
corpoMgs += encodeURIComponent("e-mail: " + emailremetente);
//acrescenta o corpo da mensagem e o assunto à URL do mailto
mailtoURL += "subject="+assunto+"&body="+corpoMgs;
//abre uma nova guia/janela com a url (isso vai abrir o aplicativo padrão de e-mails)
window.open(mailtoURL, '_black');
}
</script>
<form id="contato" onsubmit="submitForm()">
<p><span style="color: #283649; font-size: 14px;">Equipamento*</span></p>
<input name="size" type="radio" value="Solar Banho" checked />Aquecedor Solar Banho<br />
<input name="size" type="radio" value="Solar Piscina" />Aquecedor Solar Piscina<br />
<input name="size" type="radio" value="Aquecimento a Gás" />Aquecimento a Gás<br />
<input name="size" type="radio" value="Energia Solar Fotovoltaica" />Energia Solar Fotovoltaica<br />
<input name="size" type="radio" value="Equipamentos para Piscina" />Equipamentos para Piscina
<p><span style="color: #283649; font-size: 14px;">Nome*</span></p>
<p><input maxlength="100" name="Nome1" size="100" type="text" value=" " /></p>
<p><span style="color: #283649; font-size: 14px;">E-mail*</span></p>
<p><input maxlength="100" name="mail" size="100" type="text" value=" " /></p>
<p><span style="color: #283649; font-size: 14px;">Cidade/Estado*</span></p>
<p><input maxlength="100" name="cidade-uf" size="100" type="text" value=" " /></p>
<p><span style="color: #283649; font-size: 14px;">Telefone*</span></p>
<p><input maxlength="100" name="telefone" size="100" type="text" value=" " /><br />
<input type="submit" value="Email Yourself" /></p>
</form>
</body>
</html>
The following image is an example of what it would look like if the default application was Gmail
Keep in mind that this method is limited and will not work if the user does not have an email application installed. I suggest you do as Anderson suggested in the comment and use some third-party service or an email service of your own (if applicable).
Just define the
actionasmailtodoes not send the email. You will need to do this manually with some programming language (or third party service).– Woss
you could help me?
– Paula Lutzoff
Check out this link, Paula: https://www.oficinadanet.com.br/post/12811-formulario-contactus
– Bia Silva