Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Drop-down to Populate Text Field

Status
Not open for further replies.
BDNFLNC

BDNFLNC

Technical User
May 30, 2002
202
US
Hello,

I am making a sort of mileage calculator. No database available, all the code has to be HTML/JavaScript.

I have it so that a few drop-down boxes appear as you choose your start, state, and city destinations. But my problem is that I need to be able to choose "Cleveland" from my last drop-down menu and have it display "147" in a text field. The text field can be there the whole process if need be.

I suppose maybe there is a way to do it with a write statement too so I would not need the text field?

I am not too adept with JavaScript so I get lost in the context. Any help would be appreciated.

Thanks!

Kenn
 
Sort by date Sort by votes
sure, try this simple example:
Code: 
<script>
function PopulateTextField(DrpDown)
{
 document.Frm.t1.value=DrpDown.options[DrpDown.selectedIndex].value
}
</script>
<form name="Frm">
<select onchange="PopulateTextField(this)">
<option value="0">This is 0</option>
<option value="1">This is 1</option>
</select>

<input type="text" name="t1" value="">
</form>

note that the value changes to 0 and 1, ie only the inner values will come...

Known is handfull, Unknown is worldfull
 
Upvote 0 Downvote
I sawe that code on the Web somewhere... I tried it, but it doesn't work out. Even the example you gave doesn't work in a browser for me.

I am using the following, with a dropdown.js script found at
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
</head>

<body onload="dropdown(1,start);">

<script language=JavaScript src="dropdown.js"
type=text/javascript></script>

<script language=JavaScript type=text/javascript>
var start = new Array(
new Array("form","campus","state","city"),
new Array(true,"Oakland","Ohio","Cleveland"),
new Array(true,"Oakland","Ohio","Cincinatti"),
new Array(true,"Oakland","Pennsylvania","Philadelphia"),
new Array(true,"Bradford","Ohio","Cleveland"),
new Array(true,"Bradford","Ohio","Cincinatti"),
new Array(true,"Bradford","Pennsylvania","Philadelphia"),
new Array(true,"Johnstown","Ohio","Cleveland"),
new Array(true,"Johnstown","Ohio","Cincinatti"),
new Array(true,"Johnstown","Pennsylvania","Philadelphia")
);
</script>

<script>
function PopulateTextField(DrpDown)
{
 document.form.mileage.value=DrpDown.options[DrpDown.selectedIndex].value
}
</script>

<form name="form" method="get">
campus:&nbsp;
<select onchange="update(this,start)" size="1" name="campus">
<option selected>Select Campus</option>
</select><br>
state:&nbsp;
<select onchange="update(this,start);" size="1" name="state">
<option selected>Select State</option>
</select><br>
city:&nbsp;
<select onchange="PopulateTextField(this);" size="1" name="city">
<option selected>Select City</option>
<option value="0">This is 0</option>
<option value="1">This is 1</option>
</select><br><br><br>
mileage:&nbsp;<input type="text" name="mileage" value="">

</form>
</body>

</html>
 
Upvote 0 Downvote
I'm also trying to edit the dropdown.js file so I can jhsut add to the array and display the mileage. That seems easiest, but I'm not having any luck.

Any solution would be helpful.
 
Upvote 0 Downvote
What browser are you using?

Try this for size... AFAIK, non-IE browsers need to use the correct DOM methods for accessing forms:

Code: 
<html>
<head>
<script type="text/javascript">
function PopulateTextField(DrpDownValue) {
   document.forms[0].t1.value = DrpDownValue;
}
</script>
</head>
<body>
<form>
   <select onchange="PopulateTextField(this.value);">
      <option value="0">This is 0</option>
      <option value="1">This is 1</option>
   </select>
   <input type="text" name="t1">
</form>
</body>
</html>

Hope this helps,
Dan
 
Upvote 0 Downvote
and dont give keywords as name to elements
<form name="form1" method="get">

form is a reserved keyword...


Known is handfull, Unknown is worldfull
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

nanbread
  • Locked
  • Question
Sweeping drop-down menus
Replies
0
Views
260
nanbread
nanbread
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
305
lexer
lexer
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
373
Kennelbloke
Kennelbloke
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
344
xwb
xwb
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
267
Rayj0000
Rayj0000

Part and Inventory Search

Sponsor

Back
Top