I have 4 input text fields which I want to have them copy to a text area, I have tried to do the same as make each copy to a seperate text input field, but that did not work.
My code is as follows:
<fieldset>
<legend>Page Message:</legend>
<div class="textarey">
<input type="text" class="lookalike" id="message_text1" name="message_text1" onkeyup="copy_data(this); if(this.value.length>=24) document.editPage.message_text2.focus()" style="text-decoration:ltr;" value="<?php echo $page['message_text']; ?>" size="38" maxlength="24"><br>
<input type="text" id="message_text2" name="message_text2" maxlength="24" size="38" class="lookalike" style="text-decoration:ltr;" value="<?php echo $page['message_text']; ?>" onkeyup="copy_data(this); if(this.value.length>=24) document.editPage.message_text3.focus()"><br>
<input type="text" id="message_text3" name="message_text3" maxlength="24" size="38" class="lookalike" style="text-decoration:ltr;" value="<?php echo $page['message_text']; ?>" onkeyup="copy_data(this); if(this.value.length>=24) document.editPage.message_text4.focus()"><br>
<input type="text" id="message_text4" name="message_text4" size="42" class="lookalike" style="text-decoration:ltr;" value="<?php echo $page['message_text']; ?>" onkeyup="copy_data(this)">
</div>
<textarea id="message" /><?php echo $page['message']; ?></textarea>
And the Javascript that copies from the fields is here:
function copy_data(val){
var messageText = document.getElementById(val.id).value
document.getElementById('message').innerHTML = messageText;
}
My issue is that every time a textfield gets to the end of it's maxchars it clears the text area. Anyone have any ideas here?
Thanks