jeudi 23 juin 2016

Need help using jQuery to construct new table from RSS feed


I am pulling an RSS feed from JIRA (issue tracking system) into a WordPress page. From there I want to build a table using select values from the feed.

This has proven challenging since I am using $item->get_description and it is returning 5 to 7 tables for each item, which I am wrapping in <li>. I have managed to select the rows I need using tr:has(td:contains("Row Label:")).addClass('row-class');.

So on the page now I have ~150 <li> each with 5 to 7 tables in them. Each <tr> has 2 <td>. Again, using the class selectors I added I can grab the values of the 5 fields I need.

var value = $(this).find("tr.row-class td:eq(1)").text();

But I'm not sure where to go from here, since I have never done anything like this before. Basically I need

<table id="new-table">
<thead><tr><th>heading1</th><th>heading</th><th>heading3</th><th>heading4</th><th>heading5</th></tr></thead>
<tbody>
<tr><td>value of tr1 td</td><td>value of tr2 td</td><td>value of tr3 td</td><td>value of tr4 td</td><td>value of tr5 td</td></tr>
</tbody>
</table>

And there will be 150 or so <tr>. Anyone ever done anything like this?

<?php
include_once(ABSPATH . WPINC . '/rss.php');
$feed = 'https://feedurl';
$rss = fetch_feed($feed);
if (!is_wp_error( $rss ) ) :
        $maxitems = $rss->get_item_quantity(15);
    $rss_items = $rss->get_items(0, $maxitems);
        if ($rss_items):
        echo "<ul id='issuetable'>n";
            foreach ( $rss_items as $item ) : 
            printf('<li class="jira-item"><a href="%s">%s</a><p>%s</p></li>',$item->get_permalink(),$item->get_title(),$item->get_description() );
        endforeach;
        echo "</ul>n";
    endif;
endif;
?>

$('document').ready(function() {
    $('.jira-item').each (function () {
        $(this).children('table').each(function(i){
          var index = i + 1;
          $(this).addClass('table-'+ index);
        });
        $('.table-1 tr:has(td:contains("Title:"))').addClass('title');
        $('.table-1 tr:has(td:contains("Status:"))').addClass('status');
        $('.table-2 tr:has(td:contains("Labels:"))').addClass('labels');
        $('.table-3 tr:has(td:contains("Summary:"))').addClass('summary');
        $('.table-3 tr:has(td:contains("Description:"))').addClass('description');
        var value = $(this).find(".table-2 tr.labels td:eq(1)").text();
    });
});

Aucun commentaire:

Enregistrer un commentaire