Page 1 of 1
PHP Solution to my problem
Posted: Sun Oct 29, 2006 5:17 pm
by tommy1987
I have a page where users can enter text, I want to update another point of the page with a 'realtime' preview of this text. I know PHP will be useful but I will also need javascript or something to trigger the timer event to make it appear realtime. Also for people with a lot more experience than me at web design, could anyone tell me if my solution would be better suited to DHTML or something like that? I am new to anything other than PHP and a little Javascript so if anyone knows of any good resources or code to help me along..
Thanks very much, Tom
Posted: Sun Oct 29, 2006 5:37 pm
by Luke
Something like this?
Code: Select all
<div id="change_box"></div>
<input type="text" name="text" onchange="updateText('change_box', this)">
Code: Select all
function updateText(updateBox, formElement){
var box = document.getElementById(updateBox);
box.innerHTML = formElement.value;
}
Posted: Sun Oct 29, 2006 5:54 pm
by tommy1987
I have the following but it doesnt work, could anyone point me in the right direction?
At present you have to click outside the box for it to update, I want it so that it seems realtime
Code: Select all
<html>
<head>
<script type="text/javascript">
t=setTimeout("updateText('change_box', document.form.text)",200);
</script>
<style>
</style>
</head>
<body>
<div id="change_box"></div>
<form name="form">
<input type="text" name="text" onchange="updateText('change_box', this)">
</form>
<script type="text/javascript">
function updateText(updateBox, formElement){
var box = document.getElementById(updateBox);
box.innerHTML = formElement.value;
}
</script>
</body>
</html>
Posted: Sun Oct 29, 2006 6:16 pm
by Ollie Saunders
Code: Select all
t=setTimeout("updateText('change_box', document.form.text)",200);
becomes
Code: Select all
var timeout;
window.onload = function() {
timeout = setTimeout("updateText('change_box', document.form.text)", 200);
}