Handling form submission inside same hype function

Using JavaScript with Hype
1

Hi all,

It’s very hot in the UK and my brain has literally melted away. I can’t figure out how to handle form’s submission inside the same function, rather than having the callback function reside in the <head>.

Here is my desired loginForm() function:

function handleForm(theForm) {
	consol.log('User submitted: ' + theForm.password.value);
}

var htmlFormDiv = hypeDocument.getElementById('formDiv');

htmlFormDiv.innerHTML = '<form name="loginForm" action="javascript:;" onsubmit="return handleForm(this);"><input type="text" id="password" name="password" onfocus="this.value=null" value="Enter password..." required=""><input type="submit" name="Submit" value="Submit"></form>';

If I put the handleForm() function inside <head>, it works but I cannot call another function from there, without checking that Hype document has loaded. I’d rather just handle the callback inside my original function. Is this not possible?

I guess what I’m after is a way to somehow call loginForm.handleForm(this).

Thanks,
PJ

2

The handleForum is scoped within your current context (I assume something like a Hype On Scene Load handler?). When onsubmit is called, it is looking for it in global scope.

You can add the function to the global scope by assigning it to the window object:

window.handleForm = function (theForm) {
	console.log('User submitted: ' + theForm.password.value);
}

(note that your code also had a typo with consol.log instead of console.log)

3

Ah, excellent @jonathan, just what the doctor ordered. Thank you!