Send data form to a specific email - javascript

I want to send my data form that user type to a specific email. Example:
<form>
<input type="text" placeholder="Your name"/>
<input type="email" placeholder="Your email"/>
<textarea name="content"></textarea>
<input type="button" onclick="sendmail()"/>
</form>
When user clicks the button, an email will be sent to a specific address like admin#admin.com with email's content is what user type in the form. Can we reach that result with only JavaScript or jQuery?

You can't do it without additional modules :
This is a good tutorial , you could create a dedicated address reported#yoursite.com and have it email your admin address when a user registers

<a id="emailLnk" >send mail</a>
<script type="text/javascript">
$(document).ready(function() {
$("#emailLnk").click(function(){
document.location.href = "mailto:xyz#something.com";
});
});​
</script>

No, unless someone took the time to rewrite a SMTP client or sendmail in JavaScript, which is not the case. Moreover, that would mean giving away the SMTP password (which is bad) or not using a SMTP at all, meaning that almost all free/commercial providers will reject your e-mail.
You should set up a minimal PHP script to receive a POST request and forward the body as e-mail to your designed account. You should be able to do it in a handful of lines.

Related

How do JavaScript logins hide user sign up information?

I have a question that is bugging me a lot. How do JavaScript logins hide and protect user login information? Their are possible ways of making a login using javascript and html, but the user login information is visible in the coding. Here is a javascript login example:
<html>
<head><title>HTML and JAVASCRIPT example</title>
<script>
function what() {
if (document.ThisForm.Username.value == "Example Username"
&& document.ThisForm.Password.value == "Example Password") {
document.location.href = "loginsuccess.html"
}
</script>
</head>
<body>
<form name="ThisForm">
<table>
<tr>
<td>Username or CMSCE email:</td>
<td><input type="text" size="70" name="Username" id="hi"></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" size="70" name="Password" id="bye"></td>
</tr>
<tr>
<td><input type="button" onClick="what()" value="Login" style="color: white; background-color: black"></td><td><input type="reset" value="Clear all"></td>
</tr></table></form>
</body>
</html>
This coding is a HTML and Javascript login. This login is not safe, because as you can see, the script tag includes the usernames. So how do JavaScript logins keep the login information safe? Please help me!
This is not how login works
So how does it work?
The check for whether user entered the correct username and password combination is performed on the server and not on the client.
How does the information reach the server?
When you hit submit on the form, a "post" request is sent to the server with your username and password in the body of the request. It is still not secure. Anyone with a network traffic analyzing software like Wireshark can see the request and all its contents. Hence we use SSL, which encrypts the information in the request so it is secure.
At the Server, we try to find the username in the database, and if we do find it, we compare the passwords, and if they match, then the user is allowed to login.
As a person type the username or password they will not dynamically show up in inspect element as value parameter. So others will not see the username or password by simply looking through inspect element. So, inspect element is static so-to-speak and will not change in that sense. They will just see how you implement the code but not the password or username itself.

HTML5 form validation for email [duplicate]

This question already has answers here:
HTML5 Email input pattern attribute
(20 answers)
Closed 7 years ago.
I am stuck with this issue to which I did not pay attention to before.
<label> Email Address </label>
<input type="email" id="emailAddress" required placeholder='Email Address' />
<button type="submit" class="button primary small">Submit</button>
In my JS file I am checking for its validation using checkValidity()
checkValidEmail: function(event){
var emailAddress = $('#emailAddress');
if(emailAddress[0].checkValidity()){
console.log('Valid');
} else{
console.log('Not Valid');
}
}
"keyup #emailAddress": "checkValidEmail" // KeyUp works as expected
Output:
'a#b' // Valid
I do not understand this behavior. As per my knowledge #.com was the regex for input email.
Please note: I tried this on multiple sites with forms and it shows the same input. In the above case I am executing this on the chrome browser.
Thanks for taking time to reply!
If you want to use regular expression validation, read on
http://www.regular-expressions.info/email.html
Be aware that below is 100% valid and working email address :-) Use it often for testing incorrectly implemented email validation
xn--80a1acny#xn--80auew.xn--j1amh
Another option is to check if email address domain name is valid. Do do that you can query DNS server for MX record (this one points to SMTP server responsible for receiving incoming mail). You will need server side code to do that.
in HTML5 you can validate email like this
<form>
<input type="email" placeholder="Enter your email">
<input type="submit" value="Submit">
</form>

validate form with ajax using POST with no jquery needed

I'm trying to validate a form without using jQuery as in my project I do not need jQuery. I would like to save on loading files for the sake of performance. I've checked on youmightnotneedjquery and I found this snippet to use POST with Ajax.
I only find tutorials how to validate emails with jQuery or PHP. Could somebody could explain me, guide me or knows about a tutorial that could help me?
I would appreciate it greatly!
I also checked this framework from microjs.com but there are also no instructions :(
Ajax:
var request = new XMLHttpRequest();
request.open('POST', '/my/url', true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.send(data);
HTML form:
<form class="contact-form">
<label for="email">
Email*
</label>
<input id="email" type="email" name="email" placeholder="example#emailserver.com" required>
<label for="telephone">
Telephone
</label>
<input id="telephone" type="tel" name="telephone" placeholder="+32 343 645 461">
<label for="message">
Message*
</label>
<textarea id="message" placeholder="Place your magnificent message here..." required></textarea>
<input id="sendcopy" type="checkbox" name="sendcopy">
<label for="sendcopy">
Send yourself a copy of the email
</label>
<input type="submit" name="submit" value="Send">
<span class="required-field-legend">
<!-- insert icon -->
Required fields
</span>
You can take a look at Mozilla Developer Network and try using XMLHttpRequest. To give you the basic idea, you will have to write a php file which receives the information from the form fields, does some checking and sends an XML response back. Then you will have to show something to the user according to what has happened (for example the email address was empty).
Another approach (which is the one I would suggest) is to do your validation with javascript. Just get the value of the element you want, for example:
var tel = document.getElementById('telephone').value;
and then check if it is ok. You can do that with Regular Expressions. In case there is something wrong, notify the user. This way you don't use the server at all. I hope I 've helped...
See this jsfiddle to understand what I mean by saying I prefer validation at client side.

Subscribe to Newsletter Form

I have a form which includes the input field and submit button.
<form class="subscribe">
<div class="">
<input type="text" placeholder="Your e-mail adresss">
<span>
<button type="button">Subscribe</button>
</span>
</div>
</form>
What is the easiest way to make this functional using front-end only so that when new email is entered I will receive an email with the new signup info. Is this possible with JS/Jquery only?
Yes this is possible now! You dont even need javascript/jquery to implement this.
There is a good API Endpoint that you can use to send an email such
as this one: https://formsubmit.co
You can read through the documentation for more information. But here is
a little snippet that you can use:
<!--
*Provide your email address on action attribute
*The email you provide on action attribute will be the one to receive an email.
-->
<form action="'https://formsubmit.co/yourEmail#email.com" method="POST">
<input name="email" type="email" required>
<!-- You can add more input/fields, this message input is just to notify you about the subscribers-->
<input hidden name="message" value="Hey! I want to subscribe on your news letter." type="text">
<button type="submit">Subscribe</button>
</form>
That's not possible in the front end. You have to do this server side.
The only thing possible with pure javascript is bringing up the users default email client with a predefined message. But the user will still have to send it.
function sendMail() {
var link = "mailto:me#example.com"
+ "?cc=myCCaddress#example.com"
+ "&subject=" + escape("This is my subject")
+ "&body=" + escape(document.getElementById('myText').value)
;
window.location.href = link;
}
If you want to sent any mail you have to use server side function, But javascript/jquery is client side script.
you can do this make a ajax request and send all data then send mail with your need.
javascript or jquery cant provide that facility because it will be loaded and executed in client side browser. To send a mail you need protocal(SMTP) and server help.
Solution:
1.Use AJAX and serialize your form elements and post it to server file
2.Create your server side file and in that get the posted value and send a mail.ex: php(server side)
mail("youremailaddress#gmail.com", "subject" .$email, $message);
Need more stuff see this ..

Open page with html form and then pre-fill it

I would like to create a .html file with a link to gmail.com. When clicking the link, I would like to have my email address automatically filled in as the undermake. I would like to use JavaScript for this. That is, I would like to insert text from a JavaScript variable.
I noticed on the source code for the login page for Gmail that there is the following:
<label for="Email"><strong class="email-label">Username</strong></label>
<input type="email" spellcheck="false"
name="Email" id="Email" value=""
>
So, I guess that, my question is : how can I give a value to Email in this form on the gmail login page?
It looks like you can specify an email address in the URL for gmail:
https://accounts.google.com/ServiceLoginAuth?Email=email#example.com

Categories