Sha256: ad25605cd8f472938068603fbbc647dc86324c727cfe407050958da4c5f113d1
Contents?: true
Size: 1.7 KB
Versions: 43
Compression:
Stored size: 1.7 KB
Contents
import { Controller } from "@hotwired/stimulus"
// Connects to data-controller="nested-resource-form-fields"
// Copied from https://github.com/stimulus-components/stimulus-rails-nested-form/blob/master/src/index.ts
export default class extends Controller {
static targets = ["target", "template", "addButton"]
static values = {
wrapperSelector: {
type: String,
default: ".nested-resource-form-fields",
},
limit: Number,
}
connect() {
this.updateState()
}
add(e) {
e.preventDefault()
const content = this.templateTarget.innerHTML.replace(/NEW_RECORD/g, new Date().getTime().toString())
this.targetTarget.insertAdjacentHTML("beforebegin", content)
const event = new CustomEvent("nested-resource-form-fields:add", { bubbles: true })
this.element.dispatchEvent(event)
this.updateState()
}
remove(e) {
e.preventDefault()
const wrapper = e.target.closest(this.wrapperSelectorValue)
if (wrapper.dataset.newRecord !== undefined) {
wrapper.remove()
} else {
wrapper.style.display = "none"
wrapper.classList.remove(...wrapper.classList)
const input = wrapper.querySelector("input[name*='_destroy']")
input.value = "1"
}
const event = new CustomEvent("nested-resource-form-fields:remove", { bubbles: true })
this.element.dispatchEvent(event)
this.updateState()
}
updateState() {
if (!this.hasAddButtonTarget || this.limitValue == 0) return
if (this.childCount >= this.limitValue)
this.addButtonTarget.style.display = "none"
else
this.addButtonTarget.style.display = "initial"
}
get childCount() {
return this.element.querySelectorAll(this.wrapperSelectorValue).length
}
}
Version data entries
43 entries across 43 versions & 1 rubygems