Post by Core on Jul 12, 2009 14:44:54 GMT -5
Well I've been working on a new demo for TableSkirt but at the moment I'm stalled on an interesting issue.
For reasons unbeknown to me, Dynamic changes with javascript 'onclick' cause a 'screen refresh' with RunBasic. Apply the same code to a basic HTML page and things work fine.
This came about because I was building a 'miniEditor' via the Yahoo YUI library 'Panel' control for the demo.
Below are two version of the test code I am using.
Code box 1 is typical HTML this can be copy/pasted into you fav. editor, mine is Aptana studio. Save the file with a .html extension and open it in your browser. It works fine.
Code box 2 is the same code modified to run with RB. Copy/paste into RB editor and view it 'Full Screen'. Publish makes no difference.
The RB version causes a 'screen refresh' with the JS 'onclick' event.
CODE BOX 1
CODE BOX 2
Any ideas?
For reasons unbeknown to me, Dynamic changes with javascript 'onclick' cause a 'screen refresh' with RunBasic. Apply the same code to a basic HTML page and things work fine.
This came about because I was building a 'miniEditor' via the Yahoo YUI library 'Panel' control for the demo.
Below are two version of the test code I am using.
Code box 1 is typical HTML this can be copy/pasted into you fav. editor, mine is Aptana studio. Save the file with a .html extension and open it in your browser. It works fine.
Code box 2 is the same code modified to run with RB. Copy/paste into RB editor and view it 'Full Screen'. Publish makes no difference.
The RB version causes a 'screen refresh' with the JS 'onclick' event.
CODE BOX 1
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<script type = 'text/javascript'>
function clicker()
{
document.getElementById('panel').innerHTML = 'Show Panel was clicked';
}
function clicker2()
{
document.getElementById('panel').innerHTML = 'Hide Panel was clicked';
}
</script>
<div id = 'container'>
<button id = 'show1'>Show Panel</button>
<button id = 'hide1'>Hide Panel</button>
</div>
<div id = 'panel'>
<p>This text SHOULD change when a button is clicked if you see this line again after pressing the buttons the screen was refreshed</p>
</div>
<script type = 'text/javascript'>
var target = document.getElementById('show1');
target.onclick = clicker;
var target2 = document.getElementById('hide1');
target2.onclick = clicker2;
</script>
</body>
</html>
CODE BOX 2
html "</div>
<script type = 'text/javascript'>
function clicker()
{
document.getElementById('panel').innerHTML = 'Show Panel was clicked';
}
function clicker2()
{
document.getElementById('panel').innerHTML = 'Hide Panel was clicked';
}
</script>
<div id = 'container'>
<button id = 'show1'>Show Panel</button>
<button id = 'hide1'>Hide Panel</button>
</div>
<div id = 'panel'>
<p>This text SHOULD change when a button is clicked if you see this line again after pressing the buttons the screen was refreshed</p>
</div>
<script type = 'text/javascript'>
var target = document.getElementById('show1');
target.onclick = clicker;
var target2 = document.getElementById('hide1');
target2.onclick = clicker2;
</script>"
Any ideas?