Best method for functioning forms ? PHP? Javascript?

[Kilbsy]

HI.
I’ve searched this and am settled on creating my own form for my portfolio site using some PHP script copied and pasted into a contact.php file which I will upload to my hosting. But…I’m wondering if there is a more modern way, or this is how it’s supposed to be done?

I have seen that there are open source third-party services that essentially allow you to use their php script to post to your email. I’m wondering however if this produces a page back that has the “message received” type response once the button is clicked. It seems client-side validation is achievable with javascript. Please help! This is for the portfolio project that I’ve been delaying because of hiccups like this. I want a functioning page. There seems to be direct to personal email capability using “action method:get …
"mailto:[email protected]”

My question is how to provide feedback after the button is clicked. I think I could use jquery to select the event and produce a message linked to the button using on.click…I’m sure I can manage this i was just wondering the easiest way. Or if there are pre-built scripts or something that manage the posting, validation and the layout already available in bootstrap. The one I have downloaded don’t seem to work. Sorry for the confused message. I’m confused!!

[tulikavijay]

If you want some feedback to appear without the page reloading, you can try Ajax. A simple $.post() function would do. You can pass a callback sucess function to it. Just Google Ajax. You can use some framework for your project for form validation.

[petercr]

Have you tried FormSpree.io it’s a very simple way to add functioning forms to you website. And if you want you can customize it too. All you need is a little Javascript to make it your own style

[SkyC]

A lot of people use Formspree: https://formspree.io/

It has some security restrictions that require the URL of your form to be static, so you’ll have to set it up and use it in codepen’s debug mode, or deploy it to a static server like Github.

Here’s a #guide on getting started with github pages, in case you need it: https://forum.freecodecamp.org/t/use-github-static-pages-to-host-your-front-end-projects/18396

[AwesomeIndustry]

I generally use an add-on to Node.JS called Socket.IO. It’s an unbeliveably easy way to get started with client-server communications in real-time, and it also has binary streaming, so you can send just about anything.

[nsuchy]

It may be a bit biased but I avoid PHP at all costs, so javascript.

[Kilbsy]

Thanks. This was what I was looking at. How do I go about implementing feedback to the user that the form has been sent or an error message though?

Whichever way is the standard way I can do. I’ve looked at Ajax and php tutorials to do it. I just want the proper way to do it so I can carry on using the same method in future sites. I may be missing the form validation and feedback on formspree as it doesn’t work from codepen. So maybe this is included and I just can’t see it.

So Github pages is for a site to be uploaded and tested whilst working on it? What’s the difference over using my own Web hosting? (I have a domain but no site yet)

Thanks.

[SkyC]

How do I go about implementing feedback to the user that the form has been sent or an error message though?

Formspree has a $.ajax() code sample on their main page. You would hook up standard ajax success and failure functions to give the user feedback. You’ll get a lot of practice with ajax in the next few projects,so you can always go back and code this later. Projects do not need to be submitted in order.

I may be missing the form validation and feedback on formspree as it doesn’t work from codepen

You must use debug mode in Codepen to validate your form. Editor and Full views will not work because they host your page in an iframe and give it a random page name.

So Github pages is for a site to be uploaded and tested whilst working on it? What’s the difference over using my own Web hosting?

Github pages is a place to host your website. You can use your own custom domain name.

[Kilbsy]

Ah. This seems like the way to go for now.

Just wondering … If I choose to use git for version control and also pages as in the guide you linked to – do I have a way of saving locally from within Codepen? Or do I have to create separate html, css and js files? It would be handing if there was a way that it saved locally as well as these could then be committed to Git and render on GitPages.

Thanks…

[SkyC]

You can export your codepen projects by clicking the Export button. You’ll get a .zip file with a HTML, JS, and CSS file in it. https://blog.codepen.io/documentation/features/exporting-pens/