etch icon indicating copy to clipboard operation
etch copied to clipboard

Pass editable content or target on save

Open eknowlton opened this issue 10 years ago • 4 comments

I really love the idea of etch, and it seems pretty graceful so far. Thanks for putting it together!

This isn't really an issue, I was just wondering and wasn't sure where to ask.

I don't know if I fully understand the concept, maybe I don't know enough about 'EditableContent', but am I supposed to save the parent of the .editable or can we save the content of .editable?

Is there anyway we can get the element that was .editable with the on 'save' event?

eknowlton avatar Jul 26 '15 18:07 eknowlton

save: function(e) { e.preventDefault(); var editableModel = this.model.get('editableModel'); editableModel.trigger('save', this.model.attributes.editable.first()); }

Maybe something like this?

eknowlton avatar Jul 26 '15 19:07 eknowlton

Hey Ethan,

Etch is pretty agnostic on the saving front. It is your responsibility to decide how you want it to save. All etch does is trigger a save event on the model. Typically your view would listen for the save event and then grab the html content of your editable element and save it to a database via xhr.

Something like

save: function () { var htmlToSave = $(this.el).find('.editable').html();

// then save via ajax or whatever your transport is $.ajax(...) }

Hope that helps.

On Mon, Jul 27, 2015 at 7:01 AM, Ethan Knowlton [email protected] wrote:

save: function(e) { e.preventDefault(); var editableModel = this.model.get('editableModel'); editableModel.trigger('save', this.model.attributes.editable.first()); }

Maybe something like this?

— Reply to this email directly or view it on GitHub https://github.com/joshontheweb/etch/issues/39#issuecomment-125027984.

Thanks, Josh Nielsen @joshontheweb http://twitter.com/joshontheweb joshontheweb.com

joshontheweb avatar Jul 28 '15 01:07 joshontheweb

Ya, but I was really hoping to have a way to get the element that was just saved from etch. In order to have multiple editable fields and only have to save or update one attribute versus saving all of the .editable fields, and allowing me to add data attributes on the .editable that would tell me where the field should be saved to in the model.

eknowlton avatar Jul 29 '15 00:07 eknowlton

Lets say you have an article like in the demo on etchjs.com. When save is clicked you could do something in the view like:

save: function() {
  var title = this.$('.title').html();
  var body = this.$('.body').html();

  // set the values on the article model
  // on the model you can listen for change events on these values
  // if they changed, save them, if not, do nothing
  this.model.set({title: title, body: body});
}

joshontheweb avatar Jul 29 '15 02:07 joshontheweb