Am I doing Unobtrusive JavaScript correctly?

[Hussein Baghdadi]

Hi,
I use buttons to navigate in my application and jQuery as our JavaScript library.
<button type="button" id="zone-btn">Zone</button>
And here is demo.js
$("button#zone-btn").click(function() { document.location.href="/GrailsDemo/zone/index"; // Any better way to do this? });
So in my $(function() { // JS Code }); of the main layout template, how to call or refer to the code in demo.js?
Sorry, I'm really new to Unobtrusive JavaScript concept.

One a side note, how not to hard code the application context in JavaScript files?
Thanks for help and time.

[Bear Bibeault]

John Todd wrote:
So in my $(function() { // JS Code }); of the main layout template, how to call or refer to the code in demo.js?

All script included in the page is loaded into the same scope, so just reference anything that's loaded.

One a side note, how not to hard code the application context in JavaScript files?

In the parent JSP:

var contextPath = '${pageContext.request.ContextPath}';

[Hussein Baghdadi]

In my main.gsp template page, what should go under:
$(function() { // How to refer to the code in demo.js? });

You mentioned to use the following line in the parent JSP:

var contextPath = '${pageContext.request.ContextPath}';  

How to point to this value from a separate JavaScript file (demo.js in my case)?
Sorry if my questions sound -well not smart-.
Appreciate your time.

[Bear Bibeault]

John Todd wrote:In my main.gsp template page, what should go under:
$(function() { // How to refer to the code in demo.js? });

Whatever you want. The code in this block forms a jQuery ready handler and will be executed after the DOM has been built, but before the load event is triggered.

You mentioned to use the following line in the parent JSP:

var contextPath = '${pageContext.request.ContextPath}';  

How to point to this value from a separate JavaScript file (demo.js in my case)?

contextPath

You are making this much more complicated that it is.