Submitting HTML text form? - javascript

I have built a very simple website and paid for my .me domain. I have a simple text form for email addresses and a submit button. I would like to upload the email address to my server once the "submit" button is pressed.
I searched the internet but couldn't seem to find any help doing this. I would like the simplest solution possible. Could anyone direct me to the correct resources? Is this a relatively simple task that can be done with only HTML CSS and JS?

Just using HTML, CSS and JS wont do. You need a way of handling what the user is submitting to your server, some sort of a server side scripting language, PHP, Python, Perl, etc.
Here's a PHP sample
if(isset($_POST['email'] && !empty($_POST["email"])){
$email = $_POST['email'];
// save email address code here...
}

I would like to upload the email address to my server once the "submit" button is pressed.
For what purpose? To create a mailing list? The easiest way to do this is to sign up for an account at something like MailChimp or CampaignMonitor. They give you a simple form to place on your site that allows people to enter their email address and submit it to a database. Then, you log in to that third party service to manage the database, send out emails etc. Works very well.

You could try Windows Azure Mobile Services. Create a table to store the data and then you only need JavaScript, thus avoiding any Server Side tech. This is a paid for service of course but you can get a free trial. https://www.windowsazure.com/en-us/documentation/articles/mobile-services-html-how-to-use-client-library/#create-client

What you can do is not save the information to a file, but save it to a Data Base.
You will need to learn PHP and MySQL (the easiest ones, and there is much tutorials about them)(and probably phpMyAdmin as well).
Look for tutorials, if you don'f find a good one, tell me.

Related

How can I add a button that sends an email with a PDF attached?

I don't really know if it is possible but I am creating a catalog in indesign using in5 plugin which converts the indesign in HTML using javascript and jQuery. In each page of that catalog have 6 products.
How can I make a button that, when clicked, opens the email client app (for example, Outlook) with the PDF of the specs and technical drawings of the product attached?
Please help me or point me in the right way.
Thank You
Honestly, if you want options on who you send the email to and what it contains,
there's no magic HTML button that's going to just send an email for you.
If you plan on using JavaScript you should probably learn how to use NodeJS and the Nodemailer module.
This will allow you to set up a server with which to create and send emails from on your site, not just open a pre-existing client.
Here's what you might want to see to get started.
https://youtu.be/nF9g1825mwk
Then when it comes to Nodemailer use this one because the last video is outdated.
https://www.youtube.com/watch?v=h7wH7aEb8Ok
I don't know if this is quite accurate, but attempt this:
Make the button, so that it has a hyper reference(href) to the link to the app . You can use a container to send a message.
You can include a link to the pdf.

HTML form with Javascript validation and PHP script which sends form details to webmaster by e-mail

Complete newbie looking for some guidance. Will be very grateful if someone could help me out! Just want to confirm that the below is possible or if there is a better alternative, or I'm blatantly missing something!?
So, I'm developing a site with a simple form - it will take the user's name, email address, contact number and a message.
So as far as I understand I can do the following:
1.Write the form in HTML and style with CSS.
2.Validate the form client side with Javascript
3.Use PHP to validate server side incase user has Javascript disabled.
4.Use PHP mailer to send the details to an email address where the site will be hosted.
5.On page error or success message for the user to see.
Would really appreciate it if you could recommend resources which will guide me through the process.
Thanks a million!
Drop the PHP side of things, and use this pre-made secure script NMS Formmail.
There's no validation on that side, but I don't think you'll have to worry about it much. Worst case you'll get an incomplete email that you just have to toss.
JavaScript validation: http://webcheatsheet.com/javascript/form_validation.php
If those functions don't work, just look around, there are plenty of other examples.
Now all you have left is the HTML and CSS.

Emailing from Javascript

I know this topic has been covered from all sorts of angles but I'm not sure I've seen the answer to my specific question.
I am writing a prototype web page in HTML5, CSS, and Javascript. I want the user to be able to browse to a file to attach then attach that file to an email I send to a specific email address I've setup. I don't want the user's default email program to pop up.
I have addresses to SMTP servers within my companies intranet but I don't have access to a server at the moment to put server-side code on. On the web page the user will know email is involved but I don't want them to have to do a thing other than select the file and click a button with no other screens popping up.
I know how to use mailto in order to send an email but I don't think you can use that with attachments.
Is there anyway to do this without having to mess with the server side? Is knowing an smtp server address that I have permissions on enough? Again, this is a prototype but possibly the basis for a new feature on a product.
Thanks!
Is there anyway to do this without having to mess with the server side?
Nope, not unless the target browser has exposes an SMTP client object. (And I don't think any do. That would make spam botnets quite a bit easier to build...)
You need to do this on the server.
Email cant be sent just by client side . You must either use a mailto link if you want it on client side but that's not best way . Instead you should send a request to server and do server side processing .If you have SMTP credential you can send email with server side.
I recently wrote a plugin for PostageApp that lets you send emails through jQuery. Basically, you just have to feed it your API key along with the message payload and you can send it through. With PostageApp, you can add your SMTP servers to the app and send through them.
Usage looks like this:
<script type="text/javascript" src="postage.js"></script>
<script type="text/javascript">
$(function() {
$('p').postage({
apiKey: "API KEY HERE",
recipients: "recipient#email.com",
template: "TEMPLATE_SLUG" });
});
</script>
I didn't publish the plugin because well... it never made sense for production usage because your API key was exposed and that's not a good thing. However, it is decent for prototyping (I use it!) and I would be happy to share.
(Full Disclosure: I am the Product Manager of PostageApp.)

html: price listing based on email

I am building a website for a customer who may not be very computer literate. This person knows how to use email. How can I build a website (purely html, javascript) where he can email his latest prices and the website automatically updates itself. I dont think he would be literate enough to FTP file some where. Is it possible?
How to build a secure login page and redirect to order page using only javascript and html?
How to create secure administrative section on javascript/html only website?
I would advise you to create a nice admin web interface, and teach him how to use it. Or, agree some kind of Excel format for product prices, and teach the steps of uploading a csv file. Doing things by email would complicate things in my opinion.
As in the website receives the email as data input? That's probably not going to work very well. Also, if the client is as you imply, expect those emails to be poorly formatted, filled with typos, etc. It's not a very good data entry medium by any means.
The ideal solution would be to build an admin page into the website where the client can enter the information in as controlled a manner as possible, validating the information on the spot rather than through an email (would the server send a reply email for invalid data? that would get infuriating quickly). A simple and intuitive UI should be able to overcome any computer literacy issues he may have.
I don't think this can be done purely in HTML/Javascript. It would need a server component. You would have to set up some sort of POP3 or IMAP listener that polls a mail server for correctly formatted email then dumps that into a database to update the site. Certainly not trivial.
I would build an administration portion of the site to allow the customer to log in and enter the data...no matter how illiterate, they certainly can be trained. ;-)
You could make the mail your prices thing work by just regulary checking a specific mailbox (over POP3 for example).
But that's something you won't be able to do in only pure html / javascript (and consider this: you would also need to store the mailbox credentials in client side code then!)
Email is a store-and-forward, asynchronous transport. You can use it to transport:
plain text (the body of an email)
styled text (the html body of a MIME email)
attached files
But none of those options will work well in your use case. You'd have to try to parse the body of the email if you were looking in the body for update information. -- Bad idea
And if you're using email to transport ordered data such as csv or Excel files, uploading the files directly to the website would enable a much better user interface.
You shouldn't use Excel files either since it will be too complicated for your user--he'd need to get the column (field) names exactly right, the content cells would also need to be exactly right, etc. Eg I use an excel file for input on one of my systems and a constant problem is zip/postal codes since they look like numbers but can have significant leading zeroes. Few users know how to enter them...
Recommendation create a set of web forms in the administrative section of the website. Your customer will be happy and you'll be even happier due to lower volume of support calls.

What is a good way to get feedback from a user on a website?

I'm working on a website for my county's fair. I want to allow my visitors to be able to ask me questions by inputing their name, email, and comment in a form like this one:
http://lincolnfair.net/images/feedback.JPG
So I guess my real question is how can I send an email (using JavaScript/JQuery) to myself with all these fields as the main body of the email.
You should use a server-side script (e.g. PHP, Python, Perl, etc.). With pure HTML and JavaScript, you can use a mailto form, but this will be very unreliable.
I will suggest uservoice.com , it can integrate with your site nicely, a much more powerful user feedback system, without spending time to code the feedback system yourself
As others have indicated, this is a typical task that can be solved easily using a server-side language. Javascript and jQuery aren't the right tool for this particular problem. To point you in the right direction, use method="post" for your form, and you can access users' submission in a PHP file by examining the $_POST variable. If a <input> element in your form has name="email" in your email, you can access that variable in PHP as $_POST['email']. If you're interested in a PHP solution, look at the documentation for the mail() function.
Jukka has a good guide on How to write HTML forms. It should give you everything you need to produce something functional.
You need a server side component, nothing client side will be a reasonable substitute for that. JavaScript won't help for a form as simple as the one you describe.
The most reliable way will be to use a server side script in your preferred language. The specifics of how to do this are probably outside the scope of this question and would depend upon your language of choice.
Your other option is to set the action of the form as a mailto: which will use the visitors preferred email client to send the email. This will work but is really bad and relies on the viewer having an email client installed and configured.
you can find out more information about the mailto option at http://www.chami.com/tips/internet/010597I.html
Another good option would be a third party site such as www.wufoo.com which handle all of the email business server side for you on their own servers. I believe Wufoo even allow you to embed their forms within your own site.
If you want it to be available on every page, you might want to consider using jQuery and the UI Dialog plugin. You could set it up so that the default feedback is a mailto which gets replaced using javascript with a link that brings up a jQuery Dialog containing the fields you want to collect. This could be submitted back to your server via AJAX and delivered to you via email from the server.
EDIT: Since you've edited your question to indicate a server-side only solution, the above seems somewhat out of context. With others, I would agree that using some client-side code to actually send the email is the way to go (as alluded to above). I think it's preferable to use your own server for this, but I'm sure that you can find many "form to email" services. I would avoid these, unless you want your email addresses harvested for use in SPAM. You might also be able to use a signed applet or ActiveX control for this, again I would not go down that route. As indicated above, I would let the browser handle the interface, but my server handle the sending of the email.
I am not sure i understand your question completely, but if all you want to do is conduct a survey over email, i don't think you need to use jQuery or HTML.
A very simple way to do it is to use the 'Forms' feature in Google Docs.

Categories

Resources