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 Rhinorhino on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Assign a value after item is selected

Status
Not open for further replies.
Awuah

Awuah

Programmer
Joined
May 22, 2002
Messages
7
Location
US
I would appreciate some help with a select box.

I have a form that marks certain fields with an asterix to indicate they are required fields.
I would like the asterixes(if there is such a word :)) to be shown or hidden based on the selected item from the select box without submitting the form.

Regards,
 
Sort by date Sort by votes
this is pretty sloppy but give it a try

<html>
<script language=&quot;javascript&quot;>
var astTwo
function unHideL(){
if (frm.Fname.value == &quot;&quot;) {
frm.Lname.focus(); } else {
astTwo = !astTwo;
document.all.item(&quot;second&quot;, 0).style.visibility = astTwo ? &quot;&quot; : &quot;visible&quot;;
}
}
</script>
<body>
<form name=&quot;frm&quot;>
<table>
<tr>
<td colspan=&quot;3&quot; align=&quot;center&quot;> All fields with a * appearing beside them must be filled in </td>
</tr>
<tr>
<td align=&quot;right&quot;>First Name</td>
<td colspan=&quot;2&quot; align=&quot;right&quot;><input type=&quot;text&quot; name=&quot;Fname&quot; onBlur=&quot;unHideL()&quot;></td>
</tr>
<tr>
<td align=&quot;right&quot;>Last Name</td>
<td width=&quot;5&quot;><div id=&quot;second&quot; style=&quot;visibility:hidden;&quot;><font color=&quot;red&quot;>*</font></div></td>
<td align=&quot;right&quot;><input type=&quot;text&quot; name=&quot;Lname&quot;></td>
</tr>
</table>
</form>

ahh.. I'm not going to do everything for you. you still need to determine if the second value is filled in. ;)
that one should be pretty simple. check for &quot;&quot; I dare to learn more
admin@onpntwebdesigns.com
 
Upvote 0 Downvote
You can do this client-side with javascript, here is an example:
Code: 
<html>
<head>
<SCRIPT LANGUAGE=&quot;JavaScript&quot;>
<!--
function asteriskMe(elem){
	//count the number of elements named asterisk
	var spans = document.getElementsByTagName(&quot;span&quot;);
	var count = spans.length;

	//loop through them to hide the asterisks
	for(var i = 0;i < count;i++){
		if(spans[i].id.substring(0,8)=='asterisk')
			spans[i].style.display = &quot;none&quot;;
	}

	//select a set of asterisks based on the value of the selected option
	switch(elem.options[elem.selectedIndex].value){
		case &quot;blue&quot;:
			document.getElementById(&quot;asterisk1&quot;).style.display=&quot;inline&quot;;
			document.getElementById(&quot;asterisk4&quot;).style.display=&quot;inline&quot;;
			break;
		case &quot;green&quot;:
			document.getElementById(&quot;asterisk2&quot;).style.display=&quot;inline&quot;;
			document.getElementById(&quot;asterisk4&quot;).style.display=&quot;inline&quot;;
			break;
		case &quot;red&quot;:
			document.getElementById(&quot;asterisk3&quot;).style.display=&quot;inline&quot;;
			break;
		default: //do nothing, the field selected has no options.
	}
}
//-->
</SCRIPT>
<style>
	.asterisk{
		color:red;
		display:none;
	}
</style>
</head>
<body>
<select onChange=&quot;asteriskMe(this);&quot;>
	<option value=&quot;&quot;> [Select Color] </option>
	<option value=&quot;blue&quot;> Blue </option>
	<option value=&quot;green&quot;> Green </option>
	<option value=&quot;red&quot;> Red </option>
</select><br>
<span id=&quot;asterisk1&quot; class=&quot;asterisk&quot;>*</span>Why Do you like blue? <input type=&quot;text&quot; name=&quot;txtBlue&quot; value=&quot;&quot;><br>
<span id=&quot;asterisk2&quot; class=&quot;asterisk&quot;>*</span>Why Do you like Green? <input type=&quot;text&quot; name=&quot;txtGreen&quot; value=&quot;&quot;><br>
<span id=&quot;asterisk3&quot; class=&quot;asterisk&quot;>*</span>Why Do you like red? <input type=&quot;text&quot; name=&quot;txtRed&quot; value=&quot;&quot;><br>
<span id=&quot;asterisk4&quot; class=&quot;asterisk&quot;>*</span>Do you have something against red? <input type=&quot;text&quot; name=&quot;txtNotRed&quot;><br>
</body>
</html>

Hope this was understandable
-Tarwn --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---
 
Upvote 0 Downvote
Thanks a lot all. I will try your suggestions.

Regards,
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

penguinspeaks
  • Locked
  • Question Question
Return to current location on page after asp processes.
Replies
2
Views
1K
penguinspeaks
penguinspeaks
penguinspeaks
  • Locked
  • Question Question
Parse a database field that is comma delimited and input the results into another table
Replies
0
Views
724
penguinspeaks
penguinspeaks
leifoet
  • Locked
  • Question Question
How to check if a datatable is empty ?
Replies
0
Views
802
leifoet
leifoet
JScannell
  • Locked
  • Question Question
Border issue with Google Chrome on an Android phone
Replies
0
Views
751
JScannell
JScannell
leifoet
  • Locked
  • Question Question
Wrong code in a href ?
Replies
1
Views
749
leifoet
leifoet

Part and Inventory Search

Sponsor

Back
Top