Ask Question Forum:
Model Library:2025-02-08:A.I. model is online auto reply
C
O
M
P
U
T
E
R
2
8
Show
#
ASK
RECENT
←
- Underline
- Bold
- Italic
- Indent
- Step
- Bullet
- Quote
- Cut
- Copy
- Paste
- Table
- Spelling
- Find & Replace
- Undo
- Redo
- Link
- Attach
- Clear
- Code
Below area will not be traslated by Google,you can input code or other languages
Hint:If find spelling error, You need to correct it,1 by 1 or ignore it (code area won't be checked).
X-position of the mouse cursor
Y-position of the mouse cursor
Y-position of the mouse cursor
Testcursor
caretPos
Attachment:===
Asked by duncanb7
at 2024-04-10 16:05:25
ModifyPoint:500 Replies:9 POST_ID:828468USER_ID:11059
Topic:
JavaScript;;Hypertext Markup Language (HTML)
I just finish to extract csv data into two different location table by javascript with
getelementsByTagName("div")(k).
Now I would like to ask whether it is possible I can set different width of every column for different tables
If I use style table or td {} , it will update all column width globally, in other words, all column width is same
and fixed. If I go into for loop in javascript, it do update for each cell's width that will costs a lot of loop
time and huge if the table is 1000*20.
Any suggest for set different column width (for exmaple no of column is 20) by javascript or html or others ?
And table in table method and do update for each cell is final approach but I don't want to do so.
Second question how to set different table border if two tables in one html
Can I set like this
<style type="text/css">
table.[0]
{ border:3px}
table.[1]
{border:6px}
</sytle>
Please advise for two questions
Duncan
getelementsByTagName("div")(k).
Now I would like to ask whether it is possible I can set different width of every column for different tables
If I use style table or td {} , it will update all column width globally, in other words, all column width is same
and fixed. If I go into for loop in javascript, it do update for each cell's width that will costs a lot of loop
time and huge if the table is 1000*20.
Any suggest for set different column width (for exmaple no of column is 20) by javascript or html or others ?
And table in table method and do update for each cell is final approach but I don't want to do so.
Second question how to set different table border if two tables in one html
Can I set like this
<style type="text/css">
table.[0]
{ border:3px}
table.[1]
{border:6px}
</sytle>
Please advise for two questions
Duncan
html><head><style type="text/css">table{//border-collapse:collapse;//border:1px solid black;}td{width:100px;text-align : center;}</style></head><body onload="test()" style="background-color:#e0ffff"><script>// http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q__26619334.htmlfunction getData( url ,k){ var request = new XMLHttpRequest(); request.onreadystatechange = function() { if ( request.readyState == 4 ) { renderData( request.responseText,k ); } } request.open( "GET", url, true ); request.send( null );}function renderData( data ,k){var mybody= document.getElementsByTagName("div")[k]; var dataRows = data.split( "" ); var table2 = document.createElement("Table"); //table2.border = 1; for( i = 0; i < 3; i++ ) { var tableRow = table2.insertRow(i); var dataCells = dataRows[i].split(","); for( j = 0; j < dataCells.length; j++ ) { var tableCell= tableRow.insertCell(j); tableCell.innerHTML = dataCells[j]; } }//document.write(document.getElementsByTagName("body")[0].nodeName); mybody.appendChild( table2 );}function test () { getData("http://www.mydomian.com/book7.csv?r=1264",0 ); getData("http://www.mydomain.com/postcodes.csv?r=1264",1 );}</script><table><tr><td>start</td></tr></table><div id="mytable" ></div><table><tr><td>middle</td></tr></table><div></div><table><tr><td>1234</td></tr></table></body></html> 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:58:59:60:61:62:63:64:65:66:67:68:69:70:71:72:73:74:75:76:77:78:79:80:81:82:83:84:85:86:87:88:89:90:91:92:93:94:95:96:97:98:99:100:101:102:
Attachment:Book7.csvpostcodes.csv
Expert: Dave Baldwin replied at 2024-04-10 19:05:07
Glad you got it working and happy to help.
Author: duncanb7 replied at 2024-04-10 18:42:52
Thanks for your reply to
trigger the final answer
trigger the final answer
Author: duncanb7 replied at 2024-04-10 18:42:23
Just adding the following code to change individual column's width
var mytag=document.createElement("colgroup");
mytag.setAttribute("span", "1");
mytag.setAttribute("width", "500");
table2.appendChild(mytag );
So both question is sovled in FIrefox
var mytag=document.createElement("colgroup");
mytag.setAttribute("span", "1");
mytag.setAttribute("width", "500");
table2.appendChild(mytag );
So both question is sovled in FIrefox
Expert: Dave Baldwin replied at 2024-04-10 18:07:58
Oh, good. I don't know, I never create tables with javascript, especially setting the attributes.
Author: duncanb7 replied at 2024-04-10 17:49:09
Yes, your right, I can set different border after adding
table2.setAttribute("class", "one"+k); in javascript code above
It solved the second question.
Any idea for first question ?
table2.setAttribute("class", "one"+k); in javascript code above
It solved the second question.
Any idea for first question ?
Author: duncanb7 replied at 2024-04-10 17:25:16
I try
table2.classname="one";
or
mytable.classname="one";
that is no different at all
Please advise
table2.classname="one";
or
mytable.classname="one";
that is no different at all
Please advise
Author: duncanb7 replied at 2024-04-10 17:11:57
Is it
table2.classname=1;
in javascript code above
table2.classname=1;
in javascript code above
Author: duncanb7 replied at 2024-04-10 17:07:59
but how can I put class="one" inside <table> tag of table 1 by javascript ? It is possible
Accepted Solution
Expert: Dave Baldwin replied at 2024-04-10 16:46:34
500 points GOOD
This works but it only creates the outer border, not a border between cells. As far as cell width, you may want to let the width expand and contract with the data. I would add a little padding, at least left and right, to make the text more legible. This shows a couple of variations.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Untitled</title><style type="text/css">table.one{ border:3px solid black;}table.one td { width: 100px; padding:2px;}table.two{border:6px solid black;}table.two td { width: 130px; padding:2px;}</style></head><body><table class="one" cellpadding="0" cellspacing="0" summary=""><tr><td>The first</td><td>The 2nd</td></tr><tr><td>The first</td><td>The 2nd</td></tr></table> <table class="two" cellpadding="0" cellspacing="0" summary=""><tr><td>The first</td><td>The 2nd</td></tr><tr><td>The first</td><td>The 2nd</td></tr></table></body></html> 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:
