Observe field with jquery in Rails 3.1

Rails
1

I tries to observe a change in a field with jquery in Rails 3.1 in
order to be able to implement two cascading select boxes.
A a first step I just try to observe a click in a div using jquery
I have the following function in a .js file that is loadedin the head
section (fieldset is the id of a div) and is displaying a view with
the div fieldset

$(document).ready(function() {
$(’#fieldset’).bind({
click: function() {
alert(‘Change’);
// do something on click
},
mouseenter: function() {
// do something on mouseenter
};
});
});
But nothing happens when I click in the field
I suspect that I am using jquery in the wrong way
I would appriciate any advice !
Hans

2

Hi Hans,

On Wed, Jan 11, 2012 at 10:35 AM, Hans [email protected]
wrote:

alert(‘Change’);
// do something on click
},
mouseenter: function() {
// do something on mouseenter
};
});
});
But nothing happens when I click in the field
I suspect that I am using jquery in the wrong way

Try giving it an id of a different name. My guess is that jquery is
‘confused’ by your use of ‘fieldset’ as an id because it is also a tag
name.

HTH,
Bill

3

Hans M. wrote in post #1040373:

$(document).ready(function() {
$(’#fieldset’).bind({
click: function() {
alert(‘Change’);
// do something on click
},
mouseenter: function() {
// do something on mouseenter
};
});
});
But nothing happens when I click in the field
I suspect that I am using jquery in the wrong way
I would appriciate any advice !
Hans

I’d first try a simpler case just to make sure everything is “wired up”
correctly:

$(function() {
$(’#fieldset’).click(function() { alert(“Clicked”); });
});

If this works then you know you’re finding the right HTML element and
correctly binding a “click.” Once you’ve confirmed this then try the
more complex bind syntax.

P.S. I used the shorthand for waiting for the DOM ready event for
simplification & demonstration.

4

Thanks for your advices

Your advices convinced me that the error was some minor typo or some
other detail
That was also true
The problem is
{ alert(“Clicked”); })
when I changed that to
alert(“Clicked”);
and put everything with a ready function it worked
I am now trying more complex change functions that also seems to work

I have tried on and off and might use them

5

Robert W. wrote in post #1040404:

$(function() {
$(‘#fieldset’).click(function() { alert(“Clicked”); });
});

If this works then you know you’re finding the right HTML element and
correctly binding a “click.” Once you’ve confirmed this then try the
more complex bind syntax.

If you’re using jQuery 1.7+ you might also want to consider using the
new .on()/.off() methods for binding events.

http://api.jquery.com/on/