0

hi there . im new here and also in developing a site using php.

if could anyone give me an idea for for adding a textarea after a others value was selected on select(dropdown)


ohh i can explain it clear. ok im just gonna give a sample

http://ph.jobstreet.com/myjobstreet/registration.htm

when you go to this section :Field of Study: a new textbox will appear after selecting the [others]


i try to use jquery but its too much complicated for me. :/


:) hope this will do. and you guy can help me .

:)thanx

4
Contributors
9
Replies
11
Views
8 Years
Discussion Span
Last Post by muralikalpana
0

It can be done, with javascript alone, cal some function which changes the display property of the textarea you want on select of the select list.
Start coding it, and post the code if you stuck up somewhere.we will like to help you working this.
:)

0

found few code here ///////
///

var arrInput = new Array(0);
  var arrInputValue = new Array(0);

function addInput() {
  arrInput.push(arrInput.length);
  arrInputValue.push("");
  display();
}

function display() {
  document.getElementById('parah').innerHTML="";
  for (intI=0;intI<arrInput.length;intI++) {
    document.getElementById('parah').innerHTML+=createInput(arrInput[intI], arrInputValue[intI]);
  }
}

function saveValue(intId,strValue) {
  arrInputValue[intId]=strValue;
}  

function createInput(id,value) {
  return "<input type='text' id='test "+ id +"' onChange='javascript:saveValue("+ id +",this.value)' value='"+ value +"'><br>";
}

function deleteInput() {
  if (arrInput.length > 0) { 
     arrInput.pop(); 
     arrInputValue.pop();
  }
  display(); 
}

//// body tags//////

<p id="parah">Click below to dynamically create/remove input boxes in this field</p>

<a href="javascript:addInput()">Add more input field(s)</a><br>
<a href="javascript:deleteInput()">Remove field(s)</a>

/////////////////////

i hope you can help me with this. if only this can only add 1 text box

thnx

Edited by peter_budo: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks)

0

Its more advanced than what you need, you just need the simple script like below -

function showTextbox()
{
	var val = document.getElementById('sel').value;
	//alert(val+">>");
	if(val==4)
	{
		document.getElementById('txt').style.display = 'inline';
	}
}

</script>
</head>
<body>
<form id="frm" name="frm">
<select id="sel" name="sel" onchange="showTextbox();" >
<option value="1" >China</option>
<option value="2" >India</option>
<option value="3" >Pakistan</option>
<option value="4" >Others</option>
</select>
<textarea id="txt" name="txt" rows="5" style="height:auto; width:auto; border-collapse:collapse; display:none;" >
</form>
</body>
</html>

if you want to toggle the visibility of the textarea, you can experiment the function as-

function showTextbox()
{
	var val = document.getElementById('sel').value;
	//alert(val+">>");
	if(val==4)
	{
		var current =  document.getElementById('txt').style.display;
		if(current == 'none'){ document.getElementById('txt').style.display = 'inline'; }
		if(current == 'inline'){ document.getElementById('txt').style.display = 'none'; }
	}
}

Edited by network18: n/a

0

hi there network18 thank you very much for your the idea

pls check. it does work. but im not sure in other browser.


thnx :)

<html>
<head>
<title>Drop DOwn and Textbox</title>
<script language="javascript">
function displ()
{
  
  if(document.getElementById('sel').value == 'others') {
     document.getElementById('txt').style.display = 'inline';
  }
  else {
	document.getElementById('txt').style.display = 'none';
	return false
  }
  return true;
}
//-->
</script>

</head>

<body bgcolor="#FFFFFF" text="#000000">
<table border="0" cellspacing="0" cellpadding="0" width="75%">
  <tr>
<td width="100%"><form name="myFORM" >
        <p> 
          <select name="sel" id="sel" size="1" onChange="return displ();">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="others">others</option>
          </select>
         <input  type="text" id="txt" name="txt" rows="5" style="height:auto; width:auto; border-collapse:collapse; display:none;" >
        </p>
</form>
</td>
</tr>
</table>
</body>
</html>
0

no its fine, it should work in any browser, not much complicated javascript actually.
Still if you get any error, just post that here from your error console

0

this should do it for you, i had the same problem a while back
set your 'select' to have an id of 'cat', when you select a value, it will check which value you have selected - if that equates to new, it will make the text box 'newcat' to visible - exactly what network 18 suggested,

window.onload = initForm;

function initForm(){
	document.getElementById('cat').selectedIndex = 0;
	document.getElementById('cat').onchange = showHideBox;
}

function showHideBox(){
	
	var whichForm = document.getElementById('cat');
	var theForm = whichForm.options[whichForm.selectedIndex].value;
	if(whichForm.options[whichForm.selectedIndex].value == 'new'){
		document.getElementById('newcat').style.display='';
	}
	else{
		document.getElementById('newcat').style.display='none';
	}
	
}
0

hi there . im new here and also in developing a site using php.

if could anyone give me an idea for for adding a textarea after a others value was selected on select(dropdown)


ohh i can explain it clear. ok im just gonna give a sample

http://ph.jobstreet.com/myjobstreet/registration.htm

when you go to this section :Field of Study: a new textbox will appear after selecting the [others]


i try to use jquery but its too much complicated for me. :/


:) hope this will do. and you guy can help me .

:)thanx

hi....dis is murali....i think ur task is over..but i have a small doubt....plz help me...
i selected "others" in "Field of Study". after that user entering value in text box.....and submited that form ...ok...
after that user want to edit that value...how he edits that value.....
{ i have this problem...thats y i am asking..frnd........i have done same like this....but user enters value in textbox that value displays in admin side with status "zero".....when ever admin change that status "one" after that value comes in select box in userside.........for suppose admin not changed status='1', so that will not appear in dropdown....in that time user wants to edit that value.....so how he can edit.....
that is my problem........i think my problem is understood...........

0

http://ph.jobstreet.com/myjobstreet/registration.htm

hi....dis is murali....2days back u solved one problem in above page..but i have a small doubt....plz help me...y b'coz i have also same problem.....
i selected "others" in "Field of Study". after that user entering value in text box.....and submited that form ...ok...
after that user want to edit that value...how he edits that value.....
{ i have this problem...thats y i am asking..frnd........i have done same like this....after user enters value in textbox that value displays in admin side with status "zero".....when ever admin change that status "one" after that value comes in select box in userside.........for suppose admin not changed status='1', so that will not appear in dropdown in userside....in that time user wants to edit that value.....so how he can edit.....
that is my problem........i think my problem is understood by u...........

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.