473,246 Members | 1,450 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,246 software developers and data experts.

Flickering while updation of Table using the XML tag flickers

Hi

I am running a client side javascript timer to periodically refresh the
contents of some tables in the HTML page. The table values are
dynmically binded from XML DOM object using the <XML tag in HTML>. The
data is getting updated properly. but whenever the value is refreshed,
the HTML page flickers. How do i avoid this flickering..

below is my html page
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language=Javascript>
var xmlDso;
function go()
{

//eval('xmlDso=dsobook.XMLDocument');
eval('xmlDso=dsobook.XMLDocument');
xmlDso.load("operlayout_ticker.xml");

setTimeout('go();',2000);

}
</script>
</HEAD>

<BODY >
<object id="dsobook"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0"
height="0"></object>
<div style="position: absolute; top: 60;
left:15;height:100;width:300;z-index=-1">
<table border="0" cellpadding="0" cellspacing="0" bordercolor="#111111"
style="border-collapse: collapse" width="99%" datasrc="#dsobook"
datafld="ACU">
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0"
bordercolor="#111111" style="border-collapse: collapse" width="99%"
datasrc="#dsobook" datafld="Eq1">
<tr><td>
<table border="1" cellpadding="0" cellspacing="0"
bordercolor="#111111" style="border-collapse: collapse" width="99%"
datasrc="#dsobook" datafld="Devstatus">
<tr>
<td width="113%" bgcolor="#FFFFFF" align="center" colspan="2">
<b><font face="Arial" size="1">ACU Parameters</font></b></td>
</tr>
<tr>
<td width="8%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1">TrackingMode</font></td>
<td width="105%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1"><span
datafld="TrackingMode"></span></font></td>
</tr>
<tr>
<td width="45%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1">Submode</font></td>
<td width="31%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1"><span
datafld="Submode"></span></font></td>
</tr>
<tr>
<td width="45%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1">CurrentTarget</font></td>
<td width="31%" bgcolor="#FFFFFF" align="center">
<font face="Arial" size="1"><span
datafld="CurrentTarget"></span></font></td>
</tr>

</table>

</td></tr></table>
</td>
</tr>
</table>
</div>
</BODY>

<script language="JavaScript">
new go();
</script>
</HTML>

And the XML file is:
<?xml version="1.0" ?>
<Operation>
<ACU>
<Eq1>
<DevStatus TrackingMode="Move To Nominal Longitude" Submode="Holding
Target Postion" CurrentTarget="1" Console="Supervisor" Azimuth="94.85
degrees" Elevation="4.85 degrees" Polarization="-6.8 degrees"
SignalLevel="-16.0dB" />
<AlarmState CurrentState="1" />
</Eq1>
</ACU>
</Operation>

Sep 26 '05 #1
3 2404
va*********@gmail.com wrote:
Hi

I am running a client side javascript timer to periodically refresh the
contents of some tables in the HTML page. The table values are
dynmically binded from XML DOM object using the <XML tag in HTML>. The
data is getting updated properly. but whenever the value is refreshed,
the HTML page flickers. How do i avoid this flickering..
I don't think you can, it seems to be a 'feature' of how IE updates
using the method you've employed. It is only marginally better than
using something like <META HTTP-EQUIV="Refresh" CONTENT="02"> and
changing the source HTML file. Your method is also IE-only and is
unlikely to work in other browsers (it doesn't work in Firefox).

You'd be much better off using JSON or XMLhttpRequest or similar. A few
hints below.

<URL:http://www.crockford.com/JSON/index.html>


below is my html page
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language=Javascript>
Language is depreciated, type is required:

<script type="text/javascript">
var xmlDso;
function go()
{

//eval('xmlDso=dsobook.XMLDocument');
eval('xmlDso=dsobook.XMLDocument');
There is almost never a need for eval, just don't use it.

var xmlDso=dsobook.XMLDocument;
xmlDso.load("operlayout_ticker.xml");
The format of your XML file is essentially name/value pairs. You'd be
better off using JSON or similar, a different layout is given below that
works more widely as it makes the values available as the content of
elements rather than the attributes of a single element.

[...] <table border="0" cellpadding="0" cellspacing="0"
bordercolor="#111111" style="border-collapse: collapse" width="99%"
datasrc="#dsobook" datafld="Eq1">
<tr><td>
<table border="1" cellpadding="0" cellspacing="0"
bordercolor="#111111" style="border-collapse: collapse" width="99%"
datasrc="#dsobook" datafld="Devstatus">
<tr>
<td width="113%" bgcolor="#FFFFFF" align="center" colspan="2">
<b><font face="Arial" size="1">ACU Parameters</font></b></td>
</tr>
All of that style stuff embedded in the HTML can be replaced with CSS to
hugely reduce the size of your HTML file.

[...]
</table>
</div>
</BODY>

<script language="JavaScript">
new go();
</script>
</HTML>


That is invalid HTML - script elements can only appear in the head or
body, not between the end of the body and the closing HTML tag. I
presume browser error-correction comes into play here and moves the
script element back into the body.

Below is a script that will work in both IE and Firefox. I still has
your original stuff in it (cleaned up) plus a second table with a manual
update using DOM. You could automate it the same way as the go()
function is run using setTimeout.

The HTML does not validate, but if you remove all IE specific stuff it will.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> xml play</title>

<style type="text/css">
body {
font-family: arial, sans-serif;
font-size: 90%;
}

table {
border-collapse: collapse;
border-top: 1px solid #666666;
border-left: 1px solid #666666;
width: 99%;
}
td {
text-align: center;
border-bottom: 1px solid #666666;
border-right: 1px solid #666666;
width: 50%;
}

</style>

<script type="text/javascript">
var xmlDso;

function go()
{
xmlDso=dsobook.XMLDocument;
xmlDso.load("operlayout_ticker.xml");
setTimeout('go();',2000);
}

/* Here is the generic parse & play method */

var oLoadedXML;

function loadXML(sImportXML)
{
if( window.ActiveXObject && /Win/.test(navigator.userAgent) ) {
oLoadedXML = new ActiveXObject("Msxml.DOMDocument");
oLoadedXML.async = false;
oLoadedXML.onreadystatechange = function () {
if (oLoadedXML.readyState == 4) parseXML();
}
oLoadedXML.load(sImportXML);

} else if( document.implementation
&& document.implementation.createDocument ) {
oLoadedXML = document.implementation.createDocument("","",null) ;
oLoadedXML.async=false;
var loaded = oLoadedXML.load(sImportXML);
if (loaded) {
parseXML();
}
} else {
alert("Your browser can\'t handle this script");
return;
}
}

function parseXML()
{
var devStatus = oLoadedXML.getElementsByTagName("DevStatus")[0];
var x, n, i, j = devStatus.childNodes.length;
for (i=0; i<j; i++){
x = devStatus.childNodes[i];
if ( x.tagName && x.firstChild ) {
if ((n=document.getElementById(x.tagName))){
n.innerHTML = x.firstChild.data;
}
}
}
}

</script>
</head>

<body onload="go();">
<object id="dsobook"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39"
width="0" height="0"></object>
<table datasrc="#dsobook" datafld="ACU">
<tr>
<td>
<table datasrc="#dsobook" datafld="Eq1">
<tr>
<td>
<table datasrc="#dsobook" datafld="Devstatus">
<tr>
<td colspan="2"><b>ACU Parameters</b></td>
</tr>
<tr>
<td>TrackingMode</td>
<td><span datafld="TrackingMode"></span></td>
</tr>
<tr>
<td>Submode</td>
<td><span datafld="Submode"></span></td>
</tr>
<tr>
<td>CurrentTarget</td>
<td><span datafld="CurrentTarget"></span></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>

<!-- New table -->

<table>
<tr>
<td colspan="2"><b>ACU Parameters</b></td>
</tr>
<tr>
<td>TrackingMode</td>
<td><span id="TrackingMode"></span></td>
</tr>
<tr>
<td>Submode</td>
<td><span id="Submode"></span></td>
</tr>
<tr>
<td>CurrentTarget</td>
<td><span id="CurrentTarget"></span></td>
</tr>
</table>
<input type="button" value="Update using DOM" onclick="
loadXML('operlayout_ticker.xml');
">

</body>
</html>

And the modified XML file (which still works with your original version)
'operlayout_ticker.xml' is:
<?xml version="1.0" ?>
<Operation>
<ACU>
<Eq1>
<DevStatus>
<TrackingMode>Move To Nominal Longitude</TrackingMode>
<Submode>Holding Target Postion</Submode>
<CurrentTarget>100</CurrentTarget>
<Console>Supervisor</Console>
<Azimuth>94.85 degrees</Azimuth>
<Elevation>4.85 degrees</Elevation>
<Polarization>-6.8 degrees</Polarization>
<SignalLevel>-16.0dB</SignalLevel>
</DevStatus>
<AlarmState>
<CurrentState>1</CurrentState>
</AlarmState>
</Eq1>
</ACU>
</Operation>

[...]
--
Rob
Sep 26 '05 #2
Hello,

Mnay Thanks for your replies. I have now removed the dynamic binding
concept. The reason why i like the dynamic binding approach is that i
dont have to do any extra coding...
The reason why i gave these elements as attributes is, i will have N-
Number of Equipments, and i need to repeat all these parameters for the
N-Equipments of the same type. I thought by putting as attributes will
make the xml file more readable when i have N-DeviceType and each
device type having N-Equipments.

Now the doubt i have is there a way to represent the table elements by
TableName.ElementName. What is the standard way of doing this. For ex,i
will have the TrackingMode Field for Eq1, Eq2 etc...In that case how i
do i decode those elements from javascript without creating a unique
tagName for each equipment viz. Eq1TrackingMode, Eq2TrackingMode etc.,

if ((n=document.getElementById(x.tagName))){
n.innerHTML = x.firstChild.data;
\ <ACU>
<Eq1>
<DevStatus>
<TrackingMode>Move To Nominal Longitude</TrackingMode>
<Submode>Holding Target Postion</Submode>
<CurrentTarget>100</CurrentTarget>
<Console>Supervisor</Console>
<Azimuth>94.85 degrees</Azimuth>
<Elevation>4.85 degrees</Elevation>
<Polarization>-6.8 degrees</Polarization>
<SignalLevel>-16.0dB</SignalLevel>
</DevStatus>
<AlarmState>
<CurrentState>1</CurrentState>
</AlarmState>
</Eq1>
</ACU>


Thanks
Vanitha

Sep 27 '05 #3
va*********@gmail.com wrote:
Hello,

Mnay Thanks for your replies. I have now removed the dynamic binding
concept. The reason why i like the dynamic binding approach is that i
dont have to do any extra coding...
The reason why i gave these elements as attributes is, i will have N-
Number of Equipments, and i need to repeat all these parameters for the
N-Equipments of the same type. I thought by putting as attributes will
make the xml file more readable when i have N-DeviceType and each
device type having N-Equipments.

Now the doubt i have is there a way to represent the table elements by
TableName.ElementName. What is the standard way of doing this. For ex,i
will have the TrackingMode Field for Eq1, Eq2 etc...In that case how i
do i decode those elements from javascript without creating a unique
tagName for each equipment viz. Eq1TrackingMode, Eq2TrackingMode etc.,

if ((n=document.getElementById(x.tagName))){
n.innerHTML = x.firstChild.data;

\ <ACU>
<Eq1>
<DevStatus>
<TrackingMode>Move To Nominal Longitude</TrackingMode>
<Submode>Holding Target Postion</Submode>
<CurrentTarget>100</CurrentTarget>
<Console>Supervisor</Console>
<Azimuth>94.85 degrees</Azimuth>
<Elevation>4.85 degrees</Elevation>
<Polarization>-6.8 degrees</Polarization>
<SignalLevel>-16.0dB</SignalLevel>
</DevStatus>
<AlarmState>
<CurrentState>1</CurrentState>
</AlarmState>
</Eq1>
</ACU>

Thanks
Vanitha


You need to read your XML file and create objects, then have each object
ether display itself or give it to a function that knows how to display it.

Look at either JSON or AJAX or write your own custom XMLHttpRequest.

Incidentally, using 'Eq1' is not very good as the '1' (one) character
looks very much like 'l' (lower case L).

If you have multiple 'Eq' elements, give them a unique name or id:

<Eq1>
<id>Eq-1</id>
<DevStatus>
<TrackingMode>Move To Nominal Longitude</TrackingMode>
<Submode>Holding Target Position</Submode>
...
</Eq1>
<Eq1>
<id>Eq-2</id>
<DevStatus>
...

then you can create an element in your page with an id that matches the
name. You should give each eq element a unique ID anyway to make them
easier to identify.

How you display the values of the other attributes is up to you, you
could generate compound id's like Eq-2_TrackingMode, but that may get a
little clumsy.


--
Rob
Sep 27 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: LVande | last post by:
SQLLY challenged be gentle -- Trying to create code that will drop a table using a variable as the Table Name. DECLARE @testname as char(50) SELECT @testname = 'CO_Line_of_Business_' +...
4
by: Andre Arpin | last post by:
I am new at sql so would appreciate some help I have the name of a table in alocal variable is it possible to select this table DECLARE @name sysname SET @name = 'tblSniffedItems' PRINT...
2
by: Max | last post by:
Hi, I have the following problem. I want to insert records into one table using the combination of two other tables. Here is a simplified example: Let's say the first table has a column with...
4
by: dave | last post by:
I need to add a column to a table using code. The following works, but only for a new table. How should I change this to alter an existing table? Dim strConn Dim Catalog As New...
3
by: GL | last post by:
Hi, Is there a way to add a field to an existing table using a query of some sort (without needing to manually add a field to the table). I know how to do it with a make table query, but I have...
4
by: Nathan Sokalski | last post by:
When editing an ASP Table, Visual Studio does not allow me to edit it in Design View. This makes it harder to add elements, because I must add every element either by using Design View to create...
2
by: Laphan | last post by:
AAAAARRRRGGGGHHHH!!! Everything appears to be great in doing a web-based editor using the execCommands apart from the fact that there is no method to insert a table. I've seen somebody suggest...
5
by: SQL Learner | last post by:
Hi Alex (Kuznetsov) and All, This is to follow up with my last post, "Link two tables using partial word match". How can I UPDATE table using partial word match? How can I write a SQL statement...
5
by: Nirmala123 | last post by:
hi... I want to sort the table using combobox values. I give the code here. address.html: <html> <head> <title>Add a new entry</title> </head>
13
nabh4u
by: nabh4u | last post by:
hi, I am trying to insert multiple rows in a table using PL/SQL. I have two procedures and two tables. the first procedure gets the data from the source table, manipulates it and then sends the...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
0
by: stefan129 | last post by:
Hey forum members, I'm exploring options for SSL certificates for multiple domains. Has anyone had experience with multi-domain SSL certificates? Any recommendations on reliable providers or specific...
0
Git
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: marcoviolo | last post by:
Dear all, I would like to implement on my worksheet an vlookup dynamic , that consider a change of pivot excel via win32com, from an external excel (without open it) and save the new file into a...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.