/    Sign up×
Community /Pin to ProfileBookmark

Drop down list

Copy linkTweet thisAlerts:
Mar 04.2003

Hi
I am wondering how to make a drop-down list of people that when someone chooses a perosn, this person’s contact information is displayed on a textarea on the same form.

So, I need a form with two thing:
a list of people
a textarea for displaying the contact information of the selected person.

Thanks

to post a comment
JavaScript

9 Comments(s) ↴

Copy linkTweet thisAlerts:
@JonaMar 04.2003 — Erhem... let's see if this works...

<i>
</i>&lt;html&gt;&lt;head&gt;&lt;title&gt;Testing...&lt;/title&gt;
&lt;script&gt;
function addIt(){
var box = document.frm.slct[document.frm.slct.options.selectedIndex].value;
document.frm.list.value=box
}
&lt;/script&gt;&lt;/head&gt;
&lt;body&gt;&lt;form name="frm"&gt;
&lt;select size="1" name="slct" onchange="addIt()"&gt;
&lt;option selected value="jon doe"&gt;Jon Doe
&lt;option value="jane doe"&gt;Jane Doe
&lt;option value="avery smith"&gt;Avery Smith
&lt;/select&gt;&lt;br&gt;
&lt;textarea name="list"&gt;&lt;/textarea&gt;
&lt;/form&gt;&lt;/body&gt;&lt;/html&gt;
Copy linkTweet thisAlerts:
@kareemauthorMar 04.2003 — Thank you!

It really does the job.

I wonder can I add a button that wehn clicked it prints all names with the related contacts information.
Copy linkTweet thisAlerts:
@AdamBrillMar 04.2003 — Try taking a look at this:
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Testing...&lt;/title&gt;
&lt;script&gt;
people = new Array("John Doe","[email protected]",
"Jane Doe","[email protected]");
function addIt(){
document.frm.list.value=people[document.frm.slct.options.selectedIndex*2+1];
}
function create(){
x=0;
while(people[x]){
var oOption = document.createElement("OPTION");
document.frm.slct.options.add(oOption);
oOption.innerText = people[x];
oOption.value = people[x];
x+=2;
}
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="create(); addIt();"&gt;
&lt;form name="frm"&gt;
&lt;select size="1" name="slct" onchange="addIt()"&gt;
&lt;/select&gt;
&lt;br&gt;
&lt;textarea name="list"&gt;
&lt;/textarea&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
I think that might be closer to what you need. Let me know...
Copy linkTweet thisAlerts:
@kareemauthorMar 04.2003 — Thanks. It is the same thing. No additions from the previous. It has only a list of people and the text area.
Copy linkTweet thisAlerts:
@AdamBrillMar 04.2003 — The difference is it now has a description of the people that it puts in the textarea. Right now it is only their e-mail, but you could put whatever in there. You have to change it up in the array. I thought that might be closer to what you were looking for...
Copy linkTweet thisAlerts:
@kareemauthorMar 04.2003 — Thank you. I think I am not telling you waht I want clearly. I admit that both of scripts help me out with the later being more flexible. Now, if possible, I need to have a buttom that when clicked, it prints all listed names and thier contacts on a html page that can be sent to a printer. The button might be titled as "Print All" ....

Thanks
Copy linkTweet thisAlerts:
@AdamBrillMar 04.2003 — I'm sorry... I didn't read your post very well... :o But, try looking at this code, I think this might be closer to what you want. When clicked it sends them to a printer friendly page. Let me know what you think...
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Testing...&lt;/title&gt;
&lt;script&gt;
people = new Array("John Doe","[email protected]",
"Jane Doe","[email protected]");
function addIt(){
document.frm.list.value=people[document.frm.slct.options.selectedIndex*2+1];
}
function create(){
x=0;
while(people[x]){
var oOption = document.createElement("OPTION");
document.frm.slct.options.add(oOption);
oOption.innerText = people[x];
oOption.value = people[x];
x+=2;
}
}
function printAll(){
x=0;
document.write("&lt;html&gt;");
document.write("&lt;head&gt;");
document.write("&lt;/head&gt;");
document.write("&lt;body&gt;");
document.write("&lt;table&gt;");
document.write("&lt;tr&gt;");
document.write("&lt;td style='width:100px;'&gt;");
document.write("Names:");
document.write("&lt;/td&gt;");
document.write("&lt;td&gt;");
document.write("Contact Info.");
document.write("&lt;/TD&gt;");
document.write("&lt;/TR&gt;");
while(people[x]){
document.write("&lt;tr&gt;");
document.write("&lt;td&gt;");
document.write(people[x]);
document.write("&lt;/td&gt;");
document.write("&lt;td&gt;");
document.write(people[x+1]);
document.write("&lt;/td&gt;");
document.write("&lt;/tr&gt;");
x+=2;
}
document.write("&lt;/table&gt;");
document.write("&lt;/body&gt;");
document.write("&lt;/html&gt;");
}
function go()
{
window.open("test.htm");
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="create(); addIt();"&gt;
&lt;form name="frm"&gt;
&lt;select size="1" name="slct" onchange="addIt()"&gt;
&lt;/select&gt;
&lt;br&gt;
&lt;textarea name="list" rows="1" cols="20"&gt;
&lt;/textarea&gt;
&lt;input type=button value="Print All" onclick=printAll();&gt;
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;

I tried to make it automatically print, but couldn't get it to work. It had something to do with the document.print, I think. Sorry...
Copy linkTweet thisAlerts:
@JonaMar 04.2003 — Adam, can't you just do window.print() ?
Copy linkTweet thisAlerts:
@AdamBrillMar 04.2003 — Well, that's what I was trying to do, but, it appears that you can't use window.print if you use document.write in the window. Some weird security thing I guess. I almost went totally crazy trying to get it to work. ?
×

Success!

Help @kareem spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...