/    Sign up×
Community /Pin to ProfileBookmark

how do I display tables wo reload/refresh or being added to bottom of prior tables?

Copy linkTweet thisAlerts:
Feb 15.2003

? New to JavaScript I want to display three tables on/in same window with the data able to be update for tables individually. Must be done without reload/refresh to maintain data in array. Any way to have this happen using only one page and set the functions to update without rewritting the new to the bottom of the old. Limited to using JavaScript and HTML. Or is it possible to use a function to generate seprate windows/pages(children) with sole purpose to display the generated pages. Any help accepted.?

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@LAwebTekFeb 15.2003 — try this example:

<html>

<head>

<script language="JavaScript" type="text/javascript">

function defC() {

document.getElementById('content_1').innerHTML='This is the'

+ ' text for the first div contained within table_1.<br>'

+ ' it can contain <b>HTML</b> too.'

}

function defC2() {

document.getElementById('content_2').innerHTML='This is the'

+ ' text for the second div contained within table_2.'

}

function defC3() {

document.getElementById('content_3').innerHTML='This is the'

+ ' text for the third div contained within table_3.'

+ ' it can contain <b>HTML</b> too.'

}

function redefC() {

document.getElementById('content_1').innerHTML='This is the'

+ ' new text or whatever you want to change in table 1<br>'

+ ' click table 1 button to switch back.'

}

function redefC2() {

document.getElementById('content_2').innerHTML='This is so'

+ ' cool, new text for table 2'

}

function redefC3() {

document.getElementById('content_3').innerHTML='This is really'

+ ' neat, I love dynamic content!'

}

</script>

</head>

<body>

<table border="1">

<tr>

<td><div id="content_1"> &nbsp; </div></td>

</tr>

</table>

<table border="1">

<tr>

<td><div id="content_2"> &nbsp; </div></td>

</tr>

</table>

<table border="1">

<tr>

<td><div id="content_3"> &nbsp; </div></td>

</tr>

</table>

<input type="button" value="Table 1" onClick="defC()">

<input type="button" value="Table 2" onClick="defC2()">

<input type="button" value="Table 3" onClick="defC3()">

<br>

<input type="button" value="Change 1" onClick="redefC()">

<input type="button" value="Change 2" onClick="redefC2()">

<input type="button" value="Change 3" onClick="redefC3()">

</body>

</html>
Copy linkTweet thisAlerts:
@rjr201authorFeb 15.2003 — That was helpful but I am not able to get it to work properly. Will I need to do the <div id ="content_99"></div> for each cell? ? I tried replacing my document.output with your code document.getElementById('content_1').innerHTML= outputSeatChart("SEATING CHART", Seat);

And the result was the same with the table taking the whole page. I tried resizing the the tables and the <div>. I tried removing the table tags from the output function and removing the table row/data tags from the html. The only two things I can think of is having a <div> for each cell, or putting a form into each of the three divs and seeing if it will work that way.
Copy linkTweet thisAlerts:
@LAwebTekFeb 15.2003 — Any chance you could post the whole code or give me a link to the page?
Copy linkTweet thisAlerts:
@LAwebTekFeb 15.2003 — I was wondering when Taz would pop his head up and solve this, at least I was on the right track. ?
Copy linkTweet thisAlerts:
@rjr201authorFeb 16.2003 — ? Sorry to take so long to get back. I was playing with the code. It is sloppy (don't hold that against me) I haven't put in the comments yet. What I have done is use the recomendation from LAwebTek reworking it for the cells which will be updated now I just need to rework my loops. 'm not sure how the code Taz would work with type of set up. The code is on the long size since I'm new to the field and tend to do things the hard way so it is in the attachment. Thanks for the help.?

[upl-file uuid=6475bdd2-be96-44f0-8be9-2f90201a4483 size=6kB]airmix.txt[/upl-file]
×

Success!

Help @rjr201 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...