Greetings:
I am trying to develop an xhtml webpage that has a left and a right <div>; the left <div> would display the content of a different text file depending on which <input> button is pressed in a right <div>.
I tried to accomplish that by changing the "data" in an xhtml <object> dynamically, similar to changing "src" in <img>. (Is this a workable approach?) But I could not find a way to get it to work.
The code is included as follows. The webpage is divided into a left and a right <div>. The left <div>, which contains the <object>, displays the content of a text file. Upon pressing the <input> button on the right <div>, I am hoping to change the left <div> to display the content of a different text file.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr">
<head>
<title>Temp</title>
<style type="text/css">
#left {
float: left;
width: 400px;
height: 600px;
}
#right {
float: right;
width: 400px;
height: 600px;
}
</style>
<script type="text/javascript">
function newtext() {
var text_object = document.getElementById("text_object");
text_object.data = "new_text.txt";
}
</script>
</head>
<body>
<div id="left">
<object id="text_object" data="orig_text.txt" type="text/plain" width="100%" height="100%">
</object>
</div>
<div id="right">
<p>
This is the right side.
</p>
<input type="button" onclick="newtext()" value="Please press" />
</div>
</body>
</html>
I look forward to your advice.
Thanks.
Alfred
