Skip to content

Latest commit

 

History

History

jquery_apply_functions_to_multiple_objects

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 

jQuery: Applying nuBuilder functions to multiple objects

How can we apply nuHide(), nuShow(), nuDisable(), nuEnable() etc. to multiple objects? These function take just one argument / object ID.

We can use jQuery.fn.extend to extend the jQuery prototype ($.fn) object to provide new custom methods that can be chained to the jQuery() function.

☛ Add this JavaScript to the Header (❓ Home ► Setup). Click Save and log in again.

jQuery.fn.extend({
  nuEnable: function() {
    return this.each(function() {
      nuEnable(this.id);
    });
  },
  nuDisable: function() {
    return this.each(function() {
      nuDisable(this.id);
    });
  },
  nuShow: function() {
    return this.each(function() {
        nuShow(this.id);
    });
  }, 
  nuHide: function() {
    return this.each(function() {
        nuHide(this.id);
    });
  }  
});

Usage

✪ Example 1: Disable all text fields

$('input[type="text"]').nuDisable();

✪ Example 2: Disable all fields that start with ID cus_billing

$('[id^=cus_billing]').nuDisable();

✪ Example 3: Hide all fields that end with the ID billing

$('[id$=billing]').nuHide();

✪ Example 4: Disable all form elements

$(":input") .nuDisable();  

✪ Example 5: Hide all and elements of type="button"

$(":button") .nuHide();  

✪ Example 6: Enable all
elements that contain the text 'teacher'

$("div:contains('teacher')").nuEnable();