[Solved]Adding JavaScript events to HelperForm

[AppleEater]

Hi,

How do I add javascript event calls to the input fields in Helper form?

 

I've tried adding 

'onchange' => 'function()',

but this doesn't seem to render.

Is there another way to check events on input fields ? for instance, I'd like to check the checked value of a switch fields, and perform some CSS changes based on this value.

 

 

Edited April 2, 2014 by AppleEater (see edit history)

[Enrique Gómez]

In fact it's recommended you plug all javascript after DOM load

 

If you add the ids and or classes you can target those inputs easily with jquery

 

So for example

$(document).ready(function()
{
	
..........................

	//hover 'other views' images management
	$('#views_block li a').hover(
		function(){displayImage($(this));},
		function(){}
	);

.....................
	//add a link on the span 'view full size' and on the big image
	$('#view_full_size, #image-block img').click(function(){
		$('#views_block .shown').click();
	});

.........................................

Edited March 30, 2014 by Enrique Gómez (see edit history)

[AppleEater]

Apparently when adding a JS script to a module  in hook 'hookDisplayBackOfficeHeader', it's being loaded before the jQuery functions, so one can't use the jQuery model.

The code I found to work is:

document.addEventListener('DOMContentLoaded', function() {
  // function code
// sample code to add listener
var test_on = document.getElementById('test_mode_on');
	test_on.addEventListener('click',function() {
          // function code for this listener
		},false);
}, false);