CODEWITHSUNDEEP
javascriptjqueryhtmlappendappendto
chrisdemeke
chrisdemeke

Reputation: 333

Make word in into a link jQuery

I'm trying to make this:

<td class="Monthly Status-cell">/fileid=XXXX</td>

Display as

http://www.domain.com/fileid=XXXX

Can you tell me what is wrong with my code?

$('.Status-cell').replaceWith(function() {
var url = $.trim($(this).text());
return '<a href="' + url + '" target="_blank">' + url + '</a>';
});

Thanks!

Upvotes: 0

Views: 642

Answers (4)

Samuel Liew
Samuel Liew

Reputation: 79062

Place the link in the cell using .html() instead of .replaceWith():

var domain = window.location.hostname; // current domain
$('.Status-cell').html(function(i, value) {
    var link = domain + $.trim(value);
    return '<a href="//' + link + '">' + link + '</a>';
});

http://jsfiddle.net/samliew/ZUYCX/

Upvotes: 0

PSL
PSL

Reputation: 123739

Use .html() instead of .replaceWith(). While using replaceWith you are replacing the td with anchor inside your table, which is invalid and that must be causing your alignment to get messed up.

$('.Status-cell').html(function(_, currentText) {
   var url = "http://www.domain.com" + $.trim(currentText);
   return '<a href="' + url + '" target="_blank">' + url + '</a>';
});

Fiddle

Upvotes: 2

Musa
Musa

Reputation: 97707

Rather than replace the td with a link you should place the link in the td. Also you didn't add the domain to the link

$('.Status-cell').html(function() {
    var url = window.location.protocol+'//'+window.location.host+$.trim($(this).text());
    return '<a href="' + url + '" target="_blank">' + url + '</a>';
});

http://jsfiddle.net/bUpYE/1/

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388346

Try

$('.Status-cell').html(function(idx, value){
    value = $.trim(value);
    return '<a href="http://www.domain.com' + value + '">http://www.domain.com' + value + '</a>';
})

Demo: Fiddle

Upvotes: 0

Related Questions