Show link in browser

Question

So I've made this table, and by using Javascript, I made them clickable.

My Javascript is the following:

function tdClick() {
    $(document).ready(function() {
        $('table td').click(function() {
            var TJid = $(this).attr('id');
            window.open(
                'TestResults?ID=' + TJid,
                '_blank' // <- This is what makes it open in a new window.
            );
        });

    });
}

This Javascript is applied to this table <td>

function MakeTable($TestPlanData){
    echo"
        <tr>
            <td class='font-weight-bold' scope='row' id=".$TestPlanData['TestJobId'].">".$TestPlanData['TestSuiteCollectionName']."</td>
            <td id=".$TestPlanData['TestJobId'].">
                <div class='row ml-1'>";
                    if ($TestPlanData['Passed'] != 0) {
                        echo"
                        <div class='col-xs-6 mr-1'>
                            <span class='bg-success rounded text-light font-weight-bold h6 p-2'>
                                ".$TestPlanData['Passed']."
                            </span>
                        </div>";
                    }
                echo"
                </div>
            </td>
            <td id=".$TestPlanData['TestJobId']."><small class='text-muted'>".convertTimeZone($TestPlanData['Date'], 'UTC', 'Europe/Copenhagen')."</small></td>
            <td id=".$TestPlanData['TestJobId']."><small class='text-muted'>".$TestPlanData['NameVersion']."</small></td>
        </tr>
    ";
}

BUT at the moment when I hover my mouse over the <td> no URL is shown at the bottom of the browser, unlike if I use a tag. I can only make the tag apply to the text and not the whole rectangle/.

Is there a way to get this at the bottom of the page when I hover my mouse over each <td>?

Does this answer your question? [How can I make a link from a table cell](https://stackoverflow.com/questions/3337914/how-can-i-make-a-link-from-a-td-table-cell) — маньяк, May 25 '21 at 08:13
Used to be that you could set [`window.status`](https://developer.mozilla.org/en-US/docs/Web/API/Window/status), but that’s deprecated. — CBroe, May 25 '21 at 08:18
Just put a hyperlink inside the td, instead of using script to make the td clickable. See Anton's answer below — ADyson, May 25 '21 at 08:23
just use an anchor tag, and make it as inline block, and make the width 100% so that it occupies the whole cell. no need for that td onclick wizardry — Kevin, May 25 '21 at 08:24

score 1 · Accepted Answer · answered May 25 '21 at 08:19

You need "normal" <a> tags for this to work. Example:

tr td { width: 50%; }
tr th { background: #EEE; }
a { color: black; text-decoration: none; }

<table border="1">
<tr><th>Description</th><th>Link</th></tr>
<tr><td>First</td><td><a href="link1" target="_blank">Link 1</a></td></tr>
<tr><td>Second</td><td><a href="link2/multiline" target="_blank">Link<br/>with<br/>multiline<br/>text</a></td></tr>
<tr><td>Third</td><td><a href="link3/long/text" target="_blank">Link with long text with very long description and it will be wrapped automatically</a></td></tr>
</table>

Thanks I guess this is the only solution :) – The Mungax May 25 '21 at 08:48 — The Mungax, May 25 '21 at 08:48

score 0 · Answer 2 · answered May 25 '21 at 08:17

0

As far as I know, it only works in <a> tags:

<html>
<div><a href="index.php">Link 1</a></div>
<div onclick="window.open('index.php','_self')">Link 2</div>
</html>

answered May 25 '21 at 08:17

Shiz

695
10
27

Show link in browser

2 Answers2