Skip to content

Instantly share code, notes, and snippets.

@kylefox
Created April 26, 2018 22:51
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save kylefox/fdae80f6199499428a4740f241eb6783 to your computer and use it in GitHub Desktop.
import { Controller } from "stimulus"
class PageSectionFormController extends Controller {
initialize() {
this.sectionID = parseInt(this.element.getAttribute("data-page-section-id"))
this.preview = this.application.getControllerForElementAndIdentifier(
document.querySelector(`[data-controller="rich-text-preview"][data-page-section-id="${this.sectionID}"]`),
'rich-text-preview',
);
}
updatePreview() {
this.preview.update(this.getData());
}
saveChanges() {
console.log('\nsaveChanges:')
console.log(`=> data: ${JSON.stringify(this.getData())}`);
}
onChange() {
this.updatePreview();
this.saveChanges()
}
getData() {
return {
id: this.sectionID,
content: this.getContent()
};
}
}
export default PageSectionFormController;
import PageSectionFormController from "./page_section_form_controller"
export default class extends PageSectionFormController {
static targets = [ 'heading', 'text' ]
getContent() {
return {
heading: this.headingTarget.value,
text: this.textTarget.value,
};
}
}
import { Controller } from "stimulus"
export default class extends Controller {
static targets = [ 'heading', 'text' ]
update(data) {
this.headingTarget.innerHTML = data.content.heading;
this.textTarget.innerHTML = data.content.text;
}
}
@chrismitchell
Copy link

I love how there is no jQuery in this code 👍

Looks fun to work with

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment