terça-feira, maio 12, 2009

Montar E-mail via HTML/JavaScript

Minha ex estava precisando enviar um formulário por e-mail, mas não podia usar nenhuma linguagem de servidor (PHP, ASP etc). Como é para a empresa e sei que todos usam uma aplicação desktop para ferenciamento de e-mails (Outlook ou Thunderbird), sugeri usar o "mailto" (normalmente usado nos links de contato) para abrir a aplicação e formatar os campos do e-mail.
A função é bem simples e lista no corpo do e-mail os campos e seus valores... e só.


function montaEmail(form) {
var str = 'mailto:seuemail@email.com?';
str += 'cc=copia1@email.com, copia2@email.com&';
str += 'bcc=copiaoculta@email.com&';
str += 'subject=Assunto do E-mail&';
str += 'body=';
for (i=0;i<form.elements.length-1;i++) {
str += '%0A' + form.elements[i].name + ' = ' + form.elements[i].value;
}
window.location.href = str;
}

E no form, ao invés de usar "submit", usar um "button" chamando essa função:

<input type="button" onclick="montaEmail(this.form)" value="Enviar">
Lembre-se que os parâmetros do "mailto" são:
  • destinatários: após o "mailto:" separados por vírgula;
  • cópia: "cc=" e os destinatários separados por vírgula;
  • cópia oculta: "bcc=" e os destinatários separados por vírgula;
  • assunto: "subject=" e o texto do assunto
  • corpo do email: "body=" e o conteúdo.
Como é uma URL, a separação dos parâmetros é feita por "?" após o(s) destinatário(s) principal(is) e depois "&" a cada parâmetro usado. Pelo mesmo motivo, os caracteres especiais devem ser formatados seguindo o padrão URL. Exemplo: Quebra de linha é %0A.

5 comentários:

Anônimo disse...

Finalmente alguem que sabe o que faz

Anônimo disse...

muito bom cara, ja ha um tempo procurando como fazer isso.
Agora soh tenho um duvida: se eu tiver um conteudo predefinido dentro de uma div, como faço pra aparecer dentro do da parte de conteudo do gerenciador de email?

Isso é possivel, acredito que seja chamando a id da div no body da função javascript, mas não consegui fazer.
Espero que possa me ajudar com isso, obrigado desde já...t +

Daniel disse...

Você pega o conteúdo da div usando o seguinte a propriedade innerHTML: document.getElementById("minhaDiv").innerHTML

Anônimo disse...

Amigo.
Não funciona.
O body tem limite de quatos caracteres?
tcserra@hotmail.com

Daniel disse...

A passagem de parâmetros pela URL tem limites estipulados pelos navegadores e/ou programas que se utilizam deste recurso. Estes limites são particulares de cada software, mas adianto que são grandes.
Talvez para o que você esteja necessitando, esta não seja uma melhor forma de fazer. Ao exigir conteúdo muito grande, fica claro que um servidor PHP ou qualquer outra plataforma configurado para enviar e-mail e montar mala direta ou qualquer outro envio mais complexo se faz necessário.
Este script postado é um recurso que permite a junção de campos de um formulário (via JavaScript) e inicie o gerenciador de e-mails no cliente, pressupondo que o cliente o utilize. É uma solução rápida e prática para pré-montagem padronizada de e-mails, sendo o remetente um cliente com perfil conhecido.