CODEWITHSUNDEEP
jquery
SomeJavaGuy
SomeJavaGuy

Reputation: 7347

JQuery .each() returns undefined

I am having two tables. The first one is only for the headers, because I didn´t found a solution to make the thead non scrollable. the Second one contains the content, but is empty when the side gets loaded. First the Code for both tables.

            <table width="100%">
                <caption class="splitselection">
                    <b>Downloads</b>
                </caption>
                <thead align="left">
                    <tr> 
                        <th scope="col" width="36%"   align="left"          >Dateiname           </th>
                        <th scope="col" width="32%"   align="left"          >Fortschritt         </th>
                        <th scope="col" id="status" width="22%"align="left" >Status              </th>
                        <th scope="col" width="10%" align="left"            >Ordner &ouml;ffnen  </th>
                    </tr>
                </thead>
            </table>
            <div style="overflow:auto; height:115px;  width:100%" class="downloadFrame">
                <table width="100%" id="download_table" align="center">
                    <tbody align="left">
                    </tbody>
                </table>
            </div>

so for now I want to catch every <tr> element in the table with the content with this code: 

var interval = window.setInterval(function() {
    $('#download_table > tbody > tr').each(function() {
        alert($(this).find('td')[0].html);
    });
},5000);

I am creating a interval which checks a specific tablecell.

In my Alert I want to retrieve this tablecell, but my Alert in here return me "undefined". If I am just writing alert($(this).find('td')[0]); it return me HTML htmlObjectTableCell.

Without adding any tablerow, my interval does nothing. If i add a row, I am getting an alert. So for me there must be something wrong when I want to get the tablecell html

Yet I tried to use .html .val and .text, but I am getting the same result as before.

Upvotes: 0

Views: 186

Answers (4)

Behrang Saeedzadeh
Behrang Saeedzadeh

Reputation: 47913

Try this instead:

$(this).find('td').eq(0).html();

or

$(this).find('td:first-child').html();

By the way, $("foo").html returns a reference to the html function rather than invoking it. Make sure you use function_name() instead of function_name when you want to actually execute a function named function_name.

Explanation

In jQuery, $('selector')[0], does not return a jQuery-wrapped object but a PODO (Plain Old Dom Object anyone?). That means you can not call jQuery functions on the returned object. However $('selector').eq(0) returns a jQuery-wrapped object so you can invoke jQuery functions on it.

Upvotes: 1

zafus_coder
zafus_coder

Reputation: 4591

there is no <td> in table

Upvotes: 0

Anthony Grist
Anthony Grist

Reputation: 38345

The HTML of the contents of a DOM element is stored in the innerHTML property, not a property called html, so you need to change that line to this:

alert($(this).find('td')[0].innerHTML);

Upvotes: 1

ninja
ninja

Reputation: 2263

You are looping through each tr that is a direct child to the tbody-element that is the direct child of #download_table. What your markup is showing is that the tbody-element doesn't have any children at all.

Upvotes: 1

Related Questions