469,315 Members | 1,429 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,315 developers. It's quick & easy.

Displaying a table with inner HTML

My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?
May 5 '07 #1
9 4254
Cogito wrote on 05 mei 2007 in comp.lang.javascript:
My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?
Show the shorest working code bits of your code.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 5 '07 #2
ASM
Cogito a écrit :
My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?
try to innerHTML each table at its time in same div, no ?


<html>
<script type="text/javascript">
function showHide(what) {
while(what.tagName != 'DIV') what = what.parentNode;
var next = what.id.substring(1)*1+1;
what.className = 'hid';
document.getElementById('d'+next).className = '';
}
onload = function() {
document.getElementById('d1').className = '';
}
</script>
<style type="text/css">
div, table, td { border: 1px solid;}
div.hid { display: none; }
</style>
<div id="d1" class="hid">
<table><tr><td>1</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d2" class="hid">
<table><tr><td>2</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d3" class="hid">
<table><tr><td>3</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d4" class="hid">
<table><tr><td>4</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
</html>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
May 5 '07 #3
On 05 May 2007 08:28:56 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>Cogito wrote on 05 mei 2007 in comp.lang.javascript:
>My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?

Show the shorest working code bits of your code.
My program solves the "8 Queens problem" (Place 8 queens on chessboard
such that no two attack one another).

The program can be found in the following URL:
http://users.bigpond.net.au/blackbox/8_queens.html

The program works as I designed it. It calculates all solutions at
once. I would like to create another version that displays the first
solution then waits for a click before calculating the second solution
and displaying it on top of the previous solution, i.e., replacing the
previous solution, and so on. I'm not quite sure how to force it to
display something before completion. Ideally, I would like to force a
display of the just calculated solution in the "display" function.

The entire program is my original code except for the inner HTML
method of creating a dynamic table which I have seen in another web
program and emulated. I'm not quite sure how it works and what
stuff.innerHTML+= board;
does.
May 5 '07 #4
On 05 May 2007 08:28:56 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>Cogito wrote on 05 mei 2007 in comp.lang.javascript:
>My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?

Show the shorest working code bits of your code.
Forgot to mention, The program takes some time to calculate all
solutions so please be patient and give it some time...
May 5 '07 #5
Cogito wrote on 06 mei 2007 in comp.lang.javascript:
On 05 May 2007 08:28:56 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>>Cogito wrote on 05 mei 2007 in comp.lang.javascript:
>>My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?

Show the shorest working code bits of your code.

My program solves the "8 Queens problem" (Place 8 queens on chessboard
such that no two attack one another).

The program can be found in the following URL:
http://users.bigpond.net.au/blackbox/8_queens.html

The program works as I designed it. It calculates all solutions at
once. I would like to create another version that displays the first
solution then waits for a click before calculating the second solution
and displaying it on top of the previous solution, i.e., replacing the
previous solution, and so on. I'm not quite sure how to force it to
display something before completion. Ideally, I would like to force a
display of the just calculated solution in the "display" function.

The entire program is my original code except for the inner HTML
method of creating a dynamic table which I have seen in another web
program and emulated. I'm not quite sure how it works and what
stuff.innerHTML+= board;
does.
Why not make a piece of code that shows the problem you are having.

That surely could be done?

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 5 '07 #6
Cogito wrote:
The entire program is my original code except for the inner HTML
method of creating a dynamic table which I have seen in another web
program and emulated. I'm not quite sure how it works and what
stuff.innerHTML+= board;
does.
Assuming "stuff" is a valid reference to an element, it would assign the
innerHTML plus whatever value "board" has, to the innerHTML of "stuff."

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
May 6 '07 #7
Cogito wrote on 06 mei 2007 in comp.lang.javascript:
On 05 May 2007 08:28:56 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>>Cogito wrote on 05 mei 2007 in comp.lang.javascript:
>>My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?

Show the shorest working code bits of your code.

Forgot to mention, The program takes some time to calculate all
solutions so please be patient and give it some time...
If you stipulate my "shorest" ment "shortest"
that is not a response to my suggestion.
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
May 6 '07 #8
On Sun, 06 May 2007 00:38:43 +0200, ASM
<st*********************@wanadoo.fr.invalidwrote :
>Cogito a écrit :
>My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?

try to innerHTML each table at its time in same div, no ?


<html>
<script type="text/javascript">
function showHide(what) {
while(what.tagName != 'DIV') what = what.parentNode;
var next = what.id.substring(1)*1+1;
what.className = 'hid';
document.getElementById('d'+next).className = '';
}
onload = function() {
document.getElementById('d1').className = '';
}
</script>
<style type="text/css">
div, table, td { border: 1px solid;}
div.hid { display: none; }
</style>
<div id="d1" class="hid">
<table><tr><td>1</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d2" class="hid">
<table><tr><td>2</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d3" class="hid">
<table><tr><td>3</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
<div id="d4" class="hid">
<table><tr><td>4</td></tr></table>
<button onclick="showHide(this);">Next</button>
</div>
</html>
Looks good, thanks. I will have a go at incorporating this method into
my program to see if it does the trick for me.
May 6 '07 #9
Cogito wrote:
My program builds several tables using inner HTML. All the tables are
displayed only when the program terminates. How can I make it display
one table at a time and then wait for a click before displaying the
next table?
Being as you can't pause javascript, try changing your solve() function to take two parameters: (startRow, startCol)

Then change

display (solution);

to
display(solution, resumeStartRow, resumeStartCol);
return;

Having calculated where to take up calculations.

In display()

output the grid, and a button below it who's onclick method consists of a call to solve passing the resume row and resume column.
May 6 '07 #10

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by steventhrasher42 | last post: by
10 posts views Thread by Magnus Warker | last post: by
2 posts views Thread by =?Utf-8?B?c3R1ZGVudA==?= | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by harlem98 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.