PDA

View Full Version : dropdown list & text in the textarea



shumonira
11-22-2016, 06:23 PM
hi I have a dropdown list where I can choose the country from that list. I want to select a country from that list & few default details will come up in the text area automatically.
here I include the code.


<tr>
<td>Country</td>
<td>
<select>
<option value="country">Please select country</option>
<option value="us">United States</option>
<option value="uk">United Kingdom</option>
<option value="jp">Japan</option>
</select>
</td>


this is the dropdown list where I can choose a country from there. Below is the code for text area.


<tr>
<td>Country Details:</td>
<td><textarea disabled rows="4" cols="50" name="comment" >The U.S. is a country of 50 states covering a vast swath of North America, with Alaska in the northwest and Hawaii extending the nation’s presence into the Pacific Ocean.</textarea>
</tr>
<tr>
<td>Country Details:</td>
<td><textarea disabled rows="4" cols="50" name="comment" >The United Kingdom, made up of England, Scotland, Wales and Northern Ireland, is an island nation in northwestern Europe. England – birthplace of Shakespeare and The Beatles.</textarea>
</tr>
<tr>
<td>Country Details:</td>
<td><textarea disabled rows="4" cols="50" name="comment" >Japan is an island country in East Asia. Located in the Pacific Ocean, it lies to the east of the Sea of Japan, the East China Sea, China, Korea and Russia, stretching from the Sea of Okhotsk in the north to the East China Sea and Taiwan in the southwest.</textarea>
</tr>
I did figured out something so far. but this is different.
here is the code for selecting one option & it shows the same text in the text box but I need some specific data to be showed in the text area.

<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#drp_dwn").change(function () {
var str = "";
$("select option:selected").each(function () {
str += $(this).text() + " ";
});
$("textArea").text(str);
}).change();
});
</script>

</head>
<body>
<div>Dropdown:
<select name="dropDown" id="drp_dwn">
<option>One you are the one</option>
<option>Two not really</option>
<option>Three my bad</option>
</select><br><br>

Text Area:<br>
<textarea rows="4" cols="50" id="textArea"></textarea>
</div>
</body>
</html>

please help me, I need help.

Thank you