mirror of
https://0xacab.org/sutty/sutty
synced 2024-11-26 19:46:23 +00:00
feat: poder abrir el modal con un evento
This commit is contained in:
parent
4876c61d10
commit
71b87bfc0b
2 changed files with 21 additions and 1 deletions
|
@ -3,8 +3,27 @@ import { Controller } from "stimulus";
|
||||||
export default class extends Controller {
|
export default class extends Controller {
|
||||||
static targets = ["modal", "backdrop"];
|
static targets = ["modal", "backdrop"];
|
||||||
|
|
||||||
|
// TODO: Stimulus >1
|
||||||
|
connect() {
|
||||||
|
this.showEvent = this.show.bind(this);
|
||||||
|
|
||||||
|
window.addEventListener("modal:show", this.showEvent);
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: Stimulus >1
|
||||||
|
disconnect() {
|
||||||
|
window.removeEventListener("modal:show", this.showEvent);
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Podemos enviar la orden de apertura como un click o como un
|
||||||
|
* CustomEvent incluyendo el id del modal como detail.
|
||||||
|
*/
|
||||||
show(event = undefined) {
|
show(event = undefined) {
|
||||||
event?.preventDefault();
|
event?.preventDefault();
|
||||||
|
const modalId = event?.detail?.id;
|
||||||
|
|
||||||
|
if (modalId && this.element.id !== modalId) return;
|
||||||
|
|
||||||
this.modalTarget.style.display = "block";
|
this.modalTarget.style.display = "block";
|
||||||
this.backdropTarget.style.display = "block";
|
this.backdropTarget.style.display = "block";
|
||||||
|
|
|
@ -4,8 +4,9 @@
|
||||||
id = "#{base}_#{attribute}"
|
id = "#{base}_#{attribute}"
|
||||||
name = "#{base}[#{attribute}][]"
|
name = "#{base}[#{attribute}][]"
|
||||||
form_id = "form-#{Nanoid.generate}"
|
form_id = "form-#{Nanoid.generate}"
|
||||||
|
modal_id = "modal-#{Nanoid.generate}"
|
||||||
|
|
||||||
%div{ data: { controller: 'modal array', 'array-original-value': metadata.value.to_json, 'array-new-array-value': site_posts_new_related_post_path(site) } }
|
%div{ id: modal_id, data: { controller: 'modal array', 'array-original-value': metadata.value.to_json, 'array-new-array-value': site_posts_new_related_post_path(site) } }
|
||||||
.form-group
|
.form-group
|
||||||
= hidden_field_tag name, ''
|
= hidden_field_tag name, ''
|
||||||
= label_tag id, post_label_t(attribute, post: post)
|
= label_tag id, post_label_t(attribute, post: post)
|
||||||
|
|
Loading…
Reference in a new issue