Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 177
  • Last Modified:

select box values

i have a select box called type in the following code. i want to be able to dispay the other select boxs according to what the user selects from the type box. Is there any way of doing this.

caz



<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body bgcolor="#FFFFDF">


<p align="center">
<big><u>New Appointment</u></big>
</p>
<?
echo "<form name='form1' action='diarynews.php?year=".$year."& month=".$month."& day=".$day."' method='post'>";
?>
<table border="1" width="100%" cellspacing="0" cellpadding="0">
  <tr>
    <td width="30">Type</td>
    <td><select size="1" name="type">
        <option selected>Appointment</option>
        <option value="Nontimed">Non-timed Event</option>
        <option>Reminder</option>
        <option>Vacation</option>
      </select></td>
  </tr>

  <tr>
    <td >Start Time</td>
    <td><select size="1" name="starthour">
      <option value="none" selected>-</option>
        <option>00</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
       
      </select>


      <select size="1" name="startmin">
      <option value='none' selected>-</option>
      <option>00</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
        <option>24</option>
        <option>25</option>
        <option>26</option>
        <option>27</option>
        <option>28</option>
        <option>29</option>
        <option>30</option>
        <option>31</option>
        <option>32</option>
        <option>33</option>
        <option>34</option>
        <option>35</option>
        <option>36</option>
        <option>37</option>
        <option>38</option>
        <option>39</option>
        <option>40</option>
        <option>41</option>
        <option>42</option>
        <option>43</option>
        <option>44</option>
        <option>45</option>
        <option>46</option>
        <option>47</option>
        <option>48</option>
        <option>49</option>
        <option>50</option>
        <option>51</option>
        <option>52</option>
        <option>53</option>
        <option>54</option>
        <option>55</option>
        <option>56</option>
        <option>57</option>
        <option>58</option>
        <option>59</option>
       
      </select>
</td>
  </tr>
  <tr>
    <td >Start Date</td>
    <td><select size="1" name="startday">
        <option value="none" selected>-</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
        <option>24</option>
        <option>25</option>
        <option>26</option>
        <option>27</option>
        <option>28</option>
        <option>29</option>
        <option>30</option>
        <option>31</option>

      </select><select size="1" name="startmonth">
        <option value="none" selected>-</option>
        <option value="01">January</option>
        <option value="02">February</option>
        <option value="03">March</option>
        <option value="04">April</option>
        <option value="05">May</option>
        <option value="06">June</option>
        <option value="07">July</option>
        <option value="08">August</option>
        <option value="00">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>

      </select><select size="1" name="startyear">
        <option value="none" selected>-</option>
        <option>2002</option>
        <option>2003</option>
        <option>2004</option>
        <option>2005</option>
        <option>2006</option>

      </select></td>
  </tr>
  <tr>
    <td >End Time</td>
    <td><select size="1" name="endhour">
        <option value="none" selected>-</option>
        <option>00</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>

      </select><select size="1" name="endmin">
        <option value="none" selected>-</option>
        <option>00</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
        <option>24</option>
        <option>25</option>
        <option>26</option>
        <option>27</option>
        <option>28</option>
        <option>29</option>
        <option>30</option>
        <option>31</option>
        <option>32</option>
        <option>33</option>
        <option>34</option>
        <option>35</option>
        <option>36</option>
        <option>37</option>
        <option>38</option>
        <option>39</option>
        <option>40</option>
        <option>41</option>
        <option>42</option>
        <option>43</option>
        <option>44</option>
        <option>45</option>
        <option>46</option>
        <option>47</option>
        <option>48</option>
        <option>49</option>
        <option>50</option>
        <option>51</option>
        <option>52</option>
        <option>53</option>
        <option>54</option>
        <option>55</option>
        <option>56</option>
        <option>57</option>
        <option>58</option>
        <option>59</option>

      </select></td>
  </tr>
  <tr>
    <td >End Date</td>
    <td><select size="1" name="endday">
        <option value="none" selected>-</option>
        <option>01</option>
        <option>02</option>
        <option>03</option>
        <option>04</option>
        <option>05</option>
        <option>06</option>
        <option>07</option>
        <option>08</option>
        <option>09</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
        <option>13</option>
        <option>14</option>
        <option>15</option>
        <option>16</option>
        <option>17</option>
        <option>18</option>
        <option>19</option>
        <option>20</option>
        <option>21</option>
        <option>22</option>
        <option>23</option>
        <option>24</option>
        <option>25</option>
        <option>26</option>
        <option>27</option>
        <option>28</option>
        <option>29</option>
        <option>30</option>
        <option>31</option>

      </select><select size="1" name="endmonth">
        <option value="none" selected>-</option>
      <option value="01">January</option>
        <option value="02">February</option>
        <option value="03">March</option>
        <option value="04">April</option>
        <option value="05">May</option>
        <option value="06">June</option>
        <option value="07">July</option>
        <option value="08">August</option>
        <option value="00">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>

      </select><select size="1" name="endyear">
        <option value="none" selected>-</option>
        <option>2002</option>
        <option>2003</option>
        <option>2004</option>
        <option>2005</option>
        <option>2006</option>

      </select></td>
  </tr>
  <tr>
    <td >Repeat</td>
    <td><select size="1" name="repeat">
        <option value="none" selected>Never</option>
        <option>Daily</option>
        <option>Weekly</option>
        <option>Monthly</option>
        <option>Yearly</option>

      </select></td>
  </tr>
  <tr>
    <td >Contact</td>
    <td><select name="contact" size="1"></select></td>
  </tr>
  <tr>
    <td >Details</td>
    <td><p><textarea rows="2" name="details" cols="90%"></textarea></p>
</td>
  </tr>
  <tr>
    <td width="100%" colspan="2" align="center">

<table border="0"  cellspacing="0" cellpadding="2"> <tr> <td><input type="submit" value="Save" name="save"></form></td>
<td>
<FORM>
<?
echo "<input type='button' onClick=\"parent.main.location='diary.php?year=".$year."& month=".$month."& day=".$day."'\" value='Cancel'>";
?>
</form></td></tr></table></td>

  </tr>
</table>
</body>

</html>
0
ma9csw
Asked:
ma9csw
  • 2
  • 2
1 Solution
 
andrivCommented:
If you want it done on selection you can do it with Javascript.  How are you basing what is displayed in the other boxes? If you select Appointment what do you want to set in the other selects and if they select Non-Timed Event then waht will be set.
0
 
ma9cswAuthor Commented:
if i select appointment i want to see all the other drop downs but if i select vacation for instance i do not want to see the ones relating to start time and end time.

caz
0
 
andrivCommented:
The best and easiest way to handle it is first display the first select option (type) then when they click on the submit it will display the selects that pertain to that function.
If you want it to all take place on one page includeing the 'type' you will have to use JavaScript and the best you can do is disable the selects that are not needed.

After they submit the type you use conditional statements to decide which ones to display on step two:

if($type=='Appointment')
{
?>

<select name='...

...

If you need more help with this let me know.
0
 
Richard QuadlingSenior Software DeverloperCommented:
You could use JavaScript to construct the entries that are appropriate to each <select>.

This code is from the Netscape Developer's pages.

Add an option with the Option constructor. The following example creates two Select objects, one with and one without the MULTIPLE attribute. No options are initially defined for either object. When the user clicks a button associated with the Select object, the populate function creates four options for the Select object and selects the first option.

<SCRIPT>function populate(inForm) {   colorArray = new Array("Red", "Blue", "Yellow", "Green")
   var option0 = new Option("Red", "color_red")   var option1 = new Option("Blue", "color_blue")   var option2 = new Option("Yellow", "color_yellow")   var option3 = new Option("Green", "color_green")
   for (var i=0; i < 4; i++) {      eval("inForm.selectTest.options[i]=option" + i)      if (i==0) {         inForm.selectTest.options[i].selected=true      }   }
   history.go(0)}</SCRIPT>
<H3>Select Option() constructor</H3><FORM><SELECT NAME="selectTest"></SELECT><P><INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)"><P></FORM>
<HR><H3>Select-Multiple Option() constructor</H3><FORM><SELECT NAME="selectTest" multiple></SELECT><P><INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)"></FORM>

Regards,

Richard Quadling.
0
 
Richard QuadlingSenior Software DeverloperCommented:
Eek. Sorry about that mess.

Here is it again.

Add an option with the Option constructor. The following example creates two Select objects, one with and one without the MULTIPLE attribute. No options are initially defined for either object. When the user clicks a button associated with the Select object, the populate function creates four options for the Select object and selects the first option.

<SCRIPT>
function populate(inForm)
{
colorArray = new Array("Red", "Blue", "Yellow", "Green");
var option0 = new Option("Red", "color_red");
var option1 = new Option("Blue", "color_blue");
var option2 = new Option("Yellow", "color_yellow");
var option3 = new Option("Green", "color_green");
for (var i=0; i < 4; i++)
     {
          eval("inForm.selectTest.options[i]=option" + i);
          if (i==0)
               {
               inForm.selectTest.options[i].selected=true;
               }
          }
history.go(0)
}
</SCRIPT>

And 2 examples of usage

<H3>Select Option() constructor</H3>
<FORM>
     <SELECT NAME="selectTest"></SELECT>
     <P><INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)"><P>
</FORM>


<H3>Select-Multiple Option() constructor</H3>
<FORM>
     <SELECT NAME="selectTest" multiple></SELECT>
     <P><INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)">
</FORM>
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now