Because MOSS filters "dangerous code" from metadata columns, calculated columns can not resolve to something with code in it and the Excel function "HYPERLINK" does not work in MOSS. So, what can we do?
Admins and power users can clean this up with SPD or custom web parts. However, the end user has fewer options. If the end user has the Edit Page permission and access to the Content Editor Web Part, they can use some javascript to clean up the links. If you don’t normally allow that, you may want to add the second technique’s script to your default.master as it will clean up any ugly links on your page.
Technique 1
Let’s say, you have a bunch of document names in a list and you want to create a url to another site using a calculated column like this: ="http://google.com/"&Title
We know the "base URL" and we want to dynamically separate the appended portion from the base (e.g., displaying http://www.google.com/labs as labs), so we add this script to the list view page using a CEWP:
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("cleanLinks");
function
cleanLinks(){
var baseURL =
"http://google.com/";
var len =
baseURL.length;
var links =
document.getElementsByTagName("a");
for (var i=0; i < links.length; i++) {
if
(links[i].href && links[i].href.substring(0,len) == baseURL){
if
(links[i].innerText==undefined) {
links[i].textContent =
links[i].textContent.substring(len);
}
else{
links[i].innerText =
links[i].innerText.substring(len); //for IE
}
}
}
}
//–>
</script>
Just replace the value of the variable ‘baseURL’ with whatever you use for a base in your calculated column. If you also want to clean up the text (like in the case of url-encoded file names or underscores that replace spaces), you’ll need the replace() method in both lines that replace the display text (one for Firefox and one for IE).
Technique 2
In this case, we can not predict the "base URL." So we will clean up our links by replacing the url with the word "link" for any tag using the href attribute as its display text.
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("cleanLinks");
function
cleanLinks(){
var links =
document.getElementsByTagName("a");
for (var i=0; i < links.length; i++) {
if
(links[i].href && links[i].href == links[i].innerText){
links[i].innerText = "link";
}else{
if
(links[i].href && links[i].href == links[i].textContent){
links[i].textContent = "link";
}
}
}
}
//–>
</script>
A slightly fancier version of that technique adds an image using some embedded CSS:
<STYLE TYPE="text/css" MEDIA=screen>
<!–
.mylink
{
background-image:
url(/_layouts/images/link.gif);
background-repeat:
no-repeat;
font-family:
tahoma,sans-serif;
font-size: 8pt;
padding-left:
25px;
}
–>
</STYLE>
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("cleanLinks");
function
cleanLinks(){
var links =
document.getElementsByTagName("a");
for (var i=0; i < links.length; i++) {
if
(links[i].href && links[i].href == links[i].innerText){
links[i].parentNode.className="mylink";
links[i].innerText = "link";
}else{
if
(links[i].href && links[i].href == links[i].textContent){
links[i].parentNode.className="mylink";
links[i].textContent = "link";
}
}
}
}
//–>
</script>
