Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Displaying a table with inner HTML

Reply
Thread Tools

Displaying a table with inner HTML

 
 
Cogito
Guest
Posts: n/a
 
      05-05-2007
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?
 
Reply With Quote
 
 
 
 
Evertjan.
Guest
Posts: n/a
 
      05-05-2007
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)
 
Reply With Quote
 
 
 
 
ASM
Guest
Posts: n/a
 
      05-05-2007
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é
 
Reply With Quote
 
Cogito
Guest
Posts: n/a
 
      05-05-2007
On 05 May 2007 08:28:56 GMT, "Evertjan."
<> wrote:

>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.
 
Reply With Quote
 
Evertjan.
Guest
Posts: n/a
 
      05-05-2007
Cogito wrote on 06 mei 2007 in comp.lang.javascript:

> On 05 May 2007 08:28:56 GMT, "Evertjan."
> <> wrote:
>
>>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)
 
Reply With Quote
 
Cogito
Guest
Posts: n/a
 
      05-05-2007
On 05 May 2007 08:28:56 GMT, "Evertjan."
<> wrote:

>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...
 
Reply With Quote
 
-Lost
Guest
Posts: n/a
 
      05-06-2007
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.
 
Reply With Quote
 
Evertjan.
Guest
Posts: n/a
 
      05-06-2007
Cogito wrote on 06 mei 2007 in comp.lang.javascript:

> On 05 May 2007 08:28:56 GMT, "Evertjan."
> <> wrote:
>
>>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)
 
Reply With Quote
 
Cogito
Guest
Posts: n/a
 
      05-06-2007
On Sun, 06 May 2007 00:38:43 +0200, ASM
<> wrote:

>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.
 
Reply With Quote
 
TheBagbournes
Guest
Posts: n/a
 
      05-06-2007
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.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Displaying oracle table in jsp as a html table Sameer Java 1 10-26-2007 01:17 PM
failing to instantiate an inner class because of order of inner classes Pyenos Python 2 12-27-2006 11:19 PM
row bottom border in inner table not matching up with row border in outer table phl HTML 1 06-08-2006 03:43 PM
hot to align inner table cols with outer table cols phl HTML 2 05-23-2006 10:58 AM
inner classes in python as inner classes in Java Carlo v. Dango Python 14 10-19-2003 08:49 AM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57