Skip to content Skip to sidebar Skip to footer

Editable Form And Save Changes

I'm hoping this isn't harder than it seems. I want to create an HTML form with a few text boxes that will allow people to enter in some data and I want these changes to be saved t

Solution 1:

I think your question indicates that you don't already know that web pages (including forms) are "stateless", meaning that they do not "automatically" hold or store anything that you do with them. Sorry to disappoint, but as a beginner you will struggle to find "an easy" solution to this.

That is not to say it can't be done - you no doubt see it everywhere - but your level of knowledge misses the fact that you need to actually program the logic to determine how your form will "appear" to store the information and reproduce it on a later visit.

Here's a (really) brief summary:

When your form is used by your user, a couple of things have already taken place before they get to see the form:

  1. the user has requested the page (typing a URL or clicking a link)

  2. the web server has sent the requested page (that is; your website has sent the form)

The next thing that takes place is that your user enters some data on the form. This data is not stored anywhere - if you refresh the page the data is gone, because steps 1 and 2 happen again.

So to avoid this you can use a number of tools:

Javascript: this operates on the user's computer. You can use it to find out if something has been entred on a form, and store it in, for example, a cookie.

Then you will have to build some logic into your page that says, "if my user refreshes the page or comes back to this site at a later date, then look for the cookie. If it exists, then take it's values and pre-fill the form, before the user gets to see it."

Server Side Script: This logic can be built into your web server (using a server side script like PHP) so it actually runs in step 2.

Alternatively you can build it into a javascript function which fires when the page is actually received by your user. This would be a step 3.

A second alternative combines these two ideas (processing on the user side and processing on the webserver side) called AJAX, which basically means that the "discussion" between your javascript and PHP takes place "on the fly" when the data is entered or changed.

And lastly you might want to consider PHP Sessions to store data, and/or a mySQL database. Recently with the advent of modern browsers you now have the possibility to store the information in a local database available to your user's browser...

In all of these cases you will need to learn how these pieces talk to each other, how you retreive the information, and how you update your stateless and static form.

It isn't has straightforward as you might think...

Solution 2:

You don't need HTML5. HTML4 is good enough :)

But you need some server side script that saves the changes (on the server side in e.g. a DB or XML file). To make it a better experience (if multiple users use the form at the same time) I suggest you use AJAX to save the changes and poll the server for updates.

Solution 3:

This is not complicated (at least I don't think it is), but it seems to be a generation ahead of what you already know. And it could take quite a long time to get the structure in place before you can do this sort of thing without needing help.

There are some basic questions

  • Does the information need to stay saved when the user hits reload?
  • Does the information need to stay saved when the user clears cookies?

If the information can be blanked out next time they come back to your page, then it is simple.

Otherwise, we need a way to keep track of which user sees what information, so the guy in Texas does not see the information the guy in Chinatown typed in. Cookies are a common way to do this. You could save the information to the cookies if there is not too much information.

Otherwise, you need sever-side language. This is usually in PHP, but deciding what language has to do with why you want to learn in the first place? Are you wanting to work for a company later on? Do you have your own website?

Please comment to let me know more what is going on, and what the answers are to the two basic questions, and I will better be able to answer.

Usually, for most cases, there is a login name and password (or OpenID), and if cookies are cleared, the user logs in again, but this requires some work to set up a working login before you re-visit this question of how to store what they type.

Post a Comment for "Editable Form And Save Changes"