CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

lgadex Nybegynder

31. maj 2002 - 13:07 Der er 12 kommentarer og
1 løsning

Variable værdier til celler i tabel

Kan man ved hjælp af javascript ændre bredde og højde på tabelceller?
Jeg skal bruge det til at tegne en tabel hvor nogle celler skal have en fast højde eller bredde og andre skal kunne variere i højde og bredde.
Hele tabellen skal forestille et vindue.
De celler som skal være med variable mål skal forestille selve glasset og de celler med faste mål skal forestille vinduesrammen.
Brugeren skal i nogle inputfelter definere den samlede bredde og højde på vinduet. Ud fra disse input skal tabellen skaleres så vinduet får den ønskede størrelse.

Her er et eksempel på min tabel hvor det er beskrevet hvilke celler som skal være med faste mål og hvilke som skal være med variable mål.

<table border="0" cellpadding="0" cellspacing="0">
<tr height="20">
<td rowspan="5" width="20" bgcolor="#deb887">fast<br>bredde</td>
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
<td rowspan="5" width="20" bgcolor="#deb887">fast<br>bredde</td>
</tr>
<tr>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
</tr>
<tr height="20">
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
</tr>
<tr>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
</tr>
<tr height="20">
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
</tr>
</table>

Synes godt om

medions Nybegynder

31. maj 2002 - 13:11 #1

Hmm. ja..

<script>
var intHeight = 100;
</script>
<table border="0" cellpadding="0" cellspacing="0">
<tr height="20">
<td rowspan="5" width="20" bgcolor="#deb887">fast<br>bredde</td>
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
<td rowspan="5" width="20" bgcolor="#deb887">fast<br>bredde</td>
</tr>
<tr>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
</tr>
<tr height="20">
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
</tr>
<tr>
<td height="<script>intHeight</script>>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
<td width="20" bgcolor="#deb887">fast <br>bredde</td>
<td>variabel<br>bredde <br>og højde</td>
</tr>
<tr height="20">
<td colspan="5" height="20" bgcolor="#deb887">fast højde</td>
</tr>
</table>

//>Rune

Synes godt om

jakoba Nybegynder

31. maj 2002 - 13:14 #2

Det er muligt, men noget af et mas.

Den pålidelige metode jeg kender er at skrive alle de html kommandoer der skal have en beregnet bredde med javascript.

i de sidste nye browsere er det vist også muligt at lave funktioner der sætter en attributværdi; men det er endnu så få at det ikke kan anbefales.

mvh JakobA

Synes godt om

medions Nybegynder

31. maj 2002 - 13:18 #3

jakoba> Ville mit da ik' virke? :-(

Ellers kan han gøre følgende... (det ved jeg virker)

<script language="JavaScript">
var intWidth = 100;
document.write("<table width=" + intWidth + ">")
document.write("<tr><td></td></tr>")
document.write("</table>")
</script>

//>Rune

Synes godt om

el_gnu Nybegynder

31. maj 2002 - 13:20 #4

medions => du kan ikke have tags inden i hinanden, som f.eks.

<td height="<script>intHeight</script>>

så nej, det ville ikke virke

Synes godt om

o-zone Nybegynder

31. maj 2002 - 13:23 #5

Det du kunne gøre var at have javascript variable for højde og brede, og så lade javascriptet tegne din tabel for dig (med document.write("yadayadayada"); )

Hvis/når du så vil ændre tabellens højde og brede, så ændrer du variablene, og relaoder siden med f.eks.
history.go(0); (er det ikke sådan noget i den stil??)

Synes godt om

gryn Nybegynder

31. maj 2002 - 13:40 #6

Det kan man godt lave, og jeg skal nok lave det, men det kan godt være, det først bliver i aften.

Synes godt om

lgadex Nybegynder

31. maj 2002 - 14:47 #7

Jeg har kigget på jeres svar og kommentarer og kan ikke få noget af det til at virke. Jeg har været lidt rundt på nettet og kigget efter evt. applets eller scripts, men har kun fundet et lidt for avanceret script på følgende URL:
http://javascript.internet.com/miscellaneous/table-maker-source.html
Jeg ved ikke om det er nemt at tilpasse det eller om jeg skal prøve noget mere simpelt.
//Lis

Synes godt om

o-zone Nybegynder

31. maj 2002 - 15:27 #8

hmmm... nu har jeg siddet og fiflet lidt med det, og jeg kan heller ikke få det til at virke. Jeg er nået frem til følgende (med test alerts):

---8<----------
<html>
<head>
<script language="javascript">
var row1h = 100;
var col1b = 100;
var col2b = 100;
var row2h = 100;
</script>
</head>
<body>
<script language="javascript">
function changeTable()
{
if (document.form1.formcol1b.value!="") { col1b = document.form1.formcol1b.value; }
if (document.form1.formcol2b.value!="") { col2b = document.form1.formcol2b.value; }
if (document.form1.formrow1h.value!="") { row1h = document.form1.formrow1h.value; }
if (document.form1.formrow2h.value!="") { row2h = document.form1.formrow2h.value; }
// alert("Reloader nu med værdierne:\ncol1b="+col1b+"\ncol2b="+col2b+"\nrow1h=");
alert("Reloader nu med værdierne:\ncol1b="+col1b+"\ncol2b="+col2b+"\nrow1h="+row1h+"\nrow2h="+row2h);
history.go(0);
}
</script>

<table border=1 bgcolor="cccccc">
<script language="javascript">
alert("Gentegner tabellen med værdierne:\ncol1b="+col1b+"\ncol2b="+col2b+"\nrow1h="+row1h+"\nrow2h="+row2h);
document.write("<tr height='"+row1h+"'>\n");
document.write("<td width='"+col1b+"'>\n");
document.write(" </td>\n");
document.write("<td width='"+col2b+"'>\n");
document.write(" </td></tr>\n");
document.write("<tr height='"+row2h+"'>\n");
document.write("<td> </td>\n");
document.write("<td> </td>\n");
document.write("</tr>\n");
</script>
</table>
<br>
<hr>
<br>
<form name="form1">
<script language="javascript">
alert("Gentegner formfelter med værdierne:\ncol1b="+col1b+"\ncol2b="+col2b+"\nrow1h="+row1h+"\nrow2h="+row2h);
document.write("kolonne1 brede : <input type='text' name='formcol1b' size='3' value='"+col1b+"'><br>");
document.write("kolonne2 brede : <input type='text' name='formcol2b' size='3' value='"+col2b+"'><br>");
document.write("række1 højde : <input type='text' name='formrow1h' size='3' value='"+row1h+"'><br>");
document.write("række2 højde : <input type='text' name='formrow2h' size='3' value='"+row2h+"'><br>");
</script>
<input type="button" value="byg tabellen op igen" onClick="changeTable(); return true;">
</form>
</body>
</html>
---8<----------

Det virker ikke, fordi variablene også bliver reloadet ved history.go(0);
Men det man så kunne gøre (hvis du stadig insisterer på at det er vigtigt med dynamiske cellestørrelser lavet on the fly af javascript?), var at lave en lille frame, hvor variablene ligger i, og så kun reloade hovedframen, når tabellen skal laves om. Det burde så vidt jeg kan se virke (omend det også er meget omstændigt, og kræver brug af frames (yrks!))

(-:H@zze @ department for stupid workarounds

Synes godt om

ras2000 Nybegynder

31. maj 2002 - 16:14 #9

Ellers så prøv at kigge på giffer og vml, det er noget nemmere at tegne med. Jeg har et eksempel liggende med et hus, på http://www.mucdesign.dk/hererdittag/index.asp

Synes godt om

gryn Nybegynder

02. juni 2002 - 14:09 #10

Jeg har ikke haft så meget tid, men jeg skal nok se på det senere, hvis du lader spørgsmålet stå åbent i et stykke tid.

Synes godt om

gryn Nybegynder

03. juni 2002 - 15:18 #11

Nu har jeg lavet det. http://www.grunden.dk/uis/variabelvindue.html

Det de sker er, at der er nogle div'er (de mørkegrå dimser), som du så kan ændre størrelsen på.

www.fotx.net/gryn

Synes godt om

lgadex Nybegynder

03. juni 2002 - 15:45 #12

tak for hjælpen til alle
o-zone havde noget der var rimeligt men det virkede ikke helt som det skulle - det gør gryns til gengæld.
//Lis

Synes godt om

gryn Nybegynder

03. juni 2002 - 18:31 #13

Tak for points

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23
Ajax - indlæs webside og derefter hente data Af nemlig i JavaScript	4	21/05/202417:19	22/06/202422:07
Disable button efter 1. klik Af nemlig i JavaScript	2	05/05/202415:37	05/05/202416:25

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS