Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Change some cells in a table, without having an "id".

Posted on 2009-02-16
14
Medium Priority
?
362 Views
Last Modified: 2013-11-05
I have a standard table generated from php. There 2 columns, first has text, and second has a number or predefined text (eg 1 or "not present"). I want to change the values of the second column with a script (eg in Greasemonkey), but I am not able to find out what value belongs to which text (the cells that are on the same row) because they don't have an 'id' tag to sort them with. I guess the only option is 'getElementsByTagName', but don't know how to recognize individual text with that and append the cell that follows. Any ideas or templates?
0
Comment
Question by:PCBOP
  • 8
  • 6
14 Comments
 
LVL 15

Expert Comment

by:fsze88
ID: 23650419
It should help you, tested on ie6,ff3
<html>
<head>
<script>
function onloadfun(){
 
var tabletags = document.getElementsByTagName('table');
//alert(tabletags[0]);
 
//  var tabletag = document.getElementById("tableid");
 
tabletag = tabletags[0];
  rows = tabletag.rows;
  for(i=1;i<rows.length;i++){
    cells = rows[i].cells;
    if (cells[0].innerHTML == 'text1'){
      cells[1].innerHTML = 123;
    }
  }
}
</script>
</head>
<body onLoad="onloadfun()">
<table id="tableid" border=0 cellpadding="0" cellspacing="0" >
  <tr id="eHead"><th>Date:</th><th>Event</th></tr>
  <tr><td >text1</td><td >0</td></tr>
  <tr><td >text2</td><td >1</td></tr>
</table>
</body>
</html>

Open in new window

0
 
LVL 15

Expert Comment

by:fsze88
ID: 23650662
0
 

Author Comment

by:PCBOP
ID: 23651157
I understand the flow of your script, however it doesn't work (doens't seem to write the '123'). The links you have given are somewhat helpfull, but all use the ElementId, which I can't use.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 

Author Comment

by:PCBOP
ID: 23651165
(and of course, I changed 'text1' to my own text.)
0
 

Author Comment

by:PCBOP
ID: 23651191
I uncommented the Alert, it doesn't come up...
0
 
LVL 15

Expert Comment

by:fsze88
ID: 23651271
?? code snippet from comment #23650419 is works fine on IE6,FF3 even safari, opera. So what's your browsers and version?
could you please copy code, place it in notepad and save it to .html file, open it?
you could take reference how to add tr,td tag from http://www.pxl8.com/createElement.html
what you need to do is

place arrayIndex * in tabletags[*]; that is!

var tabletags = document.getElementsByTagName('table');
tabletag = tabletags[0];

Again, what's your browser and version!?!?!
0
 

Author Comment

by:PCBOP
ID: 23651293
I found problem: the main table is within another table that has a header, and there are 2 other empty tables on the page. The script only focusses on the first table it encounters. How do I specify the right one?
0
 

Author Comment

by:PCBOP
ID: 23651306
(Your code works fine on its one, but not within the page I want to enhance)
0
 
LVL 15

Expert Comment

by:fsze88
ID: 23651330
okey, try place
<script language="javascript">
onloadfun();
</script>
at the bottom just before </body>

and omit onLoad="onloadfun()" from body tag

OR add a tag to somewhere in the body tag
<a href="#" onclick="onloadfun();"> update table tag</a>

to see how is going on?

try code snippet, tested on ie6,ff3,safari,opera......

<html>
<head>
<script>
function onloadfun(){
 
var tabletags = document.getElementsByTagName('table');
//alert(tabletags[0]);
 
//  var tabletag = document.getElementById("tableid");
 
tabletag = tabletags[0];
  rows = tabletag.rows;
  for(i=1;i<rows.length;i++){
    cells = rows[i].cells;
    if (cells[0].innerHTML == 'text1'){
      cells[1].innerHTML = 123;
    }
  }
}
</script>
</head>
<body >
<a href="#" onclick="onloadfun();"> update table tag</a>
 
<table id="tableid" border=0 cellpadding="0" cellspacing="0" >
  <tr id="eHead"><th>Date:</th><th>Event</th></tr>
  <tr><td >text1</td><td >0</td></tr>
  <tr><td >text2</td><td >1</td></tr>
</table>
</body>
</html>

Open in new window

0
 

Author Comment

by:PCBOP
ID: 23651817
I think you overlooked my last 2 comments. This does not affect the table in table issue.
0
 
LVL 15

Accepted Solution

by:
fsze88 earned 1500 total points
ID: 23655487
but not works within the page I want to enhance? The script only focusses on the first table it encounters. How do I specify the right one?
first you must know how many table tag in your page and find the index of that table
set tabletag = tabletags[i]; to your javascript.
it is the only way to you can do without id tag in table
if you have any idea about  specify the right one without id attribute, but not counting the number of table tag. please let me know .
0
 
LVL 15

Expert Comment

by:fsze88
ID: 23655846
if specify the right one without id attribute? yes you can add attribute name. Read the right value of attribute name,
gain the tabletag by

for (i = 0; i < tabletags.length; i++){
  if (tabletags[i].attributes['name'].value == 'tablename3')
  tabletag = tabletags[i];
}

<table name="tablename3" >

that's
<html>
<head>
<script>
function onloadfun(){
 var i;
var tabletags = document.getElementsByTagName('table');
 
for (i = 0; i < tabletags.length; i++){
//  alert(tabletags[i].attributes['name'].value);
  if (tabletags[i].attributes['name'].value == 'tablename3')
  tabletag = tabletags[i];
}
 
 
  rows = tabletag.rows;
  for(i=1;i<rows.length;i++){
    cells = rows[i].cells;
    if (cells[0].innerHTML == 'text1'){
      cells[1].innerHTML = 123;
    }
  }
}
</script>
</head>
<body >
<a href="#" onclick="onloadfun();"> update table tag</a>
 
<table name="tablename" id="tableid" border=0 cellpadding="0" cellspacing="0" >
  <tr id="eHead"><th>Date:</th><th>Event</th></tr>
  <tr><td >text1</td><td >0</td></tr>
  <tr><td >text2</td><td >1</td></tr>
  <tr><td colspan=2><table name="tablename3" id="tableid" border=0 cellpadding="0" cellspacing="0" >
  <tr id="eHead"><th>Date:</th><th>Event</th></tr>
  <tr><td >text1</td><td >0</td></tr>
  <tr><td >text2</td><td >1</td></tr>
</table></td></tr>
</table>
 
<table name="tablename2" id="tableid" border=0 cellpadding="0" cellspacing="0" >
  <tr id="eHead"><th>Date:</th><th>Event</th></tr>
  <tr><td >text1</td><td >0</td></tr>
  <tr><td >text2</td><td >1</td></tr>
</table>
 
</body>
</html>

Open in new window

0
 
LVL 15

Expert Comment

by:fsze88
ID: 23655866
note : if you want to specify the right one with not know number of table there... you must specify some attribute on that table tag .... otherwise no way
0
 
LVL 15

Expert Comment

by:fsze88
ID: 23665749
PCBOP,
I seem you accept comment #23655487, could you have a look comment #23655846.
you can find a table tag by specify the right one without id attribute but with attribute name.
it would be better solution for you..
0

Featured Post

Become an Android App Developer

Ready to kick start your career in 2018? Learn how to build an Android app in January’s Course of the Month and open the door to new opportunities.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

572 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question