Question

$(':input[type=text], textarea').change(function(){
     if(($(":input[type=text]").val()!="") && $("textarea").val()!=""){
      $(":submit").removeAttr("disabled");
      $(":submit").removeClass("disabled");
      $(":submit").addClass("success");
     }
});

This function is triggered when I have entered text into 1 out of the total 2 textarea elements in my form.

But I want this function to be triggered once all of the textboxes and text area are not null.

Answer 1

You’d be best off adding a class to your elements to identify them. Plus it would make the code more semantic:

<input type="text" name="Texbox1" class="elementGroup" />
<textarea name="Textarea1" class="elementGroup"></textarea>
<textarea name="Textarea2" class="elementGroup"></textarea>

Then in your code you can attach your event, and check to see if all three elements have a value set:

$('.elementGroup').change(function() {
    var valid = true;
    $('.elementGroup').each(function() {
        if ($(this).val() == "")
            valid = false;
    });

    if (valid)
        $(":submit").removeAttr("disabled").toggleClass("disabled success");
});

Example fiddle