Here is the HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Javascript</title>
</head>
<body>
<form action="/check" id="demo" method="post" name="demo">
<input type="text" name="username" />username
<button type="button"
onclick="form.change_color.style.backgroundColor='#00FF00';">change
fieldset background</button>
<button type="button"
onclick="activateFieldset()">activate fieldset</button>
<input type="submit" value="submit" />
</form>
<fieldset form="demo" name="change_color">
<input type="password" name="password" />password
</fieldset>
<fieldset form="demo" disabled="disabled" name="license" id="license">
<input type="text" name="license_id" />license_id
</fieldset>
<script>
function activateFieldset(){
var e = document.getElementById("license");
e.disabled = "";
}
</script>
</body>
</html>
a
b
c
username
change_color
license_id
username
Unlike some commenters state, it is very possible to have reassociateable elements out of a form, trough the use of an explicit FORM
attribute, according to HTML5 RFC (though I agree that it is nicer to have them all grouped within the form).
And in your case, though you have specified well the form
attribute in the fieldset, it happens that the elements which must have the form
attribute are the INPUT ones.