toggle form input states in javascript

Question

I know how to toggle (active/disabled or visible/hidden) html form input fields with JavaScript.

But if there are several input fields, I guess it is better to use a declarative solution. I mean a solution without coding methods which use long "if ... else ..." statements.

Simple example:

The customer can enter if he likes long distance running. If he enables this, an other input gets visible: "What is your preferred running distance?"

I can code (and have done many times) "if ... show ....", but I am not a JS expert.

How could this be done declarative in JS?

http://en.wikipedia.org/wiki/Declarative_programming:

In computer science, declarative programming is a programming paradigm, a style of building the structure and elements of computer programs, that expresses the logic of a computation without describing its control flow.

Community · Accepted Answer · 2017-05-23 12:05:09Z

1

I use this extension function (from this answer):

(function($) {
    $.fn.toggleDisabled = function(){
        return this.each(function(){
            this.disabled = !this.disabled;
        });
    };
})(jQuery);

You can do something like this:

$(".long-distance-running-checkbox").change(function(){
  $(".long-distance-running-related").toggleDisabled();
}

edited May 23, 2017 at 12:05

CommunityBot

11 silver badge

answered Apr 25, 2014 at 11:10

Max Al Farakh

4,4964 gold badges31 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

toggle form input states in javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related