Question

I created a somefile.js where somefile.js contains some jQuery method. So for instance it contains this function:

function showWindow(divID)
{
    var dialogDiv = $(divID);

    dialogDiv.dialog
    (
        {
            bgiframe: true,
            modal: true,
            autoOpen: false,
            show: 'blind'
        }
    )

    dialogDiv.dialog("open");
}

So in my .aspx page (or whatever, it could be an .html), I have a button:

<input type="button" onclick="showPopUp('testDiv')" value="Click Me!" />

My question is, we’re going to use showPopUp all over in our app. If it’s called from an onClick event, then where do I put my $(document).ready(function() since this code is not in the page, but in a .js file?

Answer 1

You can put it in the Javascript file if you want. If you’re attaching listeners with the onclick attribute like that, you don’t actually need to use $(document).ready().

However, it’s generally considered better form to not use the onclick attribute, and attach the listener in Javascript, like so:

<input type = "button" class = "showPopup" id = "testDiv" value = "Click Me!" />

$(document).ready(function(){
  $("input.showPopup").click(function(){
    showWindow($(this).id);
  }

  function showWindow(id){...}
}

You can put that javascript in the head of the document like ~ricebowl said.