Nov 29 2019 06:03 AM
I created a web part and generated a form using Javascript. My objective is to handle the submit event. In the generated form, I have a button :
<button id="btnOk" name="btnOk" class="btn btn-primary">Rechercher</button>
For this I added an eventListener :
window.addEventListener("submit", handleFormSubmit);
When I submit i shoud trig the function handleFormSubmit...
const handleFormSubmit = event => { const form = document.getElementById('requestForm'); event.preventDefault();
// converts to json const data = formToJSON(form.elements); if (listLoaded) { let btn = document.getElementById('btnOk'); btn.disabled = true; btn.innerText = handleMessages("ongoingStatus"); let msg = document.getElementById('showMessage'); msg.innerHTML = handleMessages("ongoing"); console.log("BREAK"); } buildQuery(data); };
I would like to understand why the click on the button it's not getting in this function. The same code displayed in a basic HTML page works perfectly. I replaced the event.preventDefault() with event.stopImmediatePropagation();
Nov 29 2019 07:33 AM
I had to put the
window.addEventListener("submit", handleFormSubmit);
In the method that build the form ...
I had a first eventListener to load the form generated with JS :
window.addEventListener("load", buildForm);
then in buildform() :
const buildForm = () => {
let requestForm = document.createElement('form');
requestForm.setAttribute("class", "form-horizontal");
requestForm.setAttribute("id", "requestForm");
let parentFormDiv = document.getElementById("displayForm");
parentFormDiv.appendChild(requestForm);
... building my stuff ...
/**
* Manage events on form submit : convert the form data in json and send to caml query
*/
formElt.addEventListener("submit", handleFormSubmit);
};