1

I'm developing a social network website and I'm working with php/mysql/jquery and I want users to have the most user-friendly website experience. That's why I try to avoid a save (submit) button at all. So, when they're on their own profile and enter information like what languages they speak or where do they live, I want to auto-create a page entry, if it doesn't exist already.

For example if somebody speaks german and that entry isn't available in the database yet (it's called pages with rows title, text, date_added). This is most likely comparable with a Facebook page you can create on Facebook, but this should be about everything (languages, companies, locations, activities).

So my specific problem now is, how to implement this feature the most smartest way. I mean on what event should this save be triggered, because I obviously can't save a new entry on every letter that has been typed. I've already implemented an autocomplete function, so they can choose from entries that already exist, but as mentioned I want them to create new entries (pages), too. Most preferably without "flooding" the database with new entries.

The things I thought of:

  1. When a user switches from one input to another and input has been made. Can this even be registered by JQuery? But here's the question, what if he leaves the page without switching to another input.

  2. Save all data only then if he leaves the current page. I think there is this onunload function in JQuery.

  3. Get confirmation from the user: "This entry hasn't been made yet. Do you want to save this entry?". But when should I ask this? I can't predict when the user is finished with typing.

  • Can't you consider the user is done typing when the field loses focus? Of course, they can always come back to it if they made a mistake. Maybe you can consider creating a regular purge of "stale" entries too. – Chop May 29 '15 at 7:44
  • Be prepared to have pages for German Language, Gemran Language, Jerman Language, Germin Language, Germen Language, Gmeran Language, Germna Language, Jurman Language, Jirman Language, Germsan Language, Grman Language, Gernan Language... – Devsman Nov 4 '16 at 13:10
  • I decided to add a button a long time ago. Please look at the date I posted this question. But I see your point, thanks. – AlexioVay Nov 4 '16 at 14:03
4

Have a save button.

There are very good reasons why applications use explicit save/submit buttons:

  1. Gives the user a chance to change their mind about the edit. Unless you provide some sort of undo mechanism with auto-save, the user has no way to abort a modification.
  2. Protects against accidental modification. In the world of multi-monitor and multi-window setups it is common for a user to lose track of where the keyboard focus is and start typing the wrong window.
  3. Efficiency. If the user is going to make changes to 5 fields at once, it's better to perform one save operation rather than 5.
  • I just read your answer and implemented it this way already: While typing an autocomplete function comes up and suggests words to the user. He can choose one of them and this will also save it already. Or he types a whole new entry and has the possibility to save this entry as a new one which also will be saved then. So, do you suggest I should get a confirmation or send a notification also that this data will be saved immediately? – AlexioVay May 30 '15 at 23:17
  • 2
    4. User friendliness. "Now what? Where's the save button? Do I need to click off of this input for it to save? If I just close the tab, will that undo my changes?" – Devsman Nov 4 '16 at 13:06
3

Use a button

  • It is what users expect, don't discount the value of a familiar interface.
  • It gives the users the control they need, including the power to not publish something if they change their mind before finishing.
  • It gives users confidence that their submission has been properly saved. Not knowing for certain is agonising.

Autosave

Autosaving usually means to save a copy of the work without publishing it, overwriting the "real" save, or doing anything other than making the work recoverable in case the copy in memory is lost. Doing this in a website editor is quite common, and often a valuable feature. The easiest way of autosaving in a browser is to copy the input to localStorage, though this only allows recovery on the local computer and browser, so while saving the copy on the server may be a bit more elaborate, it could in some cases also lead to a better user experience.

  • I just read your answer and implemented it this way already: While typing an autocomplete function comes up and suggests words to the user. He can choose one of them and this will also save it already. Or he types a whole new entry and has the possibility to save this entry as a new one which also will be saved then. So, do you suggest I should get a confirmation or send a notification also that this data will be saved immediately? – AlexioVay May 30 '15 at 23:16
  • @Vaia You don't need a confirmation for saving a backup copy, you need a confirmation for publishing the entered text, that counts no matter what way the message was entered. – aaaaaaaaaaaa May 31 '15 at 7:06
0

I think that you should look for a combination of things here.

  • Look for loss of focus from an input item (blur)
  • Once the user has focus on an input item, listen in on the OnKeyPress event. Keep track of the last Key-Up and when that crosses a threshold (say 30 secs or whatever), save the input
0

Write your code on $("input").change event to immediately save the value when user enters it. Can be useful when there are few fields.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.