PDA

Click to See Complete Forum and Search --> : Drop down list

kareem
03-03-2003, 07:33 PM
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
Jona
03-03-2003, 07:42 PM
Erhem... let's see if this works...


<html><head><title>Testing...</title>
<script>
function addIt(){
var box = document.frm.slct[document.frm.slct.options.selectedIndex].value;
document.frm.list.value=box
}
</script></head>
<body><form name="frm">
<select size="1" name="slct" onchange="addIt()">
<option selected value="jon doe">Jon Doe
<option value="jane doe">Jane Doe
<option value="avery smith">Avery Smith
</select><br>
<textarea name="list"></textarea>
</form></body></html>
kareem
03-03-2003, 09:15 PM
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.
AdamBrill
03-03-2003, 09:52 PM
Try taking a look at this:
<html>
<head>
<title>Testing...</title>
<script>
people = new Array("John Doe","john@doe.com",
"Jane Doe","janedoe@doe.com");
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;
}
}
</script>
</head>
<body onload="create(); addIt();">
<form name="frm">
<select size="1" name="slct" onchange="addIt()">
</select>
<br>
<textarea name="list">
</textarea>
</form>
</body>
</html>
I think that might be closer to what you need. Let me know...
kareem
03-03-2003, 09:58 PM
Thanks. It is the same thing. No additions from the previous. It has only a list of people and the text area.
AdamBrill
03-03-2003, 11:02 PM
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...
kareem
03-03-2003, 11:37 PM
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
AdamBrill
03-04-2003, 11:39 AM
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...
<html>
<head>
<title>Testing...</title>
<script>
people = new Array("John Doe","john@doe.com",
"Jane Doe","janedoe@doe.com");
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("<html>");
document.write("<head>");
document.write("</head>");
document.write("<body>");
document.write("<table>");
document.write("<tr>");
document.write("<td style='width:100px;'>");
document.write("Names:");
document.write("</td>");
document.write("<td>");
document.write("Contact Info.");
document.write("</TD>");
document.write("</TR>");
while(people[x]){
document.write("<tr>");
document.write("<td>");
document.write(people[x]);
document.write("</td>");
document.write("<td>");
document.write(people[x+1]);
document.write("</td>");
document.write("</tr>");
x+=2;
}
document.write("</table>");
document.write("</body>");
document.write("</html>");
}
function go()
{
window.open("test.htm");
}
</script>
</head>
<body onload="create(); addIt();">
<form name="frm">
<select size="1" name="slct" onchange="addIt()">
</select>
<br>
<textarea name="list" rows="1" cols="20">
</textarea>
<input type=button value="Print All" onclick=printAll();>
</form>
</body>
</html>

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...
Jona
03-04-2003, 03:36 PM
Adam, can't you just do window.print() ?
AdamBrill
03-04-2003, 05:19 PM
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. :)