Jump to content

Menu onChange()


usadarts

Recommended Posts

I have a web page in which the top half has a pull down menu with 5 options (1,2,3,4,5)

The bottom half has rows to enter in information

 

If they select 1, I would like 1 row of text boxes to appear

If they select 2, I would like 2 rows of text boxes to appear

etc,etc....

 

Can someone give some type of example for this?

 

Thanks

David

 

Link to comment
Share on other sites

Let me explain in more detail.  I have a form with a pulldown menu:

<form action="post.php" method="POST">
  <center>
  <b>Total Payout: </b><b>
    <select name="totalpayout" onChange="results()">
      <option value="">Select Purse
      <option value="1">$ 1,000 - $ 4,999
      <option value="5">$ 5,000 - $ 9,999
      <option value="10">$10,000 - $14,999
      <option value="15">$15,000 - $19,999
      <option value="20">$20,000 and more
    </select>
    </b><br>
  </center>
</form>

 

When a menu option is selected, I want 1 of the following option to appear below the pulldown menu, but still within the form. I have the following within the <head>

function results()
{
if(totalpayout == 1){
<table border="5" align="center">
    <tr>
      <th width="66">Placed</th>
      <th width="180">Player Name <br></th>
    </tr>
    <tr>
      <th width="66">1st</th>
    <input type="text" name="1stplace" size="20">
    </tr>
    <tr>
      <th width="66">2nd</th>
    <input type="text" name="2ndplace" size="20">
    </tr>
    <tr>
      <th width="66">Top 4</th>
    <input type="text" name="3rdplace" size="20">
    </tr>
    <tr>
      <th width="66">Top 4</th>
    <input type="text" name="4thplace" size="20">
    </tr>
  </table>
}
if(totalpayout == 5){...........
}
}

 

if 5 then rows up to top 8.

if 10 then rows up to top 16

if 15 then rows up to top 16

if 20 then rows up to top 32

 

Any help would be great

 

Link to comment
Share on other sites

First of all, if you're doing it in JavaScript, it doesn't work to mix JS and HTML:

function results()

{

if(totalpayout == 1){

<table border="5" align="center">

    <tr>

      <th width="66">Placed</th>

      <th width="180">Player Name <br></th>

    </tr>

 

What I would do is use <div> tags. In your form:

<form action="post.php" method="POST">
  <center>
  <b>Total Payout: </b><b>
    <select name="totalpayout" onChange="results()">
      <option value="">Select Purse
      <option value="1">$ 1,000 - $ 4,999
      <option value="5">$ 5,000 - $ 9,999
      <option value="10">$10,000 - $14,999
      <option value="15">$15,000 - $19,999
      <option value="20">$20,000 and more
    </select>
    </b><br>
  </center>
  <div id='more'></div>
</form>

 

Then in the JavaScript:

function results() {
  var begin = "<table border="5" align="center"><tr><th width="66">Placed</th><th width="180">Player Name<br></th></tr>";
  var end = "</table>";
  var num;
  if(totalpayout == 1) num = 4;
  elseif(totalpayout == 5) num = 8;
  elseif(totalpayout == 10) num = 16;
  elseif(totalpayout == 15) num = 16;
  else num = 32;

  var text = begin;
  for(i=0;i<num;i++) {
    text += "<tr><th width='66'>"+(i+1)+"</th><input type='text' name='"+(i+1)+"place' size='20'></tr>";
  }
  text += end;
  document.getElementById('more').innerHTML = text;
}

 

You could also write a function that gives you the ordinal number string.

 

Hope that helps.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.