My script does not use jQuery and has an addEventListener on a button click. The issue is that after the first run, I want to change the value of "sendingurl" to something else. However, even though sendingurl is updated with the new id value, it doesn't change after the event is fired again. Instead, upon the second click, both the old and new events are triggered.
Console.log outputs:
- 1st click: event "click" is fired with url: input.php
- 2nd click:
- event "click" is fired with url: input.php
- event "click" is fired with url: update.php?io=items&id=693
I want to prevent the input from being triggered after the first click. Any solutions?
var itemid = getHash();
ini(prepare); // using window.onload to execute
function prepare() {
if (itemid) {
// update
var sendingurl = 'update.php?io=items&id=' + itemid;
} else {
// input
var sendingurl = 'input.php';
}
// submitevent
æ($("submitBtn"), 'click', function() {
console.log("event \"click\" is fired with url: " + sendingurl);
var json = new FormData(document.forms[0]);
ajax(sendingurl, json, submittedInput);
});
}
// callback function after ajax did his magic
function submittedInput(response) {
if (response) {
if (!itemid) {
itemid = response;
prepare();
}
} else {
$("status").innerHTML = "something went wrong with the input";
}
}
// function to add events without the use of jquery or prototype
function æ(el, evType, fn, useCapture) {
if (el.addEventListener) {
el.removeEventListener(evType, fn, useCapture);
el.addEventListener(evType, fn, useCapture);
return true;
} else if (el.attachEvent) {
el.detachEvent('on' + evType, fn);
var r = el.attachEvent('on' + evType, fn);
return r;
} else {
el['on' + evType] = fn;
}
}