Form data won't send using Javascript to email - javascript

I am new to HTML and Javascript, but I have tried to do research on how to get a form to send its information to an e-mail address when the submit button is selected. Most of my research showed that PHP is needed, but when I asked my professor, he said it can be done using only javascript and the assignment needs to be submitted that way. Below is what I am trying to get to work.
<SCRIPT LANGUAGE="JavaScript">
function mailMe(form){
Subject=document.Registry.name.value;
location = mailto:XXXXXX#yahoo.com?subject="+Subject;
return true;
}
</SCRIPT>
<FORM NAME=“Registry” onSubmit="return mailMe(this.form)" >
<h3><font size=6pt> Visitor Registration </font></h3>
</br>
Name <input type="text" name=“name”><br>
<br>
E-Mail Address <input type="text" name=“mail”><br>
<br>
<INPUT TYPE="submit"><br>
</FORM>

It can't be done using only javascript or client-side technologies.
But you can probably open a new window with a mailto link.
Please note this won't send an e-mail, but instead open your local e-mail application to send an e-mail.

This is a really bad idea. You should use AJAX and PHP, this is really the better method.
If you really want your code, you have a few errors. This is correct:
var Subject = document.getElementById("name").value;
window.location = "mailto:XXXXXX#yahoo.com?subject=" + Subject;
Then you have to add an ID to the name field:
<input type="text" name=“name” id="name"><br>
But let me say that you really should use PHP mail(), because then not the client email program is used to send the mail and all is done in background.

I just tried the example below which I found at Microsoft and it worked fine. Can even be done without Javascript by simply adding the "mailto:" to the form action attribute. Also note that the form element names correspond to mailto query string parameters, i.e., "subject" and "body".
References: Microsoft mailto Protocol and RFC2368:The mailto URL scheme
Micosoft SharePoint, Adobe LiveCycle, and other middleware are able to process the emailed forms on the back end. Or one could roll their own using Java, C#, PHP, etc. Yet, that wasn't part of the class assignment ... er ... I mean question.
<html>
<body>
<form action="mailto:user#example.com" method="get">
<input name="subject" type="hidden" value="Message Title">
Feedback:<br/>
<textarea name=body cols="40">
Please share your thoughts here
and then choose Send Feedback.
</textarea>
<input type="submit" value="Send Feedback">
</form>
</body>
</html>

Related

Submit form with HTML and JS to email

I am using a form for people to submit contact requests for a website. I'm using JS and HTML for this website. I've tried to use mailto but it doesn't actually send anything to my email when I press submit. I don't want to use PHP if I can avoid it since I don't know PHP that well.
Here is my HTML
<form method=POST action="mailto:naomikudren#gmail.com" enctype="text/plain">
Company<br>
<input type="text" name="companyname"><br>
Contact Person<br>
<input type="text" name="contactname"><br>
Phone number<br>
<input type="tel" name="phonenumber" min="6" max="15"><br>
Email<br>
<input type="email" name="email"><br>
Message<br>
<input type="textarea" name="message" style='white-space:pre-wrap; height:200px;width:500px;'><br>
<input type="submit" value="Submit">
</form>
I haven't done anything in the JS document for this to work. Do I have to use some sort of command for when submit is pressed in JS or should it be enough to do all this in HTML?
You cant send email directly using Javascript, leave aside HTML.
what you can do is open another window with Mail To option.
window.open('mailto:test#example.com');
//or with subject using below
window.open('mailto:test#example.com?subject=subject&body=body');
Otherwise you can do AJAX call to server which sends mail, but that will need PHP or other backend programming.
You have to use a server side language to send emails .. You cannot do it using client side language like js. So better use a simple php function to send email. It's not difficult ...
You cant send email directly using Javascript. For this you have to use php Mailing function, which has a very simple syntax.
<?php
// the message
$msg = "First line of text\nSecond line of text";
// use wordwrap() if lines are longer than 70 characters
$msg = wordwrap($msg,70);
// send email
mail("someone#example.com","My subject",$msg);
?>
"NO! JavaScript can't email a form! but, there are alternatives to send the form data to an email address.
There is no direct method provided by JavaScript to send the data submitted in the form to an email address.
The main concern for not providing a ‘JavaScript email form’ feature is security."

Retrieving Tumblr Username From HTML Form

I'm new to Javascript, and am currently writing a custom HTML page for my tumblr.
I understand that you can toggle a button to call a function in JS. I'd like to know how to retrieve a user's username when the button is clicked, within this function. I would like to email this information back to myself but can find no documentation on this anywhere :(
I understand the Tumblr has its own stock Ask form. However, I would like to customize my own. My HTML form is below:
<form action="sendUsername()" >
<textarea rows="4" cols="50" id="message"></textarea>
<input type="submit" value="Submit">
</form>
JavaScript
function sendUsername(emailAddress, message){
//email username and message to emailAddress
}
For the getting the username, you need
HTML:
<input type="text" name="username" id="username" />
and
JS:
var username = document.getElementByID('username').value;
to get the input value stored in a variable
However, I don't think you can send an email to yourself straight from Javascript without a third-party API. It can be done using PHP's mail() function though
http://php.net/manual/en/function.mail.php
If you don't want to use PHP at all, then have a look at this:
How to send an email from JavaScript

JavaScript equivalent of PHP mail()

Is it possible to send an email using JS, like PHP's mail() function.
I know you can use mailto in the action, like this:
<form action="mailto:example#example.com">
<p>Type In Your Email</p>
<input type="email">
<input type="submit">
</form>
But that just opens up the default email program. I want to send an email to the email they entered, from a different address.
Is there a way to send an email in JS, from a custom email address, without opening the default mail client?
No. You can't send an email using HTML form action. You'll need to do it using server-side languages like PHP.
Nop., with the help of only HTML you we can't send mail() because for sending emails we need to set server-side script so that server can send or receive requests
You can do it it javascript or jquery.
<form id="frm" action="mailto:example#example.com">
<p>Type In Your Email</p>
<input id="email" type="email">
<input id="btn" type="button">
</form>
<script>
$(document).ready(function(){
$('#btn').click(function(){
$('#frm').attr('action', 'mailto:' + $('#email').val() ) ;
$('#frm').submit();
});
});
</script>
Yes, you can use python or ruby
...the title is misleading.
No, you'd have to use something in addition to JavaScript and html

Submit HTML form to display entered info in new page

I have a HTML form (called form.html)and a JavaScript function such that when form is submitted, information in that form will be displayed.
Now I want all those info will be shown in new HTML page (called confirm.html), where should I go from?
NOTE: No php or sever-side or anything that really seriously related, it's just simple OFFLINE HTML-form problem, I just have 2 html place in same folder, I will test it on my browser, that's it. Only thing that I worry is how to use information from form.html file in confirm.html file since they are obviously separated.
Thank you very much, here is my form.html ( I dont have confirm.html yet)
<HTML>
<HEAD>
<TITLE>Contact</TITLE>
<script type="text/javascript">
function addtext()
{
var fname = document.myform.first_name.value;
var lname = document.myform.last_name.value;
var email = document.myform.email.value;
document.writeln("Thank you! You have just entered the following:");
document.writeln("<pre>");
document.writeln("First Name : " + fname);
document.writeln("Last Name : " + lname);
document.writeln("Email Address : " + email);
}
</script>
</HEAD>
<BODY>
<center>
<b>CONTACT US</b> <br></br>
<form name="myform">
<label for="first_name">First Name </label>
<input type="text" name="first_name" maxlength="50" size="30">
<br>
<label for="last_name">Last Name </label>
<input type="text" name="last_name" maxlength="50" size="30">
<br>
<label for="email">Email Address</label>
<input type="text" name="email" maxlength="80" size="30">
<br>
<input type="submit" value="Submit" onClick="addtext()">
</form>
</BODY>
</HTML>
Check out the window object of JavaScript: http://www.devguru.com/technologies/javascript/10855.asp
It has a property location, if you write into it, your browser will redirect:
window.location = "http://www.google.com";
Note though, that this will not post your data to confirm.html. what you are trying to do without server-side scripting is not very useful. An HTML form will use CGI (common gateway interface) to send data to a server, that can then process the information. If you use the file:// protocol (as you seem to be doing; all local, static files), there is no server-side to process the data, only JavaScript.
If using the GET method of sending the data through CGI, you could extract the data from the URL using javaScript (as mentioned in another question). To do this, just update your form like this:
<form action="confirm.html" method="get">
And do not put a onClick handler on the submit button, just let it submit.
Many other tools exist though that way more are suitable for the job: server-side scripting languages, examples include PHP, ASP, JSP. For local setups, your best best is using XAMPP.
If you don't want to rely on server-side technology, this becomes more complicated (and hacky, I might add). Probably the easiest would be to generate a url like this on submit -
http://localhost/confirm.html?first_name=val1&last_name=val2&email=val3
then add some code to confirm.html to unpack this. Here's a related question you may find helpful.
If you'd allow me a moment of editorializing, what exactly are you trying to do? If this is just a personal project to see how html works, then I'd strongly recommend starting to learn about server-side technology - once you start wanting to handle user data and persist state, you're pretty much forced to use the server. The web is by design pretty stateless; you can't pass variable in-between pages without either using the server, or through some very complicated AJAX & DOM updating techniques which tend to rely on specialized server files anyway. You can run a PHP & MySQL server locally using existing technology, and if you're interested in expanding your knowledge of web technology this is an inevitable step.

Can I use "form post mailto" to send page content by email?

I need to implement a function on my page that when user click a "Send mail" button, it will call local email client and put a div's content in the page into the mail body just like user manually copy-paste to email.
I try to use the code below:
<form action="mailto:someone#host.com" method="POST">
<input type="text" name="subject" />
<textarea name="body"></textarea>
</form>
and use javascript to set subject and body's values. But it seems email body cannot understand html code. It treats those tags as plain text. Besides, there's seems to be a char limit for body.
Can this function be done in front end? thanks a lot.

Categories

Resources