Menu onChange()

usadarts · August 7, 2007

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

usadarts · August 7, 2007

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

php_tom · August 10, 2007

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.

Sign In

Menu onChange()

Recommended Posts

usadarts

Link to comment

Share on other sites

usadarts

Link to comment

Share on other sites

php_tom

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information