mirror of
https://github.com/dzeiocom/FormManager.git
synced 2025-06-07 16:49:56 +00:00
added new Event for form handling
This commit is contained in:
parent
228a565b8c
commit
267aba9c8f
@ -20,6 +20,7 @@ export default class AttributesManager {
|
|||||||
for (const attr of attribute) {
|
for (const attr of attribute) {
|
||||||
this.attributesArray.push(attr.identity)
|
this.attributesArray.push(attr.identity)
|
||||||
}
|
}
|
||||||
|
return this
|
||||||
}
|
}
|
||||||
|
|
||||||
public trigger(event: AttributeListeners, data?: any): boolean {
|
public trigger(event: AttributeListeners, data?: any): boolean {
|
||||||
|
@ -70,9 +70,17 @@ export default class FormManager {
|
|||||||
this.attributeManager = new AttributesManager(this)
|
this.attributeManager = new AttributesManager(this)
|
||||||
|
|
||||||
//Prevent default submit action
|
//Prevent default submit action
|
||||||
form.addEventListener("submit", (e: Event) => {
|
form.addEventListener("submit", (e: Event & {submitter?: HTMLInputElement & {formmethod?: string, action?: string}}) => {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
onSubmit && onSubmit(this)
|
form.dispatchEvent(new Event('submitStart'))
|
||||||
|
if (onSubmit) {
|
||||||
|
return onSubmit(this)
|
||||||
|
}
|
||||||
|
const submitUrl: string = e.submitter && e.submitter.action || form.action || window.location.toString()
|
||||||
|
const method: string = e.submitter && e.submitter.formmethod || form.getAttribute('method') || 'POST'
|
||||||
|
this.send(submitUrl, undefined, {
|
||||||
|
method: method
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
//assign default form interface
|
//assign default form interface
|
||||||
@ -93,6 +101,7 @@ export default class FormManager {
|
|||||||
for (const input of inter) {
|
for (const input of inter) {
|
||||||
this.FMInputs.unshift(input.identity)
|
this.FMInputs.unshift(input.identity)
|
||||||
}
|
}
|
||||||
|
return this
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -113,6 +122,7 @@ export default class FormManager {
|
|||||||
if (el) this.inputs[el.getName()] = el
|
if (el) this.inputs[el.getName()] = el
|
||||||
});
|
});
|
||||||
this.attributeManager.trigger(AttributeListeners.FORM_INIT)
|
this.attributeManager.trigger(AttributeListeners.FORM_INIT)
|
||||||
|
return this
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -198,7 +208,10 @@ export default class FormManager {
|
|||||||
let datas = this.getJSON()
|
let datas = this.getJSON()
|
||||||
|
|
||||||
// Verify datas
|
// Verify datas
|
||||||
if ((options.verify === undefined || (typeof options.verify === "boolean" && options.verify)) && !this.verify()) return false
|
if ((options.verify === undefined || (typeof options.verify === "boolean" && options.verify)) && !this.verify()) {
|
||||||
|
this.form.dispatchEvent(new Event('submitError'))
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
// Trigger Event
|
// Trigger Event
|
||||||
const ev = this.attributeManager.trigger(AttributeListeners.FORM_SUBMIT, datas)
|
const ev = this.attributeManager.trigger(AttributeListeners.FORM_SUBMIT, datas)
|
||||||
@ -208,7 +221,10 @@ export default class FormManager {
|
|||||||
const ajax = new XMLHttpRequest
|
const ajax = new XMLHttpRequest
|
||||||
ajax.open(options.method || "POST", url)
|
ajax.open(options.method || "POST", url)
|
||||||
ajax.setRequestHeader("Content-Type", "application/json")
|
ajax.setRequestHeader("Content-Type", "application/json")
|
||||||
ajax.addEventListener("loadend", callback || (() => {}))
|
callback && ajax.addEventListener("loadend", callback)
|
||||||
|
ajax.addEventListener('loadend', (ev) => {
|
||||||
|
this.form.dispatchEvent(new CustomEvent('submitEnd', {detail: ajax}))
|
||||||
|
})
|
||||||
ajax.send(JSON.stringify(datas))
|
ajax.send(JSON.stringify(datas))
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
@ -226,7 +242,28 @@ export default class FormManager {
|
|||||||
}
|
}
|
||||||
const input = this.inputs[name]
|
const input = this.inputs[name]
|
||||||
input.setValue(value)
|
input.setValue(value)
|
||||||
|
return this
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public setJSON(data: {[key:string]: any}) {
|
||||||
|
for (const key in data) {
|
||||||
|
if (!data.hasOwnProperty(key)) {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
const value = data[key]
|
||||||
|
this.setValue(key, value)
|
||||||
|
}
|
||||||
|
return this
|
||||||
|
}
|
||||||
|
|
||||||
|
public getValue(name: string): any {
|
||||||
|
if (!this.inputs.hasOwnProperty(name)) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
return this.inputs[name].getValue()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Return the JSON `{key: value}` sequence
|
* Return the JSON `{key: value}` sequence
|
||||||
*
|
*
|
||||||
|
Loading…
x
Reference in New Issue
Block a user