extremely stuck

**jake2891** · 02-11-2008, 06:06 PM

Hi guys,

Im trying to have a drop down with values 1-5 and when a user clicks 2 for example it then automatically puts in 2 input fields and if 3 then three input fields etc.. here is my code but its not working correctly can anyone see why?

<html>
<head>
<script language="JavaScript" type="text/javascript">
function showdivs() {
totaldivs = document.forms.consult.sales.value;
totaldivs++;
for (j=1; j<6; j++) { document.getElementById("sales" + j).style.display = 'none'; }
for (i=1; i<totaldivs; i++) { document.getElementById("sales" + i).style.display = 'block'; }
}
</script>
</head>
<body>
<form name="consult" id="consult" >
<table>
<tr>
<td ><select name="sales" id="sales" onChange="showdivs();">
<option value="0">Sales</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select></td>

<div name="sales" id="sales" style="display: none;">
</tr>
<td><input name="sales_names" /></td>
</tr>
</div>

**jscheuer1** · 02-11-2008, 06:12 PM

You cannot have two elements with an id of sales, and where's sales1, 2, etc?

Please post a link to the page on your site that contains the problematic code so we can check it out.

**jake2891** · 02-11-2008, 06:20 PM

Originally Posted by jscheuer1

You cannot have two elements with an id of sales, and where's sales1, 2, etc?

Please post a link to the page on your site that contains the problematic code so we can check it out.

Hi sorry i dont have a live link unfortunately. The sales 1, 2 im trying to do in php

foreach(div in divs){
$i++
<input name="sales_names($i)>

}

**jake2891** · 02-11-2008, 06:22 PM

Originally Posted by jscheuer1

You cannot have two elements with an id of sales, and where's sales1, 2, etc?

Please post a link to the page on your site that contains the problematic code so we can check it out.

Im not entirely sure on how to get it fully working?

**jscheuer1** · 02-12-2008, 04:51 PM

Here's one way to do something like that:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#sales input {
display:block;
}
#consult {
display:none;
}
</style>
<script type="text/javascript">
document.write('<style type="text/css">#sales input {display:none;} #consult {display:block;}<\/style>');
function showInputs(sel) {
var totalInputs = document.getElementById('sales').getElementsByTagName('input');
for (var i = totalInputs.length-1; i > -1; --i)
totalInputs[i].style.display='none';
for (var i = totalInputs.length-1; i > -1; --i)
if(sel.value==i+1)
totalInputs[i].style.display='block';
}
</script>
</head>
<body>
<form action="#">
<div id="sales"> 
<select id="consult" onchange="showInputs(this);">
<option value="0">Sales </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>

<input name="sales1">
<input name="sales2">
<input value="I'm 3" name="sales3">
<input name="sales4">
<input name="sales5">
</div>
</form>

If javascript is disabled, all of the inputs and only the inputs will be seen. I put "I'm 3" as a value for sales3 for testing/demo purposes only. In actual practice, this is still not practical for any real life purpose I can think of, but might get you on your way.

Thread: extremely stuck

Thread Tools

Search Thread

extremely stuck

Bookmarks

Bookmarks

Posting Permissions