Below is the link i refer to dynamically add and remove TextBoxes using JavaScript
https://www.aspsnippets.com/Articles/Dynamically-add-and-remove-TextBoxes-using-JavaScript.aspx
You can change the javascript function like below to add textbox control based on your need
function GetDynamicTextBox(value,txtcount){
var finalhtml="";
for(var i=1;i<=txtcount;i++)
{
finalhtml = finalhtml+ '<input name = "DynamicTextBox" type="text" value = "' + value + '" /> <input type="button" value="Remove" onclick = "RemoveTextBox(this)" /> <br/>'
}
return finalhtml;
}
function AddTextBox() {
var div = document.createElement('DIV');
// Variable to decide how many textbox to be added
var txtboxcount = 20;
div.innerHTML = GetDynamicTextBox("",txtboxcount);
document.getElementById("TextBoxContainer").appendChild(div);
}
Change "txtboxcount " variable value as per your need.
<script>
function GetDynamicTextBox(value) {
return '<input name = "DynamicTextBox" type="text" value = "' + value + '" />' +
'<input type="button" value="Remove" onclick = "RemoveTextBox(this)" />'
}
function AddTextBox() {
for (var i = 0; i < 20; i++) {
var div = document.createElement('DIV');
div.innerHTML = GetDynamicTextBox("");
document.getElementById("TextBoxContainer").appendChild(div);
}
}
</script>
<input id="btnAdd" type="button" value="add" onclick="AddTextBox()" />
<br />
<br />
<div id="TextBoxContainer">
<!--Textboxes will be added here -->
</div>
Output screenshot as below:
Best regard
Cathy
MSDN Community Support
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.
Member
103 Points
790 Posts
trigger multiple javascript function by single click
Jun 05, 2017 10:27 AM|kengkit|LINK
I have a javascript function use to dynamically create textbox..
it's troublesome if i need to click 20times if i want to create 20 textbox..
any idea to create multiple textbox by single click?
Below is the link i refer to dynamically add and remove TextBoxes using JavaScript
https://www.aspsnippets.com/Articles/Dynamically-add-and-remove-TextBoxes-using-JavaScript.aspx
All-Star
50831 Points
9895 Posts
Re: trigger multiple javascript function by single click
Jun 05, 2017 04:25 PM|A2H|LINK
You can change the javascript function like below to add textbox control based on your need
Change "txtboxcount " variable value as per your need.
Aje
My Blog | Dotnet Funda
Star
8670 Points
2882 Posts
Re: trigger multiple javascript function by single click
Jun 06, 2017 06:36 AM|Cathy Zou|LINK
Hi kengkit
For your problem. you could use code below:
Output screenshot as below:
Best regard
Cathy
Please remember to click "Mark as Answer" the responses that resolved your issue.
If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.