SELECTED ANSWER
replied on February 2, 2021
Here's an example of one way you could do this by using CSS to style the text like a clickable link and JavaScript to add the actual functionality.
In these examples I've given my table a custom class of "myTable" and the column that will contain the URL a class of "urlColumn"
CSS:
.urlColumn input {
color: blue;
text-decoration: underline;
cursor: pointer;
}
JavaScript:
$(document).ready(function(){
// attach delegated event handler to table
// using url column as triggering element
$('.myTable').on('click','.urlColumn input',function(){
// get url from field value
var url = $(this).val();
// add http if url is incomplete
if (!url.startsWith('http')) {
url = 'http://' + url;
}
// open in new tab
window.open(url,'_blank');
});
});
Note a couple of things about the JavaScript:
- If your URLs will always contain https:// or https://, then you don't technically need to include the IF statement, but if a URL doesn't have http:// or https:// then window.open will use the current page as the "root" for the url, which is not what you want.
- Attaching an event handler to the parent table and using event filtering is very important if your table uses lookups or rows can be added. New rows won't have any event handlers added on page load, but by attaching the delegated handler to the table and filtering on the specific trigger field you can avoid that problem.