For javascript gurus: get an array of tr attributes

Targets Web
1

I have a table like this :

<table id="mytable"
<thead...
</thead>
<tbody>
<tr rowid="661">...</tr>
<tr rowid="68">...</tr>
<tr rowid="977">...</tr>
...
</tbody>

how can I get an array of the rowid values, in the existing order ? with jquery ?
like $(‘mytable tr’). ???

thanks.

my level of javascript being close to 0, I would be grateful to anyone helping me.
thanks.

2

$("tr").attr("rowid").each(function(e){ $(this).att(" });

pseudocode.

see here:
https://api.jquery.com/each/

3

if I use

var rowIDs = $("#mytable tr").attr("rowid")

I would have an array of my rowids available ?

4

you can iterate using the each. if you have an element that contains sub elements.

var rowIDs = $("#mytable tr").each(function () {
    console.log($(this).attr('rowid'));
});

Check that in the debug (browser console)

Read a simple sample that comes close to what you need here (see answer):

5

do you know of any macos app that would let me test some javascript code in a simple IDE ?
with debugger ?
like Thonny does for python.

6

coderunner perhaps?

1 Like
7

You don’t need jquery
See Document.querySelectorAll() - Web APIs | MDN

1 Like
8

True but it’s already loaded by xojo if i’m not mistaken and probably as easy.

9

I tried this, but I don"t get what I need, I get this instead :

0 <tr rowid="661"></tr>
1 <tr rowid="68"></tr>
2 <tr rowid="977"></tr>

I don’t get the value of the rowid attribute, but the value inside the tr tag.
I would like an array with [“661”,“68”,“977”], or even better with numbers only [661,68,977]

my example table is like this :

		<table id="mytable">
		<thead>
		</thead>
		<tbody>
		   <tr rowid="661">line6</tr>
		   <tr rowid="68">line8</tr>
		   <tr rowid="977">line7</tr>
		</tbody>
		</table>

how should I proceed ?

10

Try:

var myArr = $("#mytable tr").map(function (){
    return this.getAttribute("rowid"); // returns an array
 });
console.log(myArr); // copy all in console (browser)
11

this works the same way as DerkJ solution, and gives me the same thing I don’y want

var elem  = document.querySelectorAll('tr');

gives me the inner of the tr tag

var elem  = document.querySelectorAll('rowid');

gives me empty inside elem.

12

this works ! thanks !
even better is :

var myArr = $("#mytable tr").map(function (){
    return parseInt(this.getAttribute("rowid")); // returns an array
 });

so I get my array of integers instead of strings

can you explain me the difference between :

and

which gives completely different results !

13

attr is jQuery getAttrubute is native js.

Note the map() function makes it an array, not the getAttribute function.

1 Like
14

I have seen that just after sending my previous message … :face_with_hand_over_mouth: