how can control sendForm with javaScript (allow or denied)

Question

how can i,m control send form with javaScript pay attention: i,m not want send form or stop for send form but i,m want controll allow or notAllow for sendForm

let idForm='formPasswordForget';
let form=document.getElementById(idForm);

stopSendForm(form){
    console.log('run stopSendForm')
    form.addEventListener("click",event=>{
        event.preventDefault();
    });
}

allowSendForm(form)
{
    console.log('run allowSendForm')
    // ?? how we delete listener click on function stopSedForm ???
    // ?? and how delete event.preventDefault() ???
    /*this.form.addEventListener("click",event=>{
        return true;
    });*/
}

Answer 1

You can't exactly delete an event listener that way. What you have to do is wrap your executable function code in an actual function with a name, and then assign it through a reference to addEventListener . This will allow you to use removeEventListener , where you pass in the same conditions as addEventListener on the same element.

 let idForm = 'formPasswordForget'; let form = document.getElementById(idForm); function stopSubmit(evt) { event.preventDefault(); } function stopSendForm(form) { console.log('run stopSendForm'); form.addEventListener("submit", stopSubmit); } function allowSendForm(form) { console.log('run allowSendForm'); form.removeEventListener("submit", stopSubmit); } function switchState(evt) { if (event.target.checked) { stopSendForm(form); } else { allowSendForm(form); } }

 <form id="formPasswordForget"> <input type="email" value="example@gmail.com"><br> <input type="checkbox" id="stopSend" onchange="switchState()"><label for="stopSend">Stop the form from sending?</label><br> <input type="submit"> </form>

Answer 2

that?

 const myForm = document.getElementById('my-form'), formDenied = document.getElementById('form-denied'); myForm.addEventListener('submit',evt=> { if (formDenied.checked) { evt.preventDefault() return } //... possible other code before submit })

 <label><input type="checkbox" id="form-denied"> form denied </label> <form action="" id="my-form"> <input type="text"> <button type="submit">submit</button> </form>