Reputation: 23
I want to trigger an event with a button that changes the visibility of a set of elements (inputs of type text and button) from hidden to visible. Now everytime I click on the triggering button, I want a new set of the same elements to appear on a new line. How can that be done? Here is a snippet of the code:
<script type="text/javascript">
function generatenew()
{
document.add.property1.style.visibility="visible";
document.add.button2.style.visibility="visible";
document.add.button3.style.visibility="visible";
document.add.button4.style.visibility="visible";
}
</script>
</head>
<body>
<form name='add' method="post" action="">
<div id="div"></div>
<input type="button" value="+Add" onclick="generatenew();">
<input type="button" value="Edit" name="button2" style="visibility:hidden">
<input type="text" style="visibility:hidden" size="50" name="property1" placeholder="<street> <city> <ZIP> <country> <lockunitID>">
<input type="button" style="visibility:hidden" name="button3" value="open main door">
<input type="button" style="visibility:hidden" name="button4" value="open apartment door">
<div id="abc"><input type="button" value="save"></div>
Upvotes: 0
Views: 109
Reputation: 11609
If I well understood your question, all you have to do is putting a function that is triggered by an onClick event, (element.onClick=function();
) You put all your input type tags in the function, and then you end your function bay calling appendChild method so that each click triggers the display of your elements.
Upvotes: 1