简体   繁体   中英

How to add a hyperlink column to a table using jquery?

I am building an HTML table (with 4 columns) using below jquery. I already added 3 columns.

How do i add a fourth column to the table in the function below. Column is hyperlink with values from the first 3 columns of the table?

Expected format of column four :

 <table style="width:100%"> <tr> <td>COLUMN1</td> <td>COLUMN2</td> <td>COLUMN3</td> <td>COLUMN4</td> </tr> <tr> <td>A1</td> <td>B1</td> <td>C1</td> <td>www.yahoo.com?q1=A1&q2=B1&q3=C1</td> </tr> <tr> <td>A2</td> <td>B2</td> <td>C2</td> <td>www.yahoo.com?q1=A2&q2=B2&q3=C2</td> </tr> <tr> <td>A3</td> <td>B3</td> <td>C3</td> <td>www.yahoo.com?q1=A3&q2=B3&q3=C3</td> </tr> </table> 

Here is my my function?

function testFunction(data, status, jqXHR) {
    var testObj = data;
    var tempurl= "www.yahoo.ccom";
    var table = $("#IdTab");
    $.each(testObj.childData, function (i, n) {
        var rootmyVal = n.myVal1;
        $.each(n, function (e, r) {
            table.append("<tr><td>" + rootmyVal + "</td><td>" + r.myVal1 + "</td><td>" + r.myVal2 + "</td></tr>");          
        });
    });
}

Very simple. The same way, use <a> tag:

function testFunction(data, status, jqXHR) {
    var testObj = data;
    var tempurl= "www.yahoo.ccom";
    var table = $("#IdTab");
    $.each(testObj.childData, function (i, n) {
        var rootmyVal = n.myVal1;
        $.each(n, function (e, r) {
            table.append("<tr><td>" + rootmyVal + "</td><td>" + r.myVal1 + "</td><td>" + r.myVal2 + "</td><td><a href='http://" + tempurl + "'>" + tempurl + "</a></td></tr>");          
        });
    });
}

Also, it looks like the url is just www.yahoo.com , without the http:// protocol. Please ensure you add that before. Since you haven't provided the full data , I am unable to create a snippet or fiddle.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM