use JS to change the display in Textbox using onSelect...
Long story short, say I want to create an online resume. I want a drop down menu to select areas from (ie skills, work history, education, etc).
By default, nothing will be selected, and there will be an empty textbox. When something is selected, I want to display that portion of a resume.
function disp_text() {
var skills = document.myform.myresume.skill;
var wh = document.myform.myresume.wh;
var edu = document.myform.myresume.edu;
var mil = document.myform.myresume.mil;
var skillsDisplay = "Some multiline text";
var whDisplay = "More Multiline Text";
var eduDisplay = "Even more multiline text";
var milDisplay = "Yet more text";
var w = document.myform.myresume.selectedIndex;
if (w = skills) {
document.write(skillsDisplay);
} else if {w = wh) {
document.write(whDisplay);
} else if (w = edu) {
document.write(eduDisplay);
} else if (w = mil) {
document.write(milDisplay);
}
}
Several problems here: How do I make the xxxDisplay variable display inside a textbox? Why isn't this working at all? :-)
I'm making a guess a to what you want to do as your original code needed work.
See the areas I commented out for some of the reasons
and note changes made to do what I assume you want to do.
Code:
<html>
<head>
<title>Resume Creator</title>
<script type="text/javascript">
// From: http://www.webdeveloper.com/forum/showthread.php?p=1021891#post1021891
function disp_text() {
/* not needed
var skills = document.myform.myresume.skill;
var wh = document.myform.myresume.wh;
var edu = document.myform.myresume.edu;
var mil = document.myform.myresume.mil;
*/
var skillsDisplay = "Some \nmultiline \ntext\n";
var whDisplay = "More \nMultiline \nText\n";
var eduDisplay = "Even more \nmultiline text\n";
var milDisplay = "Yet more \ntext\n";
/* \n added to create multiple lines of text */
var w = document.myform.myresume.selectedIndex;
if (w == 1) { document.myform.txt.value += skillsDisplay + '\n'; }
if (w == 2) { document.myform.txt.value += whDisplay + '\n'; }
if (w == 3) { document.myform.txt.value += eduDisplay + '\n'; }
if (w == 4) { document.myform.txt.value += milDisplay + '\n'; }
/* invalid checks and comparisons
and document.write can not be used after page posted
if (w = 'skill') { document.write(skillsDisplay); }
if (w = 'wh') { document.write(whDisplay); }
if (w = 'edu') { document.write(eduDisplay); }
if (w = 'mil') { document.write(milDisplay); }
*/
}
</script>
</head>
<body>
<form name="myform" action="#" method="post" onsubmit="return false">
<select name="myresume" onchange="disp_text()">
<option selected>...</option>
<option value="skill">SKILLS</option>
<option value="wh">WORK HISTORY</option>
<option value="edu">EDUCATION</option>
<option value="mil">MILITARY</option>
</select>
<br>
<!-- input type="textbox" name="txt" value="" size="50" / -->
<!-- above only show a single line, not very useful for multi-lined text -->
<textarea id='txt' name='txt' rows='10' cols='50'></textarea>
<br>
<button onclick="document.getElementById('txt').value = ''">Clear</button>
</form>
</body>
</html>
I would make further changes but wanted to keep as close to original
so you could see the problems with original script.
Thank you so much for your help! I just have one question. "if (w == 1)" Where are the variables 1, 2, 3 & 4 assigned or defined? How does the script know 1 is for skills, etc? The code definitely works great, just wanted to understand it a bit more
Thank you so much for your help! I just have one question. "if (w == 1)" Where are the variables 1, 2, 3 & 4 assigned or defined? How does the script know 1 is for skills, etc? The code definitely works great, just wanted to understand it a bit more
The 'w' variable is assigned here:
Code:
var w = document.myform.myresume.selectedIndex;
just before the series of 'if...' tests.
The 'selectedIndex' ranges from -1 (not selected at all)
to 0...n where 'n' is the number of options in the select box.
Because it is a number, the test for 'w' must be numeric
and cannot be the skills, wh, edu and mil that you originally had,
which were really assignment in the if statements; ie if (w=1).....
You could change the assignments and comparisons in your original script
to assign strings and test for strings, but you need to do one (strings) or the other (numbers).
You could also change the logic to use a 'switch' command rather than
the series of 'if...' statements that might make the code a little more readable.
Reply With Quote
Consider this ...
Originally Posted by crazyboy9807
Bookmarks