I have been trying to write a script that allows a user to click on a button like a plus sign to add an additional field for a phone number when they have more than one phone number to enter. I have created a script that sort of does this. It doubles up what is already there, so, the first time, everything is fine, but after that I get a lot more fields than I want. I am a php programmer and not familiar enough with javascript to get to what I want. I would appreciate some help. My script is included below. What I am doing here is retrieving the html content and then adding it to what is already there. In php I would use an if conditional test to see if the data has been retrieved. The first time it would retrieve the data into a variable. After that it would not retrieve it. I think I am getting into some scope and sequence issues here. Javascript is a bit different than php in these regards. I would love some help working out my script. Also there is a commented line in the code that asks another question about the use of variables that I don’t understand. I also tried using appendChild() here to no avail. I couldn’t get that to work at all.
Thanks – Kenoli
<html>
<head>
<script type=“text/javascript”>
var x;
function addPhone(){
if (x = ‘undefined’) {
var x = document.getElementById(‘phone’).innerHTML;
}
document.getElementById(‘phone’).innerHTML = x + “<br/>” + x;
// x = x + “<br/>” + x; Why does this expression not work here? In my understanding, it should be the same as the previous line of code.
}
function initializePage() {
var a = document.getElementById('add');
a.onclick = addPhone;
x = document.getElementById('phone').innerHTML;
}
window.onload = initializePage;
</script>
</head>
<body>
<form id=“form1” id=“form1” method=“post”>
<span id=“phone”>Phone Type: <input name=“phone_type” type=“text” size=“12” maxlength=“12” />
Phone Number: <input name=“phone_number” type=“text” size=“12” maxlength=“12” />
</span> Add phone <span id=“add” >+</span>
</form>
</body/>
</html>