addevent on form field

[thejackel]

Hi,

I'm trying to use the addevent() method to add an event to a form field.

I.E.
This is the form field I want to apply my event to:

<input type="text" name="site_search" id="site_search" value="">

This is the javascript what applies the event:

container = document.getElementById('site_search');
addEvent(container,'click',applyCapsLockEvent(),false);

This is just a couple of lines of my code, I've simplified it slightly to get to the point. It kicks out an error on this line:

elm.addEventListener(evType, fn, useCapture);

of the addevent() function.

Any ideas of how to solve this please?

Ta very much

[r51]

You've used applyCapsLockEvent() in the addEvent function.
Should that be applyCapsLockEvent without the brackets?

[oddz]

^ yep

with the brackets you call the function/handler when attaching the listener. In this case the handler/function is getting called when the page loads and the listener is added.

[thejackel]

Thank you both for your replies,

I should have posted my original code instead of simplifying - I'm using an object. Heres how it looks:

// Create an object
capslock = {
 
	// Set variable ('site_search' is text input field on form)
	textinputID:'site_search',
 
  	init:function()
  	{
		container = document.getElementById(capslock.textinputID);
		// Add the onclick event behaviour to the field (applyCapsLockEvent function)
		capslock.addEvent(container,'click',container.applyCapsLockEvent,false);
  	},
 
  	// Run something
  	applyCapsLockEvent:function()
	{
		alert ('test');
    },
 
    addEvent: function(elm, evType, fn, useCapture)
	{
		if (elm.addEventListener) 
		{
			elm.addEventListener(evType, fn, useCapture);
			return true;
		} else if (elm.attachEvent) {
			var r = elm.attachEvent('on' + evType, fn);
			return r;
		} else {
			elm['on' + evType] = fn;
		}
	}
}
// capslock object is used on the search box to highlight it when the caps lock is pressed
capslock.addEvent(window, 'load', capslock.init, false);

addevent initialises the capslock object - which assigns an event to the input with an id of 'site_search'.

I can assign events to href links but the code does not let me assign the event (applyCapsLockEvent) to a form field. Strange.

Any ideas?

Thanks

[r51]

Is it possible that your browser doesn't recognise click events on certain form fields? Try focus, change or mousedown events and see what happens.

[thejackel]

Thanks r51,

I've chcked this but no joy. In firebug the error displayed is:

Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame ::......

Not sure what that means. It's like it can't recognise the 'container' of this line:

capslock.addEvent(container,'click', container.applyCapsLockEvent,false);

Can you even use addevent() on a form field.

I'm on a mac using Firefox but have tested in Safari also and always the same message.

Cheers

[r51]

capslock.addEvent(container,'click',container.applyCapsLockEvent,false);

Should the third argument be capslock.applyCapsLockEvent?

[thejackel]

What a numpty!!

I can't believe I didn't see that - I shall consider a career change.

Many thanks r51, you have saved me much time