[RESOLVED] how to know if a td slot is available

[tito]

Hello,

I have those dynamic td
one table has

<td id="1'pos_xx"></td><td id="2'pos_xx"></td><td id="3_'pos_xx"></td>

Where the amount of td could be anything.

1, 2, and 3 are $i values from php

I am inserting values via ajax inside the td

for a table with one td slot I do

var position = document.getElementById('pos_' + posid).innerHTML;
if(position > '')
{
alert ('position has been filled! ');
return false;
}

in my function I send

function addItem(id, posid, pcount)

where pcount is the maximum slots (total $i values) in that table

How can I know if any of the td in (multiple td ) is empty?

My first approach was

var tds = tbody.getElementsByTagName('pos_' + posid);
var lastRow = tds[tds.length - 1];
var lastId = lastRow.id;

But that does not work.

Can someone please help?

Thanks.

[Weedpacket]

The id you're looking for in the JavaScript are of the form posnnn, but the IDs that appear in the page are of the form nnn'pos_xx (which are not valid IDs).

Using getElementsByTagName obviously won't work, because an element's tag name is not the same thing as its ID.

You could consider specifying a class attribute that will have the same value for all of the cells: there's no built-in "getElementsByClass" in JavaScript, but there are plenty of implementations floating around the net that you can use.

You could also consider using an XPath query, //td[startswith(@id, "pos_")] to find matching cells.

[tito]

Thanks. I am getting near it with

for (a = 1; a <= pcount; a++)
{
var myid = document.getElementById(a + 'pos' + posid);
if (myid.innerHTML == "")
{
var icount = a;
}
}

additem_callback.object_name[request.tId] = icount + 'pos' + posid;

[tito]

Phew!! It took me all day but I finally got it. Wow!!

[Weedpacket]

But note that having ids starting with digits makes the HTML invalid....

[tito]

I did not know that. Thanks. I will change the placement.