Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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

This comment has been minimized.

Copy link

chrismitchell commented Apr 27, 2018

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
You can’t perform that action at this time.