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
Related
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."
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>
Hello and thank you for viewing my question. I am a complete beginner and am looking for simple ways to do the following...
What I have in seperate linked documents:
HTML, CSS, Javascript, PHP
What I am having trouble with:
I need to use something like JSON (although I would also accept XML requests or Ajax at this point if they work) to transfer variables from Javascript to PHP. I need the variables to search in a database, so they need to be literally available within PHP (not only seen on a pop-up message or something).
I have seen a LOT of different ways to do this, I have even watched tutorials on YouTube, but nothing has worked for me yet. The things I am having the biggest problem with is that when I add a submit button to my form it doesn't submit my form and I don't know why.
Form code snippet:
<form id="form" name="input" method="post" action="javascript:proofLength();">
<input id="userinput" type="text" autofocus />
<input id="submit" type="button" value="submit" onsubmit="post();">
</form>
The second to last line there doesn't work. Do I need javascript to submit the form? Because I really thought that in this case it was part of the functionality of the form just like method="post"...
The other thing is that for JSON, I have no idea what to do because my variables are determined by user input. Therefore, I cannot define them myself. They are only defined by document.getElement... and that doesn't fit the syntax of JSON.
Those are really my main problems at the moment. So if anyone could show me a simple way to get this variable transfer done, that would be amazing.
After this I will need to search/compare in my database with some php/sql (it's already connecting fine), and I need to be able to return information back to a in HTML based on what I find to be true. I saw one example, but I am not sure that was very applicable to what I am doing, so if you are able to explain how to do that, that would be great also.
Thank you very, very much.
April
You don't need ajax to submit this form. You don't even need javscript. Just do this:
<form id="form" name="input" method="post" action="mytarget.php">
<input id="userinput" name="userinput" type="text" autofocus />
<input id="submit" type="submit" value="submit" />
</form>
This will send the form data to mytarget.php (can be changed of course)
See that i have added the name attribute to your text-field in the form and i changed the type of the button to submit.
Now you can work the Data in mytarget.php like this:
<?
$username = $_POST['userinput'];
echo "Your name is: ".$username;
?>
You wanted to have a check for length in the submit. There are two ways to this:
Before the input is send (the server is not bothered)
Let the server Check the input
for 1 you will have to append a event listener, like this:
var form = document.getElementById("form");
form.addEventListener("submit", function(event){
console.log("test");
var name = form.elements['userinput'].value;
if(name.length < 3){
alert("boy your name is short!");
event.preventDefault();
}
});
Enter a name with less then 3 characters and the form will not be submitted. test here: http://jsfiddle.net/NicoO/c47cr/
Test it Serverside
In your mytarget.php:
<?
$username = $_POST['userinput'];
if(strlen($username) > 3)
echo "Your name is: ".$username;
else
echo "your name was too short!";
?>
You may also do all this with ajax. You will find a lot of good content here. But I'd recommend a framework like jQuery to do so.
The problem is in this line
<form id="form" name="input" method="post" action="javascript:proofLength();">
The action should be a PHP page (or any other type of server script) that will process the form.
Or the proofLength function must call submit() on the form
In the php page you can obtain variable values using $_GET["name"] or $_POST["name"]
To summarize; your code should look like this
<form id="form" name="input" method="post" action="yourpage.php">
<input id="userinput" type="text" autofocus />
<input id="submit" type="button" value="submit">
</form>
and for your php page:
<?php
$userinput = $_POST["userinput"];
//Do what ever you need here
?>
If you want to do something in your javascript before submitting the form, refer to this answer
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
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.