Conceptual
Conceptual

Reputation: 57

jQuery how to properly use onChange

I am using Drupal 7 (quite new to both Drupal and Javascript / jQuery) and I got a class called "field-name-field-activity", now what I want is to put an onchange of every input in that class.

jQuery('.field-name-field-activity :input').onchange = function() {
    //enter code here
};

I am not sure if I'm using my onchange right here, I also saw some people using onChange instead of onchange, not sure what the difference is, but can anybody tell me how to use onchange the right way in my example?

Upvotes: 1

Views: 5759

Answers (5)

Adil Shaikh
Adil Shaikh

Reputation: 44740

Try this -

jQuery('.field-name-field-activity').on('change',function() {
    //enter code here
});

http://api.jquery.com/change/

Upvotes: 0

DonnyDee
DonnyDee

Reputation: 406

Concerning performance I would suggest not to use the ":input"-Selector.

Because :input is a jQuery extension and not part of the CSS specification, queries using >:input cannot take advantage of the performance boost provided by the native DOM >querySelectorAll() method.

Source: http://api.jquery.com/input-selector/

If the classname relates to input-Elements only anyway, just use the class-selector like Ankit Jaiswal suggested, because a single-class-selector performs best.

Source: Jquery element+class selector performance

Upvotes: 0

Ankit Jaiswal
Ankit Jaiswal

Reputation: 23427

With jquery just change will work:

$('.field-name-field-activity').change(function() {
  // your code here
});

Edit:

As the event is to be bind with text type, a better way is to use input event like:

$('.field-name-field-activity').on('input', function() {
    // your code here
});

The onchange event may not work correctly on some browsers in case of text fields.

Upvotes: 4

palaѕн
palaѕн

Reputation: 73896

Try like this:

jQuery('.field-name-field-activity input').change(function() {
    //enter code here
});

SIMPLE DEMO HERE

Upvotes: 1

Nomad101
Nomad101

Reputation: 1698

This is a simple error of syntax try this jQuery('.field-name-field-activity :input').change(function() { //enter code here });

here is a link to the api reference http://api.jquery.com/change/

Upvotes: 2

Related Questions