NicolasCARPi / jquery_jeditable

jQuery edit in place plugin. Extendable via plugin architecture. Plugins for plugin. Really.
https://jeditable.elabftw.net
MIT License
1.74k stars 458 forks source link

Submitting Textarea without using Buttons = Can't Save #215

Closed JamoCA closed 4 years ago

JamoCA commented 4 years ago

Just curious if it's possible to submit textarea fields without having to use buttons. When using a regular input field, pressing ENTER saves the data. In a textarea field, a carriage return is performed and I couldn't determine how to submit the data. I thought I could use SHIFT+ENTER, but it didn't do anything. Editable textarea fields that don't have a dedicated submit button result in data that can't be saved.

I'd like to use textarea fields without buttons as it looks aesthetically nicer. I was considering using a tooltip library (ie, tippy.js) to display instructions during the editing process. (NOTE: I don't think mobile users would be able to use SHIFT+ENTER, but that isn't my target user. For those users, submit/cancel buttons should probably always be displayed with textarea fields.)

NicolasCARPi commented 4 years ago

Yes I guess using a textarea does require the use of buttons. Maybe having on onChange listener that can grab the Shift+Enter and submit the form would work.

JamoCA commented 4 years ago

You may want to make this an option that can be defined by the developer and/or possible always have it so that SHIFT+ENTER works. (I use some tagging libraries and the delimiter can often be defined so that pressing the designated key(s) automatically tokenizes the current string and move to the next entry.)

NOTE: Similar behavior can be found in Excel & Google Sheets, but it's backwards. When editing a cell, if you press ALT+ENTER, it will add a carriage return, but pressing ENTER will cause the cell to lose focus and advance to the next cell (like using the TAB key). In textarea fields, a carriage return is the default action whenever pressing the ENTER key.

NicolasCARPi commented 4 years ago

The thing is that I started maintaining this library because the original author didn't have much time to dedicate to it. I'm using it in my software and didn't want to have a dead dependency.

I'll review PRs and make sure the library has no obvious bugs or vulnerabilities, but to be honest, I don't think I'll add new functionality such as this.

I'm closing this issue but feel free to work on it if you need this functionality.

JamoCA commented 4 years ago

I've added the functionality to the "source" version and performed a pull request to the experimental branch. Please review and let me know what you think. I don't believe that shift+enter will negatively impact any of the other plugins. If so, it could probably be modified to target solely textarea fields.

/* discard changes if pressing esc */
$(this).on('keydown', function(e) {
    if (e.which === 27) {
      e.preventDefault();
      reset.apply(form, [settings, self]);
    /* allow shift+enter to submit form (required for textarea) */
    } else if (e.which == 13 && e.shiftKey){
      e.preventDefault();
      form.trigger('submit');
    }
});