c# - How to clear the dynamically added div contents and display only the div contents? -
i have div named 'benefitsvalue' in page display set none..
<input id="radio1" type="radio" name="bunit" value="1" onclick="onsample1()" runat="server"/>sample1 <input id="radio2" type="radio" name="bunit" value="2" onclick="onsample2()" runat="server"/>sample2 <div id="benefitsvalue" style="display:none"> <table id="approvertable"> <tr id="rowtr" align="center"> <td> <input type="text" id="from" size="11" maxlength="9" class="gov-textbox" style="width: 100px;" /> </td> <td> <a id="addrangelink" class="addrange" href="javascript:;" onclick="addtextbox();">addrange</a> </td> </tr> </table> </div>
i dynamically add multiple textboxes clicking addrange..
function addrange() { var val = ""; var otable = document.getelementbyid('approvertable'); var rowcount = otable.rows.length; var row = otable.insertrow(rowcount); var cell0 = row.insertcell(0); var innerhtml; cell0.innerhtml = '<input type="text" id="from' + rowcount + '" size="11" maxlength="9" class="gov-textbox" style="width: 100px;" />'; }
if select radiobutton1
display div
content , dynamically add multiple textboxes
clicking addrange....
then once select radiobutton2
must clear newly added textboxes
of div , show me single text box
specified inside div..
i have used $("#benefitsvalue").empty();
clear contents if use $("#benefitsvalue").show()
show again displays nothing...
how overcome it?
how this?
js
function addrange() { var val = ""; var otable = document.getelementbyid('approvertable'); var rowcount = otable.rows.length; var row = otable.insertrow(rowcount); row.classname='dynamic'; var cell0 = row.insertcell(0); var innerhtml; cell0.innerhtml = '<input type="text" id="from' + rowcount + '" size="11" maxlength="9" class="gov-textbox" style="width: 100px;" />'; } function onsample1(){ $('#benefitsvalue').show(); } function onsample2(){ $('.dynamic').remove(); }
html
<input id="radio1" type="radio" name="bunit" value="1" onclick="onsample1()" runat="server"/>sample1 <input id="radio2" type="radio" name="bunit" value="2" onclick="onsample2()" runat="server"/>sample2 <div id="benefitsvalue" style="display:none"> <table id="approvertable"> <tr id="rowtr" align="center"> <td> <input type="text" id="from" size="11" maxlength="9" class="gov-textbox" style="width: 100px;" /> </td> <td> <a id="addrangelink" class="addrange" href="javascript:;" onclick="addrange();">addrange</a> </td> </tr> </table> </div>
Comments
Post a Comment