CODEWITHSUNDEEP
javascript
MA-Lembarki
MA-Lembarki

Reputation: 19

create a textarea dynamically with javascript

I want create textarea with javascript when I click on the "yes" radio button in a appropriate div place with id?

<div class="controls">
<input type="radio" name="name" id="optionsRadios" value="no" checked><b>NO</b>
<input type="radio" name="name" id="optionsRadios" value="yes" ><b>YES</b>
</div>
<div id="positiontext"></div>

help me

Upvotes: 0

Views: 6041

Answers (3)

anni
anni

Reputation: 288

i think you should need to do this by using gome function which are specially made for this:

<div class="controls">
<input type="radio" name="name" id="optionsRadios" value="no"  checked><b>NO</b>
<input type="radio" name="name" id="optionsRadios" value="yes" onclick="addtxt();" ><b>YES</b>
</div>
<div id="positiontext"></div>

javascript:

var addtxt = function(){
 var positiontext(parent) = document.getElementById("positiontext");
 var textarea(child) = document.createElement("textarea");
     textarea(child).addAttribute("style", "(some properties)") //there are other ways also to add some attribute but for now use this

positiontext(parent) .appendChild("textarea(child)")
}

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388316

Instead of creating & removing the textarea, I would set its display like

function nameChange(el) {
    document.getElementById('positiontext').style.display = el.value == 'yes' ? '' : 'none';
}
<div class="controls">
    <input type="radio" name="name" id="optionsRadios" value="no" onchange="nameChange(this)" checked /><b>NO</b>
    <input type="radio" name="name" id="optionsRadios" value="yes" onchange="nameChange(this)" /><b>YES</b>
</div>
<div id="positiontext" style="display: none;">
    <textarea name=""></textarea>
</div>

Upvotes: 1

VPK
VPK

Reputation: 3090

Try this by adding the onclick event to the yes radio button,

<input type="radio" name="name" id="optionsRadios" value="yes" onchange="addDIV()">

In javascript,

<script>
function addDIV() {
    document.getElementById('positiontext').innerHTML = "<input type='textarea' name='myText' />"
}
</script>

FIDDLE DEMO

Upvotes: 0

Related Questions