Advanced Search

Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Disable more than one checkboxes when a master check box is selected

  1. #1
    Join Date
    Feb 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Disable more than one checkboxes when a master check box is selected

    Hello gurus,
    i need some help please.

    I have 7 checkboxes. i need to validate them. First condition: if the 7th checkbox is checked then other 6 will get unchecked automatically.

    Second condition:
    If the 7 th checkbox is selected then a TEXT box must be filled in and user will be notified with a message to do that.

    i have been trying it myself but since i am a newbie i am stuck.

    Please someone help

    Thanks a lot

    Here is the code for the checkboxes


    <div><label for="chck1"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="1" id="chck1">Advanced Placement (AP)</label></div>

    <div><label for="chck2"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="2" id="chck2">International Baccalaureate (IB) Diploma</label></div>

    <div><label for="chck3"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="3" id="chck3">International Baccalaureate (IB) Certificate</label></div>

    <div><label for="chck4"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="4" id="chck4">Advanced (A) - Levels</label></div>

    <div><label for="chck5"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="5" id="chck5">Advanced Subsidiary (AS)-Levels</label></div>

    <div><label for="chck6"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="6" id="chck6">
    Courses completed at a college and/or another university</label></div>

    <div><label for="chck7"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="7" id="chck7">
    I have not written and will not be writing any of the exams listed above</label></div>


    This text box must be filled in if the student chooses the 7th checkbox
    <INPUT TYPE="text" NAME="1st_Course_Written" VALUE="" SIZE=50 >

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    <input type="checkbox" name="Type_Of_Exam_Student_passed"
    value="7" id="chck7" onclick="if(checked) {
      var e = document.getElementsByName('Type_Of_Exam_Student_passed');
      for(var i=0;i<e.length-1;i++) e[i].checked = false;
      document.getElementsByName('1st_Course_Written')[0].focus();
    }">
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Feb 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default A bit more help needed

    Quote Originally Posted by Twey
    Code:
    <input type="checkbox" name="Type_Of_Exam_Student_passed"
    value="7" id="chck7" onclick="if(checked) {
      var e = document.getElementsByName('Type_Of_Exam_Student_passed');
      for(var i=0;i<e.length-1;i++) e[i].checked = false;
      document.getElementsByName('1st_Course_Written')[0].focus();
    }">
    Thanks a lot, it worked but I need some more help with this. Sorry to bother you like this. I will really appreciate if someone could help.

    Modified First Condition: Keeping the previous validation same now, if the 7th checkbox is checked and then student tries to check others, this will uncheck the 7th box.

    Modified Second Condition: If the 7th Checkbox is checked the student MUST enter data into the textbox
    '1st_Course_Written' otherwise he will not be allowed to submit the form, an html messeage will appear at the top in RED, -- But if the student DONOT check the 7th checkbox but checks others, he WILL BE ABLE to submit the form.

    Thanks Gurus

    Gulluman

  4. #4
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    <script type="text/javascript">
    (function(form) {
      var z = document.getElementsByName("Type_Of_Exam_Student_passed");
      for(var i=0;i<z.length-1;i++) {
        form.elements[i].onclick = function() {
          document.getElementsByName("Type_Of_Exam_Student_passed")[document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
        }
      }
      form.onsubmit = function() {
        if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
          document.getElementsByName('1st_Course_Written')[0].value == "") {
          window.alert("Please fill in the text box.");
          document.getElementsByName("1st_Course_Written")[0].focus();
          return false;
        } else return true;
      }
    })(document.forms[0]);
    </script>
    Put that before your </form> tag. You may need to edit the 0 in document.forms[0] if your page has more forms on it before this one.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. #5
    Join Date
    Feb 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Twey
    Code:
    <script type="text/javascript">
    (function(form) {
      var z = document.getElementsByName("Type_Of_Exam_Student_passed");
      for(var i=0;i<z.length-1;i++) {
        form.elements[i].onclick = function() {
          document.getElementsByName("Type_Of_Exam_Student_passed")[document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
        }
      }
      form.onsubmit = function() {
        if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
          document.getElementsByName('1st_Course_Written')[0].value == "") {
          window.alert("Please fill in the text box.");
          document.getElementsByName("1st_Course_Written")[0].focus();
          return false;
        } else return true;
      }
    })(document.forms[0]);
    </script>
    Put that before your </form> tag. You may need to edit the 0 in document.forms[0] if your page has more forms on it before this one.
    Thanks a lot Twey.

    I tried as you mentioned but it seemed i am missing something. When I click the first few checkboxes It does not uncheck checkbox 7 which what i want. And it does not force me to write down in the textbox when i trie to submit.

    Here is the whole html code. Please let me know what is wrong. Its killing me now. I am stuck for 2 days.


    Thanks a lot.

    Gulluman

    Quote Originally Posted by gulluman


    <HTML>

    <HEAD>

    <TITLE>Test Form</TITLE>


    <script language="JavaScript">

    function noenter() {
    return !(window.event && window.event.keyCode == 13); }

    </script>



    </HEAD>

    <BODY BGCOLOR="#FFFFFF">

    <FORM name="course_approval_form" method="POST"

    action="http://www.response-o-matic.com/cgi-bin/rom.pl" onsubmit="validate();">

    <H1><CENTER>&nbsp;</CENTER></H1>

    <H1><CENTER><FONT COLOR="#000000">B.Sc Course Approval Form</FONT>

    </CENTER></H1>

    <H3><CENTER>

    <INPUT TYPE="hidden" NAME="your_email_address" VALUE="amiasof@30gigs.com">

    <INPUT TYPE="hidden" NAME="your_name" VALUE="Webmaster">

    <INPUT TYPE="hidden" NAME="email_subject_line" VALUE="B.Sc Course Approval">

    <INPUT TYPE="hidden" NAME="required_fields" VALUE="your_email_address">

    <INPUT TYPE="hidden" NAME="thank_you_title" VALUE="B.Sc">

    <INPUT TYPE="hidden" NAME="return_link_url" VALUE="http://www.msn.com">

    <INPUT TYPE="hidden" NAME="return_link_name" VALUE="Back To msn">

    <INPUT TYPE="hidden" NAME="background_color" VALUE="#C0C0C0">

    <INPUT TYPE="hidden" NAME="text_color" VALUE="#000000">

    <INPUT TYPE="hidden" NAME="link_color" VALUE="#0000FF">

    <INPUT TYPE="hidden" NAME="visited_link_color" VALUE="#8000FF">

    <INPUT TYPE="hidden" NAME="active_link_color" VALUE="#0000FF">

    </CENTER></H3>

    <H3><CENTER>Test</CENTER></H3>
    <P><CENTER>Just complete this form. Click on Submit when ready to

    send.</CENTER></P>





    <table align="center" width=650 border="0">
    <tbody><tr>
    <td>

    <p><b>Please select any of the following exams you have passed.
    If you have not passed any of these select the last line. <font color="red">(*required)</b></b></p>

    </TD></TR></tbody></table>

    <table align="center" width=650 border="3">
    <tbody><tr>
    <td>

    <div><label for="chck1"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="1" id="chck1">


    Advanced Placement (AP)</label></div>

    <div><label for="chck2"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="2" id="chck2" >International Baccalaureate (IB) Diploma</label></div>

    <div><label for="chck3"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="3" id="chck3" >International Baccalaureate (IB) Certificate</label></div>

    <div><label for="chck4"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="4" id="chck4" >Advanced (A) - Levels</label></div>

    <div><label for="chck5"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="5" id="chck5" >Advanced Subsidiary (AS)-Levels</label></div>

    <div><label for="chck6"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed"
    VALUE="6" id="chck6" >
    Courses completed at a college and/or another university</label></div>

    <div><label for="chck7"><INPUT TYPE="checkbox" NAME="Type_Of_Exam_Student_passed_7"
    VALUE="7" id="chck7" onclick="if(checked) {
    var e = document.getElementsByName('Type_Of_Exam_Student_passed');
    for(var i=0;i<e.length-1;i++) e[i].checked = false;
    document.getElementsByName('1st_Course_Written')[0].focus();
    }">

    I have not written and will not be writing any of the exams listed above</label></div>


    </td></tr></tbody></table><br /><br />


    <table align="center" width=650 border="0">
    <tbody><tr>
    <td>
    <p>Please tell us which papers you have written or will be writing, and your grades if you know them.
    If you do not know them, leave the spaces for the grades blank, and inform your adviser when you have the grades.
    You will also need to arrange for the board which administers the exams to send an official copy of your results
    to , Registrar’s and Recruitment Office.</p>

    </td></tr></tbody></table>


    <table align=center border="3">
    <tbody><tr bgcolor="#87cefa">
    <td valign="top">
    &nbsp;&nbsp;&nbsp; Name of Paper/Course with Units/Modules&nbsp;&nbsp;&nbsp; </td>
    <td valign="top"> &nbsp; Grade (if known)&nbsp;&nbsp; </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="1st_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">&nbsp;</td>

    <td valign="top"><INPUT TYPE="text" NAME="1st_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">
    </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="2nd_Course_ Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="2nd_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">

    </td></tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="3rd_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="3rd_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()"> </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="4th_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="4th_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()" > </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="5th_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="5th_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()"> </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="6th_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="6th_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()" > </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="7th_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()" >
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="7th_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()" > </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="8th_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()" >
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="8th_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()" > </td>
    </tr> </tbody></table>

    <br /><br />


    <script type="text/javascript">
    (function(course_approval_form) {
    var z = document.getElementsByName("Type_Of_Exam_Student_passed");
    for(var i=0;i<z.length-1;i++) {
    course_approval_form.elements[i].onclick = function() {
    document.getElementsByName("Type_Of_Exam_Student_passed")
    [document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
    }
    }
    form.onsubmit = function() {
    if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
    document.getElementsByName('1st_Course_Written')[0].value == "") {
    window.alert("Please fill in the text box.");
    document.getElementsByName("1st_Course_Written")[0].focus();
    return false;
    } else return true;
    }
    })(document.course_approval_form[0]);
    </script>

    <H4>&nbsp;</H4>
    <center>
    <BLOCKQUOTE><P><INPUT TYPE="submit" NAME="Submit Form"

    VALUE="Submit"><INPUT TYPE="reset" VALUE="Reset"></P>
    </BLOCKQUOTE>
    </center>
    <P>&nbsp;</P>

    </FORM>

    </BODY>

    </HTML>

  6. #6
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    /me checks
    You may need to edit the 0 in document.forms[0] if your page has more forms on it before this one.
    to see if it looks anything like "replace every occurrence of 'form' with the name of your form" in the right light, and has to concede it doesn't.

    The code works almost as-is in your page. Remove the _7 from the end of the name of your last checkbox, and replace
    Code:
    form.elements[i].onclick = function() {
    with
    Code:
    z[i].onclick = function() {
    (that latter is my error, not yours). The code will then work with your page. There is no need to insert the name of your form anywhere in the page (although it is possible to do so, and may be wise: replace
    Code:
    })(document.forms[0]);
    with
    Code:
    })(document.forms['course_approval_form']);
    ).
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  7. #7
    Join Date
    Feb 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Great...it worked so well. Thanks

    Quote Originally Posted by Twey
    /me checksto see if it looks anything like "replace every occurrence of 'form' with the name of your form" in the right light, and has to concede it doesn't.

    The code works almost as-is in your page. Remove the _7 from the end of the name of your last checkbox, and replace
    Code:
    form.elements[i].onclick = function() {
    with
    Code:
    z[i].onclick = function() {
    (that latter is my error, not yours). The code will then work with your page. There is no need to insert the name of your form anywhere in the page (although it is possible to do so, and may be wise: replace
    Code:
    })(document.forms[0]);
    with
    Code:
    })(document.forms['course_approval_form']);
    ).
    Hi Twey,

    I really appreciate all your help. The code worked really well.
    If you dont mind I have another query .

    I have another set of Checkboxes where the same kind of validation is done like above except this : - "when you select any of the first 6 checkbox except the last one, a text appears on top of the checkbox saying that the user has to fill in the textarea down below. The user must enter text in the text box before submit but this time the cursor would not take the user to the textfield "

    Thanks once again for all your help.

    Gulluman

  8. #8
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    <script type="text/javascript">
    (function(form) {
      var z = document.getElementsByName("Type_Of_Exam_Student_passed");
      for(var i=0;i<z.length-1;i++) {
        z[i].onclick = function() {
          document.getElementsByName("Type_Of_Exam_Student_passed")[document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
          var p = document.getElementById("fill_in_text_" + this.id);
          if(p) p.innerHTML = "Please fill in the text box below.";
        }
      }
      form.onsubmit = function() {
        if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
          document.getElementsByName('1st_Course_Written')[0].value == "") {
          window.alert("Please fill in the text box.");
          document.getElementsByName("1st_Course_Written")[0].focus();
          return false;
        } else return true;
      }
    })(document.forms['course_approval_form']);
    </script>
    Create a text-containing element with an ID of "fill_in_text_" and then the checkbox's ID. When each checkbox is clicked, its respective element will be filled with the message.

    For example, if you had a checkbox with id="chck4", you would create an element something like this:
    Code:
    <p id="fill_in_text_chck4"></p>
    where you wanted the message to appear.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  9. #9
    Join Date
    Feb 2006
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Not sure

    Thanks once again.
    I am not sure about the changing of ID for the checkboxes. so i copied the code once again BELOW. Please let me know.

    And also if the last check box is checked(Chck7) then there WON'T be any window forcing the user to fill in the textbox. The user can submit without filling in the text. The user WILL be forced only if one of the other 6 checkboxes are selected. I was wodering if I should remove the code related to that. I tried once but then the whole thing did not work.

    Finally, when i submit this form using netscape, it did not stop submitting when there was a blank. Is it possible to make it compatible easily ?

    Thanks in advance.

    Gulluman



    <HTML>

    <HEAD>

    <TITLE>Test Form</TITLE>


    <script language="JavaScript">

    function noenter() {
    return !(window.event && window.event.keyCode == 13); }

    </script>



    </HEAD>

    <BODY BGCOLOR="#FFFFFF">

    <FORM name="course_approval_form" method="POST"

    action="http://www.response-o-matic.com/cgi-bin/rom.pl" onsubmit="validate();">

    <H1><CENTER>&nbsp;</CENTER></H1>

    <H1><CENTER><FONT COLOR="#000000">B.Sc Course Approval Form</FONT>

    </CENTER></H1>

    <H3><CENTER>

    <INPUT TYPE="hidden" NAME="your_email_address" VALUE="amiasof@30gigs.com">

    <INPUT TYPE="hidden" NAME="your_name" VALUE="Webmaster">

    <INPUT TYPE="hidden" NAME="email_subject_line" VALUE="B.Sc Course Approval">

    <INPUT TYPE="hidden" NAME="required_fields" VALUE="your_email_address">

    <INPUT TYPE="hidden" NAME="thank_you_title" VALUE="B.Sc">

    <INPUT TYPE="hidden" NAME="return_link_url" VALUE="http://www.msn.com">

    <INPUT TYPE="hidden" NAME="return_link_name" VALUE="Back To msn">

    <INPUT TYPE="hidden" NAME="background_color" VALUE="#C0C0C0">

    <INPUT TYPE="hidden" NAME="text_color" VALUE="#000000">

    <INPUT TYPE="hidden" NAME="link_color" VALUE="#0000FF">

    <INPUT TYPE="hidden" NAME="visited_link_color" VALUE="#8000FF">

    <INPUT TYPE="hidden" NAME="active_link_color" VALUE="#0000FF">

    </CENTER></H3>

    <H3><CENTER>Test</CENTER></H3>
    <P><CENTER>Just complete this form. Click on Submit when ready to

    send.</CENTER></P>





    <table align="center" width=650 border="0">
    <tbody><tr>
    <td>

    <p><b>Please select any of the following exams you have passed.
    If you have not passed any of these select the last line. <font color="red">(*required)</b></b></p>

    </TD></TR></tbody></table>

    <TABLE width=650 align=center border=3>
    <TBODY>
    <TR>
    <TD>
    <DIV><LABEL for=fill_in_text_chck1><INPUT id=fill_in_text_chck1 type=checkbox value=1
    name=Type_Of_Exam_Student_passed> Advanced Placement (AP)</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck2><INPUT id=fill_in_text_chck2 type=checkbox value=2
    name=Type_Of_Exam_Student_passed> International Baccalaureate (IB)
    Diploma</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck3><INPUT id=fill_in_text_chck3 type=checkbox value=3
    name=Type_Of_Exam_Student_passed>International Baccalaureate (IB)
    Certificate</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck4><INPUT id=fill_in_text_chck4 type=checkbox value=4
    name=Type_Of_Exam_Student_passed>Advanced (A) - Levels</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck5><INPUT id=fill_in_text_chck5 type=checkbox value=5
    name=Type_Of_Exam_Student_passed>Advanced Subsidiary
    (AS)-Levels</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck6><INPUT id=fill_in_text_chck6 type=checkbox value=6
    name=Type_Of_Exam_Student_passed> Courses completed at a college and/or
    another university</LABEL></DIV>
    <DIV><LABEL for=fill_in_text_chck7><INPUT id=fill_in_text_chck7
    onclick="if(checked) {

    var e = document.getElementsByName('Type_Of_Exam_Student_passed');
    for(var i=0;i<e.length-1;i++) e[i].checked = false;
    document.getElementsByName('1st_Course_Written')[0].focus();}"
    type=checkbox value=7 name=Type_Of_Exam_Student_passed>


    I have not written and will not be writing any of the exams listed above</label></div>


    </td></tr></tbody></table><br /><br />


    <table align="center" width=650 border="0">
    <tbody><tr>
    <td>
    <p>Please tell us which papers you have written or will be writing, and your grades if you know them.
    If you do not know them, leave the spaces for the grades blank, and inform your adviser when you have the grades.
    </p>

    </td></tr></tbody></table>


    <table align=center border="3">
    <tbody><tr bgcolor="#87cefa">
    <td valign="top">
    &nbsp;&nbsp;&nbsp; Name of Paper/Course with Units/Modules&nbsp;&nbsp;&nbsp; </td>
    <td valign="top"> &nbsp; Grade (if known)&nbsp;&nbsp; </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="1st_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">&nbsp;</td>

    <td valign="top"><INPUT TYPE="text" NAME="1st_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">
    </td>
    </tr>
    <tr bgcolor="#87cefa">
    <td valign="top"><INPUT TYPE="text" NAME="2nd_Course_ Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    &nbsp; </td>
    <td valign="top"><INPUT TYPE="text" NAME="2nd_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">

    </td></tr>

    </tbody></table>

    <br /><br />


    <script type="text/javascript">
    (function(form) {
    var z = document.getElementsByName("Type_Of_Exam_Student_passed");
    for(var i=0;i<z.length-1;i++) {
    z[i].onclick = function() {
    document.getElementsByName("Type_Of_Exam_Student_passed")[document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
    var p = document.getElementById("fill_in_text_" + this.id);
    if(p) p.innerHTML = "Please fill in the text box below.";
    }
    }
    form.onsubmit = function() {
    if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
    document.getElementsByName('1st_Course_Written')[0].value == "") {
    window.alert("Please fill in the text box.");
    document.getElementsByName("1st_Course_Written")[0].focus();
    return false;
    } else return true;
    }
    })(document.forms['course_approval_form']);
    </script>


    <H4>&nbsp;</H4>
    <center>
    <BLOCKQUOTE><P><INPUT TYPE="submit" NAME="Submit Form"

    VALUE="Submit"><INPUT TYPE="reset" VALUE="Reset"></P>


    </BLOCKQUOTE>
    </center>
    <P>&nbsp;</P>

    </FORM>

    </BODY>

    </HTML>

  10. #10
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    So, something like this (move and style the paragraphs how you want them):
    Code:
    <HTML>
    
    <HEAD>
    
    <TITLE>Test Form</TITLE>
    
    
    <script language="JavaScript">
    
    	function noenter() {
    		return !(window.event && window.event.keyCode == 13); }
    
    </script>
    
    
    
    </HEAD>
    
    <BODY BGCOLOR="#FFFFFF">
    
    <FORM name="course_approval_form" method="POST"
    
    action="http://www.response-o-matic.com/cgi-bin/rom.pl" onsubmit="validate();">
    
    <H1><CENTER>&nbsp;</CENTER></H1>
    
    <H1><CENTER><FONT COLOR="#000000">B.Sc Course Approval Form</FONT>
    
    </CENTER></H1>
    
    <H3><CENTER>
    
    <INPUT TYPE="hidden" NAME="your_email_address" VALUE="amiasof@30gigs.com">
    
    <INPUT TYPE="hidden" NAME="your_name" VALUE="Webmaster">
    
    <INPUT TYPE="hidden" NAME="email_subject_line" VALUE="B.Sc Course Approval">
    
    <INPUT TYPE="hidden" NAME="required_fields" VALUE="your_email_address">
    
    <INPUT TYPE="hidden" NAME="thank_you_title" VALUE="B.Sc">
    
    <INPUT TYPE="hidden" NAME="return_link_url" VALUE="http://www.msn.com">
    
    <INPUT TYPE="hidden" NAME="return_link_name" VALUE="Back To msn">
    
    <INPUT TYPE="hidden" NAME="background_color" VALUE="#C0C0C0">
    
    <INPUT TYPE="hidden" NAME="text_color" VALUE="#000000">
    
    <INPUT TYPE="hidden" NAME="link_color" VALUE="#0000FF">
    
    <INPUT TYPE="hidden" NAME="visited_link_color" VALUE="#8000FF">
    
    <INPUT TYPE="hidden" NAME="active_link_color" VALUE="#0000FF">
    
    </CENTER></H3>
    
    <H3><CENTER>Test</CENTER></H3>
    <P><CENTER>Just complete this form. Click on Submit when ready to
    
    send.</CENTER></P>
    
    
    
    
    
    <table align="center" width=650 border="0">
    	<tbody><tr>
    			<td>
    
    				<p><b>Please select any of the following exams you have passed.
    					If you have not passed any of these select the last line. <font color="red">(*required)</b></b></p>
    
    				</TD></TR></tbody></table>
    
    				<TABLE width=650 align=center border=3>
    				<TBODY>
    				<TR>
    				<TD>
    				<DIV><p id="fill_in_text_chck1"></p><LABEL for=chck1><INPUT id=chck1 type=checkbox value=1
    				name=Type_Of_Exam_Student_passed> Advanced Placement (AP)</LABEL></DIV>
    				<DIV><p id="fill_in_text_chck2"></p><LABEL for=chck2><INPUT id=chck2 type=checkbox value=2
    				name=Type_Of_Exam_Student_passed> International Baccalaureate (IB)
    				Diploma</LABEL></DIV>
    				<DIV><p id="fill_in_text_chck3"></p><LABEL for=chck3><INPUT id=chck3 type=checkbox value=3
    				name=Type_Of_Exam_Student_passed>International Baccalaureate (IB)
    				Certificate</LABEL></DIV>
    				<DIV><p id="fill_in_text_chck4"></p><LABEL for=chck4><INPUT id=chck4 type=checkbox value=4
    				name=Type_Of_Exam_Student_passed>Advanced (A) - Levels</LABEL></DIV>
    				<DIV><p id="fill_in_text_chck5"></p><LABEL for=chck5><INPUT id=fill_in_text_chck5 type=checkbox value=5
    				name=Type_Of_Exam_Student_passed>Advanced Subsidiary
    				(AS)-Levels</LABEL></DIV>
    				<DIV><p id="fill_in_text_chck6"></p><LABEL for=fill_in_text_chck6><INPUT id=chck6 type=checkbox value=6
    				name=Type_Of_Exam_Student_passed> Courses completed at a college and/or
    				another university</LABEL></DIV>
    				<DIV><LABEL for=fill_in_text_chck7><INPUT id=chck7
    				onclick="if(checked) {
    
    				var e = document.getElementsByName('Type_Of_Exam_Student_passed');
    				for(var i=0;i<e.length-1;i++) e[i].checked = false;
    				document.getElementsByName('1st_Course_Written')[0].focus();}"
    				type=checkbox value=7 name=Type_Of_Exam_Student_passed>
    
    
    				I have not written and will not be writing any of the exams listed above</label></div>
    
    
    </td></tr></tbody></table><br /><br />
    
    
    <table align="center" width=650 border="0">
    	<tbody><tr>
    			<td>
    				<p>Please tell us which papers you have written or will be writing, and your grades if you know them.
    				If you do not know them, leave the spaces for the grades blank, and inform your adviser when you have the grades.
    				</p>
    
    </td></tr></tbody></table>
    
    
    <table align=center border="3">
    	<tbody><tr bgcolor="#87cefa">
    			<td valign="top">
    				&nbsp;&nbsp;&nbsp; Name of Paper/Course with Units/Modules&nbsp;&nbsp;&nbsp; </td>
    			<td valign="top"> &nbsp; Grade (if known)&nbsp;&nbsp; </td>
    		</tr>
    		<tr bgcolor="#87cefa">
    			<td valign="top"><INPUT TYPE="text" NAME="1st_Course_Written" VALUE="" SIZE=50 onkeypress="return noenter()">&nbsp;</td>
    
    			<td valign="top"><INPUT TYPE="text" NAME="1st_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">
    			</td>
    		</tr>
    		<tr bgcolor="#87cefa">
    			
    			<td valign="top"><INPUT TYPE="text" NAME="2nd_Course_ Written" VALUE="" SIZE=50 onkeypress="return noenter()">
    				&nbsp; </td>
    			<td valign="top"><INPUT TYPE="text" NAME="2nd_Course_Grade" VALUE="" SIZE=20 onkeypress="return noenter()">
    
    		</td></tr>
    
    </tbody></table>
    
    <br /><br />
    
    
    <script type="text/javascript">
    	(function(form) {
    	 var z = document.getElementsByName("Type_Of_Exam_Student_passed");
    	 for(var i=0;i<z.length-1;i++) {
    	 z[i].onclick = function() {
    		 document.getElementsByName("Type_Of_Exam_Student_passed")[document.getElementsByName("Type_Of_Exam_Student_passed").length-1].checked = false;
    		 var p = document.getElementById("fill_in_text_" + this.id);
    		 if(p && document.getElementById(this.id).checked) p.innerHTML = "Please fill in the text box below.";
    		 else if(p) p.innerHTML = "";
    	 }
    	 }
    	 form.onsubmit = function() {
    	 if(document.getElementsByName("Type_Of_Exam_Student_passed")[6].checked &&
    		 document.getElementsByName('1st_Course_Written')[0].value == "") {
    	 window.alert("Please fill in the text box.");
    	 document.getElementsByName("1st_Course_Written")[0].focus();
    	 return false;
    	 } else return true;
    	 }
    	 })(document.forms['course_approval_form']);
     </script>
    
    
     <H4>&nbsp;</H4>
     <center>
    	 <BLOCKQUOTE><P><INPUT TYPE="submit" NAME="Submit Form"
    
    	 VALUE="Submit"><INPUT TYPE="reset" VALUE="Reset"></P>
    
    
    	 </BLOCKQUOTE>
     </center>
     <P>&nbsp;</P>
    
     </FORM>
    
     </BODY>
    
     </HTML>
    By the way, your HTML is awful. I strongly suggest you run it through a validator.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

Bookmarks

Posting Permissions

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