#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2002
    Posts
    3
    Rep Power
    0

    Javascript select boxes


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled</title>
    <link rel="stylesheet" type="text/css" href="cbStyles.css">
    <script language=JavaScript>
    <!--
    function validate() {
    if((document.ucsPayments.firstName.value==""))
    {
    alert("First Name Cannot Be Blank. Try Again.")
    return false
    }
    if((document.ucsPayments.lastName.value==""))
    {
    alert("Last Name Cannot Be Blank. Try Again.")
    return false
    }
    if((document.ucsPayments.payments.value==""))
    {
    alert("Select Payment Option. Try Again.")
    return false
    }
    if((document.ucsPayments.payBycreditCardName.value==""))
    {
    alert("Select Credit Card. Try Again.")
    return false
    }
    if((document.ucsPayments.amount.value==""))
    {
    alert("Fill in Amount Option. Try Again.")
    return false
    }
    if((document.ucsPayments.bankName.value==""))
    {
    alert("Select Bank Name Option. Try Again.")
    return false
    }
    if((document.ucsPayments.checkAmount.value==""))
    {
    alert("Fill In Check Amount. Try Again.")
    return false
    }
    }
    //-->
    </script>
    <script language="javascript">
    function Table(iTable) {
    var sColl, sStyle;
    IE = window.navigator.appName.toLowerCase().indexOf("micro") != -1;
    (IE)?sColl = "all.":sColl = "getElementById('";
    (IE)?sStyle = ".style":sStyle = "').style";

    if (iTable == 0) {
    eval("document." + sColl + "creditcard" + sStyle + ".display = 'none';");
    eval("document." + sColl + "check" + sStyle + ".display = 'none';");
    }
    if (iTable == 1) {
    eval("document." + sColl + "creditcard" + sStyle + ".display = '';");
    eval("document." + sColl + "check" + sStyle + ".display = 'none';");
    }
    if (iTable == 2) {
    eval("document." + sColl + "creditcard" + sStyle + ".display = 'none';");
    eval("document." + sColl + "check" + sStyle + ".display = '';");
    }
    }
    </script>
    </head>
    <body bgColor="#ffdab9">
    <div align="center">
    <h3>Company Name</h3>
    <form action="javascript:alert('Followup page will be setup later.')" method="post" name="ucsPayments" onSubmit="return validate()">
    <fieldset>
    <legend>&nbsp;Personal Information&nbsp;</legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td>&nbsp;First Name</td>
    <td>&nbsp;<input type="text" name="firstName" size="30" value=""></td>
    </tr>
    <tr>
    <td>&nbsp;Last Name</td>
    <td>&nbsp;<input type="text" name="lastName" size="30" value=""></td>
    </tr>
    </table>
    </fieldset>
    <br>
    <fieldset>
    <legend>&nbsp;&nbsp;Payment Options&nbsp;&nbsp;</legend>
    <table>
    <tr>
    <td>
    <select name="payments" onchange="Table(this.selectedIndex);">
    <option>Select Payment Option</option>
    <option value="creditcard">Credit Card</option>
    <option value="check">Personal Check</option>
    </select>
    </td>
    </tr>
    </table>
    </fieldset>
    <div id="creditcard" name="creditcard" style="display:none;">
    <!-- creditcard -->
    <br>
    <fieldset>
    <legend>&nbsp;&nbsp;Credit Card Payments&nbsp;&nbsp;</legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td>&nbsp;</td>
    </tr>
    <tr>
    <td>&nbsp;Credit Card Name</td>
    <td>&nbsp;
    <select name="payBycreditCardName">
    <option>Select One</option>
    <option value="American Express">American Express</option>
    <option value="Master Card">Master Card</option>
    <option value="Visa">Visa</option>
    <option value="Other">Other Card</option>
    </select>
    </td>
    </tr>
    <tr>
    <td>&nbsp;Amount</td>
    <td>&nbsp;&nbsp;<input type="text" name="amount" size="16" value=""></td>
    </tr>
    </table>
    </fieldset>
    </div>
    <div id="check" name="check" style="display:none;">
    <!-- check -->
    <fieldset>
    <legend>&nbsp;&nbsp;Personal Check Payments&nbsp;&nbsp;</legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td colspan="2" width="250">&nbsp;</td>
    </tr>
    <tr>
    <td>&nbsp;Bank Name</td>
    <td align="left">&nbsp;<input type="text" name="bankName" size="30" value=""></td>
    </tr>
    <tr>
    <td>&nbsp;Check Amount</td>
    <td align="left">&nbsp;<input type="text" name="checkAmount" size="30" value=""></td>
    </tr>
    </table>
    </fieldset>
    </div>
    <br>
    <br>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td align="center">&nbsp;
    <input type="reset" name="reset" value="Reset">&nbsp;
    <input type="submit" name="submit" value="Next >>">
    </td>
    </tr>
    </table>
    </form>
    </div>
    </body>
    </html>
  2. #2
  3. No Profile Picture
    Senior Citizen
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2001
    Location
    leftcoast
    Posts
    2,019
    Rep Power
    16
    What was the question? Oh, heck....


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled</title>
    <link rel="stylesheet" type="text/css" href="cbStyles.css">
    <script type="text/javascript" language="JavaScript">
    <!--
    function validate(f) {
    if (!f.firstName.value) {
    alert('First Name Cannot Be Blank. Try Again.');
    f.firstName.focus();
    return false;
    }
    if (!f.lastName.value) {
    alert('Last Name Cannot Be Blank. Try Again.');
    f.lastName.focus();
    return false;
    }
    if (f.payments.selectedIndex == 0) {
    alert('Select Payment Option. Try Again.');
    f.payments.focus();
    return false;
    }
    if (f.payments[1].selected && !f.payBycreditCardName.selectedIndex) {
    alert('Select Credit Card. Try Again.');
    f.payBycreditCardName.focus();
    return false;
    }
    if (f.payments[1].selected && !f.amount.value) {
    alert('Fill in Amount Option. Try Again.');
    f.amount.focus();
    return false;
    }
    if (f.payments[2].selected && !f.bankName.value) {
    alert('Select Bank Name Option. Try Again.');
    f.bankName.focus();
    return false;
    }
    if (f.payments[2].selected && !f.checkAmount.value) {
    alert('Fill In Check Amount. Try Again.');
    f.checkAmount.focus();
    return false;
    }
    return true;
    }

    function getElement(id) {
    return document.all ? document.all(id) :
    document.getElementById ? document.getElementById(id) : null;
    }

    function Table(iTable) {
    var el;
    switch (iTable) {
    case 0 :
    el = getElement('creditcard');
    if (el && el.style) el.style.display = 'none';
    el = getElement('check');
    if (el && el.style) el.style.display = 'none';
    break;
    case 1 :
    el = getElement('creditcard');
    if (el && el.style) el.style.display = '';
    el = getElement('check');
    if (el && el.style) el.style.display = 'none';
    break;
    case 2 :
    el = getElement('creditcard');
    if (el && el.style) el.style.display = 'none';
    el = getElement('check');
    if (el && el.style) el.style.display = '';
    break;
    }
    }
    //-->
    </script>
    </head>
    <body bgColor="#ffdab9">
    <div align="center">
    <h3>Company Name</h3>
    <form action="javascript&#58;alert('Followup page will be setup later.')" method="post" name="ucsPayments" onSubmit="return validate(this)">
    <fieldset>
    <legend> Personal Information </legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td> First Name</td>
    <td> <input type="text" name="firstName" size="30" value=""></td>
    </tr>
    <tr>
    <td> Last Name</td>
    <td> <input type="text" name="lastName" size="30" value=""></td>
    </tr>
    </table>
    </fieldset>
    <br>
    <fieldset>
    <legend> Payment Options </legend>
    <table>
    <tr>
    <td>
    <select name="payments" onchange="Table(this.selectedIndex)">
    <option>Select Payment Option</option>
    <option value="creditcard">Credit Card</option>
    <option value="check">Personal Check</option>
    </select>
    </td>
    </tr>
    </table>
    </fieldset>
    <div id="creditcard" name="creditcard" style="display:none;">
    <!-- creditcard -->
    <br>
    <fieldset>
    <legend> Credit Card Payments </legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td> </td>
    </tr>
    <tr>
    <td> Credit Card Name</td>
    <td>
    <select name="payBycreditCardName">
    <option>Select One</option>
    <option value="American Express">American Express</option>
    <option value="Master Card">Master Card</option>
    <option value="Visa">Visa</option>
    <option value="Other">Other Card</option>
    </select>
    </td>
    </tr>
    <tr>
    <td> Amount</td>
    <td> <input type="text" name="amount" size="16" value=""></td>
    </tr>
    </table>
    </fieldset>
    </div>
    <div id="check" name="check" style="display:none;">
    <!-- check -->
    <fieldset>
    <legend> Personal Check Payments </legend>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td colspan="2" width="250"> </td>
    </tr>
    <tr>
    <td> Bank Name</td>
    <td align="left"> <input type="text" name="bankName" size="30" value=""></td>
    </tr>
    <tr>
    <td> Check Amount</td>
    <td align="left"> <input type="text" name="checkAmount" size="30" value=""></td>
    </tr>
    </table>
    </fieldset>
    </div>
    <br>
    <br>
    <table cellpadding="0" cellspacing="0" width="500" border="0">
    <tr>
    <td align="center">
    <input type="reset" name="reset" value="Reset">
    <input type="submit" name="submit" value="Next >>">
    </td>
    </tr>
    </table>
    </form>
    </div>
    </body>
    </html>


    Last edited by adios; July 10th, 2002 at 11:08 PM.
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2002
    Posts
    3
    Rep Power
    0

    thank you - adios.


    thank you - adios.

IMN logo majestic logo threadwatch logo seochat tools logo