Let's say I have a ColdFusion Model Glue view called login.cfm. In it, I have a form:
<form id="loginForm" action="#event.linkTo("user.login")#" method="POST">
E-mail: <input id="emailField" type="text" name="email">
Password: <input id="passwordField" type="text" name="password">
<input type="submit" value="Login">
</form>
Now I want to add in some Javascript validation for when the user clicks the Login button. Something like this in jQuery:
<script type="text/javascript">
$(function() {
$('#loginForm').submit(function() {
// check that emailField is not empty and is a valid e-mail
// check that passwordField is not empty
// if validation fails, add in DOM elements to show error messages
});
});
</script>
Where should I be adding this Javascript code? Do I stick it directly into the login.cfm view? Or is there a better way of handling this? Preferably, I'd like to stick my Javascript code from all my views to the bottom of the body.
There are a quite a few different strategies for this. The easiest is it put your view-specific script in a single .js file and include it through a
<script src="path"></script>tag just before closing the<body>tag.You can also look at libraries such as require.js that allow you to asynchronously load script files and their dependencies.