Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Jan 2006
    Posts
    251
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Trouble with event handling

    Need to have a disabled submit button automatically become active if a certain value is passed from a DB.

    Trying to utilize the JS "onload" event command to call a function. The function should activate the submit button, "EditRecord", even if one checkbox is checked.

    Anyone see what I'm missing, aside from tylenol.

    Code:
    <script src="javascript.js"></script>
    <form name="form2">
    <TABLE>
    <TR><TD>Record number 7</TD>
    <TD>Reviewed<br><input disabled type='checkbox' name='Reviewed' checked></TD>
    <TD>Accepted<br><input disabled type='checkbox' name='AcceptDenyChrYES' checked></TD>
    <TD>Denied<br><input onload='EditON()' id='NO' disabled type='checkbox' name='AcceptDenyChrNO' value='YES'></TD>
    <TD>Department Chair<br>
    <textarea>Accepted</textarea>
    </TD></TR>
    
    <TR><TD width='230'></TD>
    <TD>Reviewed<br><input disabled type='checkbox' name='Reviewed' checked></TD>
    <TD>Accepted<br><input disabled type='checkbox' name='AcceptDenyRegYES' checked></TD>
    <TD>Denied<br><input onload='EditON()' id='NO' disabled type='checkbox' name='AcceptDenyRegNO' value='YES'></TD>
    <TD>Department Chair<br>
    <textarea>Accepted</textarea>
    </TD></TR>
    
    <TR><TD width='230'></TD>
    <TD>Reviewed<br><input disabled type='checkbox' name='Reviewed' checked></TD>
    <TD>Accepted<br><input disabled type='checkbox' name='AcceptDenyCCYES' checked></TD>
    <TD>Denied<br><input onload='EditON()' id='NO' disabled type='checkbox' name='AcceptDenyCCNO' value='YES'></TD>
    <TD>Department Chair<br>
    <textarea>Accepted</textarea>
    </TD></TR>
    
    <TFOOT><TR>
    <TD><a href='http://localhost/addedit.php?Records=101'>
    <input disabled type='submit' name='EditRecord' id='EditRecord' value='Edit Record' title='Edit record'></a></TD>
    </TR></TFOOT>
    </form>
    JavaScript inc file
    Code:
    function EditON(){
    	if ((name='AcceptDenyChrNO') == 'checked')
    document.form2.EditRecord.disabled=false;
    	else if ((name='AcceptDenyRegNO') == 'checked')
    document.form2.EditRecord.disabled=false;
    	else if ((name='AcceptDenyCCNO') == 'checked')
    document.form2.EditRecord.disabled=false;}

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    Seems ok, unless there is a syntax error in there somewhere-- are you getting any javascript errors?

    Also you didn't include your <body> tag so I can't tell if your onload= statement is correct.

  • #3
    Senior Coder
    Join Date
    Jul 2005
    Location
    New York, NY
    Posts
    1,084
    Thanks
    4
    Thanked 19 Times in 19 Posts
    (name='AcceptDenyChrNO')

    I think this is the probelm. It seems that you copied and pasted this from your html, I think you mean:

    if (document.form2.AcceptDenyChrNO.checked)
    {
    document.form2.EditRecord.disabled=false;
    }

  • #4
    Regular Coder
    Join Date
    Jan 2006
    Posts
    251
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    BEAGLE,

    Adjusted my function to the following:
    Code:
    function EditON(){
    	if (document.form2.AcceptDenyChrNO.checked)
    document.form2.EditRecord.disabled=false;
    	else if (document.form2.AcceptDenyRegNO.checked)
    document.form2.EditRecord.disabled=false;
    	else if (document.form2.AcceptDenyCCNO.checked)
    document.form2.EditRecord.disabled=false;
    }
    Although the submit button is remaining disabled; the logic makes sense. JavaScript alerts have proven that the Javascript.js file is not being accessed; but everything looks correct.

    Adjusted the checkbox code too. Example of checkbox code:
    Code:
    <html>
    <head>
    </head>
    <body>
    <script src="javascript.js"></script>
    <form name="form2">
    <TABLE>
    <TR><TD>Record number 7</TD>
    <TD>Reviewed<br><input disabled type='checkbox' name='Reviewed' checked></TD>
    <TD>Accepted<br><input id='AcceptDenyChrYES' disabled type='checkbox' name='AcceptDenyChrYES' checked></TD>
    <TD>Denied<br><input onload='EditON()' id='AcceptDenyChrNO' disabled type='checkbox' name='AcceptDenyChrNO' value='YES'></TD>
    <TD>Department Chair<br>
    <textarea>Accepted</textarea>
    </TD></TR>
    
    <TFOOT><TR>
    <TD><a href='http://localhost/addedit.php?Records=101'>
    <input disabled type='submit' name='EditRecord' id='EditRecord' value='Edit Record' title='Edit record'></a></TD>
    </TR></TFOOT>
    </form></body></html>
    Last edited by h8ids; 07-11-2006 at 10:16 PM.

  • #5
    Senior Coder
    Join Date
    Jul 2005
    Location
    New York, NY
    Posts
    1,084
    Thanks
    4
    Thanked 19 Times in 19 Posts
    attach the onload to your body tag, not you elements.

    do you want the button to disable/enable every time you click checkboxes? then you want to put the function in the onclick attribute of the checkbox.

  • #6
    Regular Coder
    Join Date
    Jan 2006
    Posts
    251
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    Adjusted the code. Now onload is only located in the opening body tag.

    Weird thing occurred.
    Originally, I had several DIV tags between the Body and Form tags. I moved the FORM tag, positioning it immediately after the BODY tag. The only difference: all objects positioned by the DIV tags moved.
    So I placed the FORM tag back to its original position. Refreshed the page and voila! All page objects repositioned themselves and the button began functioning correctly.

    Why would this happen if there was nothing wrong with the code in the beginning?
    It's not a browser specific issue; both Firefox and IE have reacted the same way.
    I keep finding that the FORM tag must follow the DIV tags in order for the TOPMARGIN to equal "0".
    This doesn't seem normal to me.

  • #7
    Senior Coder
    Join Date
    Jul 2005
    Location
    New York, NY
    Posts
    1,084
    Thanks
    4
    Thanked 19 Times in 19 Posts
    Each structural element has it's own default style attributes. For example, divs display as block elements, span as inline.

    The structure of your page definitely has an effect on the layout. It doesn't seem strange to me at all that moving your form tag up the DOM tree would position everything else differently, because now the divs have a new parent document with margins, padding, etc.

    I think you should definitely pursue the issue through experimentation and ask the people in the HTML/CSS forum how to get the layout you want and why specific things look specific ways.

  • #8
    Regular Coder
    Join Date
    Jan 2006
    Posts
    251
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    I will pursue the differences between inline versus block.

    Do you know why there would be such a strange occurance to get a page working?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •