paraglidersd
04-14-2009, 12:58 PM
Hi All. I have broken this problem down to its most basic element, though my real task is a bit more difficult. My situation is that I have a html page with javascript, and a javascript function that I want to populate an html div tag with (see the example below). What is happening is that the div tag is getting populated and displayed ever so quickly, then erased and replaced with the original html ouput. So, in my example below, I get the first div tag (div1) to display as the page loads (a form with a simple button). When the button is pushed, I populate the 2nd div tag (div2) with a simple text statement. It displays quickly then gets erased and the original display (from div1) is redisplayed by itself. I have zero clue why this is happening and I have tried many variations. Any ideas would be very helpful. I am not stuck on using the 'div' tags as my final solution if there is a better way.
<html>
<head>
<title>Summary Reports</title>
<script type.......>
function init_div_2()
{
document.getElementById('div2').innerHTML=
'<p>this is div 2</p>';
}
</script>
</head>
<body>
<div id='div1'>
<form onsubmit='init_div_2()'><input type=submit value='run' name='run'/></form>
</div>
<div id='div2'></div>
</body>
</html>
<html>
<head>
<title>Summary Reports</title>
<script type.......>
function init_div_2()
{
document.getElementById('div2').innerHTML=
'<p>this is div 2</p>';
}
</script>
</head>
<body>
<div id='div1'>
<form onsubmit='init_div_2()'><input type=submit value='run' name='run'/></form>
</div>
<div id='div2'></div>
</body>
</html>