|
|
okay, so I'm killing myself over this form. Basically, I want a form with two input elements always active, and then five others that are default inactive, but when you select a checkbox next to it, they are enabled. This is for a poll feature I'm writing for my website. (inb4 "download a premade one"; I like to do things myself). So, I'll share my current code, as well as a few of the many other solutions I've tried. I've been at this all night, and I just can't get it to work. I'm hoping some or one of you will have a recommendation I haven't seen or tried yet. Take a look at the page for this code @ www.exvulpes.com/test.htmand... the source: <html>
<body>
<script type="javascript">
function changeState(obj) {
var act = document.getElementById(obj).disabled ? false : true;
document.getElementById(obj).disabled = act;
}
</script>
<form name="forma" id="forma" action="" method="post">
1:
<input type="checkbox" checked="checked" disabled="true" name="toggle_1" value="1" />
<input type="text" name="1" id="1" value="first" size="20" />
<br />
2:
<input type="checkbox" checked="checked" disabled="true" name="toggle_2" value="2">
<input type="text" name="2" id="2" value="second" size="20" />
<br />
3:
<input type="checkbox" name="toggle_3" value="3" onclick="changeState(third);" />
<input type="text" name="third" id="3" disabled="true" value="third" size="20" />
<br />
4:
<input type="checkbox" name="toggle_4" value="4" onclick="changeState(fourth);" />
<input type="text" name="fourth" id="4" disabled="true" value="fourth" size="20" />
<br />
5:
<input type="checkbox" name="toggle_5" value="5" onclick="changeState(fifth);" />
<input type="text" name="fifth" id="5" disabled="true" value="fifth" size="20" />
<br />
6:
<input type="checkbox" name="toggle_6" value="6" onclick="changeState(sixth);" />
<input type="text" name="sixth" id="6" disabled="true" value="sixth" size="20" />
<br />
7:
<input type="checkbox" name="toggle_7" value="7" onclick="changeState(seventh);" />
<input type="text" name="seventh" id="7" disabled="true" value="seventh" size="20" />
<br />
<input type="submit" value="Submit">
</form>
</body>
</html>
For the Javascript, I've also tried <script type="javascript">
function activate(num) {
var field = document.getElementById(num);
if (field.disabled == "true") {
field.disabled = "false";
}
if (field.disabled == "false") {
field.disabled = "true";
}
}
</script>(with the proper function name adjustments in the rest of the file, of course) as well as
function ChangeState(obj)
{
document.getElementById('box').disabled = obj.checked;
}and <script type="text/javascript">
function changeState(obj){
if (document.all || document.getElementByid){
document.forma.obj.disabled=!document.forma.obj.disabled;
}
}
</script>and also...
<script type="text/javascript">
function changeState(obj){
if (document.all || document.getElementById){
if (document.forma.obj.disabled==true){
document.forma.obj.disabled=false;
}else{
document.forma.obj.disabled=true;
}
}
}
</script>Currently, I get an object required error pointing to this line: var act = document.getElementById(obj).disabled ? false : true;but I can't see anything missing or wrong? Before, I would get object required errors on each checkbox where my functions were set in the onclick. Also, no browser issues. Tested and failed in the newest versions of Chrome, Firefox, and IE. I don't usually ask, but I really need help on this one.
|
|
|
|
|
|
document.getElementbyId('forma').obj.disabled=!me.checked;
Needs a capital B in "By".
|
#intj (Mastermind)^
|
|
|
