help with drop down menus

Rupa · Jun 5, 2002

I am trying to make a drop down menu that has both a part number and a description of the part number but only displays the part number in the box when something is selected. For example:

PN# 0001 | Copper Cable Sheild

would be displayed when the menu is viewed but when it is actually selected only PN# 0001 is displayed. Right now I have PN#0001 as the choice and Cooper Cable Shield as the value. (I sort of need to keep it that way because I'm using document.form.fieldName.value to access the value in JavaScript.)

Help!

Thanks!

GUJUm0deL · Jun 5, 2002

I'm not sure I follow, can you be a little more specific?? I have not failed; I merely found 100,000 different ways of not succeding...

Rupa · Jun 5, 2002

I'm not sure I know how to be more specific!
I realized, though, that this is not a JS question...it's more of an HTML question! Anyway, I'm not sure if you can still help me....but I'll try to explain my problem again anyway!

Basically I have a drop down menu that consists of about 100 part numbers. The user is supposed to select the part number that he/she needs but they don't know what part each part number is for. (I.e. what is MT0001 vs MT0511?) So, I need to include a description of each part number next to the number which looks something like this:

MT0001 - Copper Cable Shield

But when the user selects one of the part numbers from the list of 100, I only want the part number (MT0001) to be displayed in the drop-down menu box. (The part descriptions are long and I don't want that long of a box on the page.) I don't know if this is even possible in HTML.

Thanks!

(Btw, are you really a guju model?!)

GUJUm0deL · Jun 6, 2002

Hi Rupa, I hoipe this is what you are looking for:

Code:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;>
<script language=&quot;javascript&quot;>
function displ()
{
document.myFORM.textfield.value=document.myFORM.valu.value;
}
//-->
</script>
</head>

<body bgcolor=&quot;#FFFFFF&quot; text=&quot;#000000&quot;>
<table border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot; width=&quot;55%&quot;>
  <tr>
<td width=&quot;100%&quot;><form name=&quot;myFORM&quot;>
        <p> 
          <select name=&quot;valu&quot; size=&quot;1&quot;>
            <option selected value=&quot;Description One&quot;>MT001</option>
            <option value=&quot;Description Two&quot;>MT002</option>
            <option value=&quot;Description Three&quot;>MT003</option>
          </select>
          <input type=&quot;button&quot; name=&quot;Button&quot; value=&quot;Click Here&quot; onClick=&quot;return displ();&quot;>
          <input type=&quot;text&quot; name=&quot;textfield&quot;>
        </p>
</form>
</td>
</tr>
</table>
</body>
</html>

Just copy and paste this in a blank HTML file and run in, this has the effect that you wanted...you can do this two wyas: one is have the description display after the button is hit and another is to have it display as soon as the option value is selected...

PS -- actualy if truth be told, im an GUJU actor...

I have not failed; I merely found 100,000 different ways of not succeding...

BigBadDave · Jun 6, 2002

Or even this :

<html>
<head>
<title>Untitled Document</title>
<script language="javascript">
function displ()
{
document.myFORM.textfield.value=document.myFORM.valu.value;
}
//-->
</script>
</head>

<body bgcolor="#FFFFFF" text="#000000">
<table border="0" cellspacing="0" cellpadding="0" width="55%">
<tr>
<td width="100%"><form name="myFORM">
<p>
<select name="valu" size="1" onchange="return displ();">
<option selected value="Description One">MT001</option>
<option value="Description Two">MT002</option>
<option value="Description Three">MT003</option>
</select>
<input style="border: 0;" type="text" name="textfield">
</p>
</form>
<script>displ()</script>
</td>
</tr>
</table>
</body>
</html> Regards

Big Bad Dave

davidbyng@hotmail.com

GUJUm0deL · Jun 6, 2002

Rupa, slight change in my script:
change whatever that is in the <script></script> tags and add this instead:

<script language="javascript">
function displ()
{
document.myFORM.textfield.value=document.myFORM.valu.options[document.myFORM.valu.selectedIndex].value;
}
//-->
</script>

The reason is the red-bold portion will also make the script work in NS4 browsers... I have not failed; I merely found 100,000 different ways of not succeding...

Rupa · Jun 7, 2002

Hi again...

Thank you both for you responses....but (isn't there always a but?!) what you guys have written isn't exactly what I need. The problem with what you guys suggested is that if someone is looking for a part they will have to click on each part number to see a description....and there are about 500 part numbers. What I want to happen is when you click on the down arrow of the drop down menu the list looks like this:

MT0001 | Copper Cable Shield

but when you highlight and choose a selection, only the part number actually appears in the box. I am converting an access database to a intranet site that connects to access to retrieve info. The access application that was originally used to retrieve the info has a drop down menu like this.

I don't even know if this is possible to do.

Thanks again...
Rupa

(p.s. guju actor?? are we talking shah rukh khan level or no?! hehehe....)

GUJUm0deL · Jun 7, 2002

Rupa -- here ya go:

Code:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;>
<script language=&quot;javascript&quot;>
function displ()
{
  if(document.myFORM.valu.options[0].value == true) {
    return false
  }
  else {
document.myFORM.textfield.value=document.myFORM.valu.options[document.myFORM.valu.selectedIndex].value;
  }
  return true;
}
//-->
</script>

</head>

<body bgcolor=&quot;#FFFFFF&quot; text=&quot;#000000&quot;>
<table border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot; width=&quot;75%&quot;>
  <tr>
<td width=&quot;100%&quot;><form name=&quot;myFORM&quot; onClick=&quot;return displ();&quot;>
        <p> 
          <select name=&quot;valu&quot; size=&quot;1&quot;>
		    <option value>Choose One</option>
            <option value=&quot;MT001&quot;>MT0001 | Copper Cable Shield 1</option>
            <option value=&quot;MT002&quot;>MT0002 | Copper Cable Shield 2</option>
            <option value=&quot;MT003&quot;>MT0003 | Copper Cable Shield 3</option>
          </select>
          <input type=&quot;text&quot; name=&quot;textfield&quot;>
        </p>
</form>
</td>
</tr>
</table>
</body>
</html>

This has the effect you wanted (hopefully)...lol

PS -- if you mean my acting abilities, then yes Shah Rukh Kahn level, but if you mean achievement level, then no...i'm still at the struglling level; although i've had some good acting gigs...

I have not failed; I merely found 100,000 different ways of not succeding...

Rupa · Jun 7, 2002

OK, I know this is getting a little crazy....but that's still not what I need! I'm beginning to think that it's not possible! I can't have the extra text box to show the part number - I just want one box - the d.d.menu box that displays only the part number but shows the description when you click to browse the selections. Is there anything like a hidden field in d.d menus? Also is it possible to have more than one value attached to a selection? What I mean is say I have the choice MT0001. Can I have value1="MT0001" and value2="Copper Cable Shield" so that I can use form.fieldName.value1 and form.fieldName.value2 in separate areas??

Thanks a million for all your help!

(p.s. what stuff have you done?? american or indian movies or both?)

GUJUm0deL · Jun 7, 2002

Sorry, can't come up with a solution now, maybe after lunch I might be reengerized...

PS -- So far i've only done stage work (like Little Shop of Horrors, Annie, Christmas Carol, George's Room, etc...) I wanna move into films (american movies)...but that all depends on how my luck lasts... I have not failed; I merely found 100,000 different ways of not succeding...

Rupa · Jun 7, 2002

Ok - thanks a ton...again.

I've searched on the web too but I can't come up with anything. I'm going to look into changing the design of that page....if you come across something, that'd be awesome if you could let me know but don't worry about it....

Good luck with your acting....I'm def. impressed....haven't seen too many Indian actors (esp gujus) out there since Mississippi Masala....and she wasn't even good....!! But if you're in a movie....I'll def. check it out....I gotsta support my guju brothas! (I'm 1/2!)

GUJUm0deL · Jun 7, 2002

If I come across something, I will tell you...
Just so we're all clear, you want a drop down menu that shows the part number only?? Or the part number and the description??
And when the user makes an selection, and click a button, you only want the part number displayed an no description right?? And you can't have a textbox there?? Only drop down menu box??

PS -- LOL, thanks Rupa...

Your half guju?? Whas the other half (if you don't mind me asking)... I have not failed; I merely found 100,000 different ways of not succeding...

trollacious · Jun 7, 2002

You'll have to put the stock numbers and part names in with some kind of server-side scripting, since it resides in an access database. If you had an array of JS objects, like

function Part(number, name)
{
this.number=number;
this.name=name;
return this;
}

var part=new Array(), pi=0;

part[pi++]=new Part('MT0001','Copper Cable Shield');
part[pi++]=new Part('MT0002','Doofus Jammer');

etc., it'd be easy to access the information from the array.

Rupa · Jun 7, 2002

geeeez you're quick...!

i need the drop down menu that shows the part number and the description when you click on it....but when the user makes an selection, i only want the part number displayed and no description. and no textbox, only a drop-down menu.

thanks for the 10th time!

and the other 1/2 is punjabi! (the best 2 combinations if you ask me!)

GUJUm0deL · Jun 7, 2002

Rupa, ahhhh I get it now...so you only want to use one drop down box then huh?? When the page loads the descritipn and part number is shown, and when a selection is shown only the part number is shown...hmmmmmmmmmmmmmmmmmm, if you are using the access database then try trollacious' solution...but other then that i'm outta ideas...

PS -- LOL...true that, true that...

I have not failed; I merely found 100,000 different ways of not succeding...

Rupa · Jun 7, 2002

Ok...thanks for trying....

Thanks to trollacious too....I don't know if I want to get that deep into the programming of it tho! I might just end up changing the page around...especially considering it just has to work and it doesn't have to be pretty!

thanks again to both of you...

Rupa

(these smileys are the bomb....too bad they don't have these on aol!!!!!!!!!!!)

GUJUm0deL · Jun 7, 2002

Rupa, if you can have a textbox on the page then use the code I gave you...it can be acheived with less hassle...
This is how I would do it:
1) The page loads with the script I gave you
2) The user browses through it (they see the product name and description), when they make a selection (only the product name is seen now, but in the textbox) and they hit the submit button
3) The submit button passes the value from the textbox to the desired action...
Much less hassle, and easy to debug/maintain...

PS -- I agree, AOL still uses the 90's smilies...lol I have not failed; I merely found 100,000 different ways of not succeding...

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!

help with drop down menus

Rupa

Programmer

GUJUm0deL

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

BigBadDave

Programmer

GUJUm0deL

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

trollacious

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

Rupa

Programmer

GUJUm0deL

Programmer

Similar threads

Part and Inventory Search

Sponsor