How do I use JavaScript's non-intrusive approach to call a function using an anchor tag?
There are several questions about this and I tried them. However, I am having a problem with the following anchor tag that acts like a button. Why isn't the link click event associated?
try 1:
<a href="#" class="btn" id="btnSubmit" data-type="submit">Submit</a>
try 2:
<a href="javascript:void(0)" class="btn" id="btnSubmit" data-type="submit">Submit</a>
js code:
<script>
$("#btnSubmit").click(function(){
dbdata = <%=jsscripts()%>;
addAll(0, this);
});
</script>
<script type="text/javascript" src="cart_Test.js"> </script>
Note:
Note that this particular js function works well when called under the DOM load event listener.
UPDATE:
dbdata
is an array and addall () is a function defined in cart_Test.js file. It seems after the script doesn't run after the function's click event.
<script type="text/javascript" src="cart_Test.js"> </script>
Js order:
<script>
document.addEventListener("DOMContentLoaded", theDomHasLoaded, false);
function theDomHasLoaded(e) {
//datepicker stuff
}
</script>
<script>
$("#btnSubmit").click(function(){
});
<script type="text/javascript" src="cart_Test.js"> </script>
source to share
Well, I'm adding an answer because that's how I solved it. This could be the order of execution.
A script snippet for the jQuery UI datepicker was found. Somehow it was blocking the above mentioned scripts, which should be the first scripts to be launched on this page.
After removing the datepicker script (it could be any other script, no datepicker needed.) And adjusting the execution order, the program flow returned to normal and all scripts fired as expected.
source to share