DIV disabled or greyed out

I have a webpage with a form. Depending on user selections at the top of the page, the page will disable sections of the form. My plan is to put each section between a <div></div>. Each section contains some collection of form elements.

So if the user does not select some criteria, the related section of the form gets disabled. In a typical Windows type of application these elements get disabled and greyed out. What's the best way to do this in a webpage? Can Javascript determine what form elements are in a开发者_运维问答 div section and disable these elements through a loop for example? I know I can disable each element if I know its it but is there a way to find out all the IDs of elements for some div section?

Is it possible to gray out in page load event based on flag variable in c#?

Using jQuery you could do something like this:

$("div.myDiv :input").attr("disabled", "disabled");

The ":input" represents every input element. The "div.myDiv" represents a div having the classname "myDiv". It serves as the context in this case. So what essentially will happen is that all input elements within this particular div will become disabled.

The reverse:

$("div.myDiv :input").removeAttr("disabled");

Give your div element an id and then take all tags inside it and apply the disabled attribute to them.

var elem = document.getElementById ( "div1").getElementsByTagName ( "*");
for ( var i=0; i < elem.length; i ++ )
{
    elem[i].disabled = true;
}

To enable the controls set the disabled attribute to false.

Use Jquery to filter out all the input elements inside your DIV and then apply the 'disabled' attribute.

    $(document).ready(function(){
        $("#myDiv > *:input").attr("disabled","disabled");
    });

The above code snippet first selects your DIV #myDiv and then selects all the child elements of this DIV and filters all input elements and finally applies the 'disabled' property to them.

Most of the <input> have a disabled property that can be said to true via javascript. As you mentioned you can grab the div's children and if type is off the form elements you want disabled, just set disabled = true.