cool_username
cool_username

Reputation: 23

Triggering events in html using same button

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

Answers (1)

epsilones
epsilones

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

Related Questions