Javascript - Waiting For Event Before Proceeding

I'm trying to create ONE javascript function that can do the following: onclick, a form popup in a floating div (this part is okay) the script then some how wait for data to be en

Solution 1:

jQuery modal dialog boxes. See examples in SimpleModal.

Solution 2:

Any reason for the emphasis of ONE Javascript function?

functionshowModal() {
    var div = document.createElement('div');
    div.id = 'myprompt';
    div.innerHTML = '<form id="test" onsubmit="return handleModal();"><input type="text" name="first"></form>';
    document.body.appendChild(div);
}

functionhandleModal() {
    alert('Hello, ' + document.getElementById('test').first.value);
    returnfalse;
}

showModal();

Check this out in action. Just type something and press enter. Styling would be done via CSS.

A big part of Javascript is events: do this when this happens. You shouldn't try to fight it.

As you can see, this gets hairy fast. You should look into the many, many, libraries and plugins that handle this very nicely. I personally recommend jQuery and Thickbox, jModal or Impromptu.