Link to home
Start Free TrialLog in
Avatar of peazak
peazak

asked on

Parse links for use in other code

Hello,

I would like the code below to split up the href tag into a URL and into link text for two different types of links (if it's possible).

The first link would be this type: <a href="http://www.yahoo.com">Yahoo</a>
The results should be: http://www.yahoo.com   &  Yahoo  (this works in the code below)

The second type of link is: <a href="javascript:link('speciallink')">Special Link</a>
The results should be: javascript:link('speciallink')  &  Special Link

Thanks in advance for any help.

 <script language="JavaScript">
var s = '<a href="http://www.yahoo.com">Yahoo Site </a>'
var regx = /^.*\=\"(.*)\">(.*)<.*$/;
regx = regx.exec(s);
var url = ''
var text = ''
if (regx && regx[1] ) {
url = regx[1]
text = regx[2]
// create your new Option(url, text)

// add it to the select
}
document.write(text)
document.write(url)

</script>
Avatar of hielo
hielo
Flag of Wallis and Futuna image

The code provided is already splitting both link formats. I tried the following:
Input: s = '<a href="http://www.yahoo.com">Yahoo Site</a>';
Output:Yahoo Sitehttp://www.yahoo.com

Input: s='<a href="javascript:link(\'speciallink\')">Special Link</a>'
Output: Special Linkjavascript:link('speciallink')
Avatar of peazak
peazak

ASKER

Hielo - I can't add backslashes to the second link.

It has to remain as: <a href="javascript:link('speciallink')">Special Link</a>
Where are you reading/getting input from: a form element? an input window? a database?
The added backslashes are just so that the string is assigned to a variable. If for instance the input is on a text form element, you could say:
<input type="text" name="inputLink" id="inputLink" value=""/>
once the user inputs the link above(no backslashes necessary), then you could assign it to "s" as shown below and the rest of the code works OK.
s = document.getElementById('inputLink').value;
Avatar of peazak

ASKER

The web page has been built in a content management system called Stellent. The links are saved in an XML file. They are normally displayed using Stellent's coding language called iDoc Script (not an xsl sheet).

Here's an example of the XML:
- <Item>
  <a href="http://www.link1.com">Link 1</a>
  </Item>
- <Item>
  <a href="javascript:link('Link2');">Link2</a>
  </Item>
- <Item>

The iDoc Script loops through and displays each "Item" as I gave them to you.  I was trying to use JavaScript after the loop but before the display so that I could create different types of menus within the content management system (right now it appears as a list but I wanted drop-downs). I really don't know of a way to manipulate the links until after idoc script has retrieved them.
This now makes sense, since once you "extract" the href from the elements, it would be stored in some variable already. In the example that you gave you are literally hardcoding the values and you must escape the apostrophes some how( backslashes, &#39; hex value).

Based on your comments it seems you are ultimately only seeing html links: ie <a href="">...</a>
Try this:
var linkList=document.getElementsByTagName('a');
for(var i=0;i<linkList.length;i++)
 document.write(linkList.href + " " + linkList.value);

Avatar of peazak

ASKER

Hielo - I appreciate your help but I couldn't get that to work. Below is the drop-down that I'm trying to create using HTML, iDoc Script and JavaScript. The JavaScript code that I provided above is the same except this uses idoc variables.

<select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
                           <!--$ loopwhile nPos <= nNumRecords -->
                              <!-- Row -->
                              <script language="JavaScript">
                                    var s<!--$nPos--> = '<!--$ ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->'
                                    var regx<!--$nPos--> = /^.*\=\"(.*)\">(.*)<.*$/;
                                    regx<!--$nPos--> = regx<!--$nPos-->.exec(s<!--$nPos-->);
                                    var url<!--$nPos--> = ''
                                    var text<!--$nPos--> = ''
                                    if (regx<!--$nPos--> && regx<!--$nPos-->[1] ) {
                                    url<!--$nPos--> = regx<!--$nPos-->[1]
                                    text<!--$nPos--> = regx<!--$nPos-->[2]
                                    }

                              </script>       
                                     <script>document.write("<option value='"+url<!--$nPos-->+"'>"+text<!--$nPos-->+"</option>")</script>      
                              <!--$nPos=nPos+1-->
                        <!--$endloop-->
                        </select>

AND Here is the same code as it appears on the page. The yahoo and ebay links are the only ones that actually appear.

                      <select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
                           
                              <!-- Row -->
                              <script language="JavaScript">
                                    var s1 = '<a href="http://www.ebay.com">Link 3</a>'
                                    var regx1 = /^.*\=\"(.*)\">(.*)<.*$/;
                                    regx1 = regx1.exec(s1);
                                    var url1 = ''
                                    var text1 = ''
                                    if (regx1 && regx1[1] ) {
                                    url1 = regx1[1]
                                    text1 = regx1[2]
                                    }

                              </script>       
                                     <script>document.write("<option value='"+url1+"'>"+text1+"</option>")</script>      
                              
                        
                              <!-- Row -->
                              <script language="JavaScript">
                                    var s2 = '<a href="http://www.yahoo.com">Link 2</a>'
                                    var regx2 = /^.*\=\"(.*)\">(.*)<.*$/;
                                    regx2 = regx2.exec(s2);
                                    var url2 = ''
                                    var text2 = ''
                                    if (regx2 && regx2[1] ) {
                                    url2 = regx2[1]
                                    text2 = regx2[2]
                                    }

                              </script>       
                                     <script>document.write("<option value='"+url2+"'>"+text2+"</option>")</script>      
                              
                        
                              <!-- Row -->
                              <script language="JavaScript">
                                    var s3 = '<a href="javascript:nodelink('2162');">Link 1</a>'
                                    var regx3 = /^.*\=\"(.*)\">(.*)<.*$/;
                                    regx3 = regx3.exec(s3);
                                    var url3 = ''
                                    var text3 = ''
                                    if (regx3 && regx3[1] ) {
                                    url3 = regx3[1]
                                    text3 = regx3[2]
                                    }

                              </script>       
                                     <script>document.write("<option value='"+url3+"'>"+text3+"</option>")</script>      
                              
                        
                        </select>
                        <script>
OK. I See. Try using a different approach altogether.
What I would do is to Write all the links into the HTML document first and then retrieve them via javascript once the document loads

<div id="linkList" style="position:absolute;top:-10em;left:-10em;">
      <!--$ ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
</div>

<!-- this is meant as a temporary place holder of the select list, which will be inserted via javascript once the document loads -->
<div id="selectListHolder"></div>

Now that all the links are grouped together under the "linkList" div,
<script type="text/javascript">
function populateSelect()
{
      var linkGroup = document.getElementById("linkList");
      var links=linkGroup.getElementsByTagName("a");
      var sel="";
      if(links)
      {
            sel+="<select>";
            for(var i=0; i< links.length;++i)
            {
                  sel+="<option value='" + links[i].href + "'>" + links[i].text + "</option>";
            }
            sel+="</select>";
            document.getElementById("selectListHolder").innerHTML=sel;
      }
      linkGroup=null
      links=null
return true;
}

window.onload=populateSelect;
</script>
Update: since the href values may contain apostrophes, you are better off writing the statement within the for loop as follows:
sel+='<option value="' + links[i].href + '">' + links[i].text + '</option>';
Instead of enclosing the value attribute in apostrophes I am now enclosing it in double quotes.
OK. Try this:
var s<!--$nPos--> = '<!--$ strReplace(ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()"),"'","\'" -->'
 instead of:
var s<!--$nPos--> = '<!--$ ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->'
If that does not help then try:
var s<!--$nPos--> = '<!--$ strReplace(ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()"),"'","&#39;" -->'
Avatar of peazak

ASKER

Heilo - i really appreciate your help. Something urgent just came up but I should be able to get back to this issue this afternoon. I'll let you know the results ASAP.
Avatar of peazak

ASKER

hielo - I used your updated var s declaration (I tried both).  Here's what I tried and it doesn't work:

<select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
                           <!--$ loopwhile nPos <= nNumRecords -->
                              <!-- Row -->
                              <script language="JavaScript">
var s<!--$nPos--> = '<!--$ strReplace(ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()"),"'","&#39;" -->'
                                    var regx<!--$nPos--> = /^.*\=\"(.*)\">(.*)<.*$/;
                                    regx<!--$nPos--> = regx<!--$nPos-->.exec(s<!--$nPos-->);
                                    var url<!--$nPos--> = ''
                                    var text<!--$nPos--> = ''
                                    if (regx<!--$nPos--> && regx<!--$nPos-->[1] ) {
                                    url<!--$nPos--> = regx<!--$nPos-->[1]
                                    text<!--$nPos--> = regx<!--$nPos-->[2]
                                    }

                              </script>       
                                     <script>document.write("<option value='"+url<!--$nPos-->+"'>"+text<!--$nPos-->+"</option>")</script>      
                              <!--$nPos=nPos+1-->
                        <!--$endloop-->
                        </select>
                        <script>      

I also tried my own version of it:

var s<!--$nPos--> = '<!--$ strReplace(ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()" & "'" & "\'")) -->'

and

var s<!--$nPos--> = '<!--$ strReplace(ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()" & "'" & "&#39'")) -->'

I think this may not be possible.
I know what needs to be done, but I have never seen/heard of iDoc before so I don't know its syntax.
I went to the following site for Technical Reference:
http://tariffs.qwest.com:8000/idc/help/sdk/idoc_script_reference/wwhelp/wwhimpl/js/html/wwhelp.htm?href=page_6_001.htm
However, I am questioning if that is the correct online technical reference because I was not able to find any documentation on the ssIncludeXml. This is where I got the strReplace last time. Hence my last post.

Basically what we need to do is as follows:
a Instead of "printing" the line that is giving us problems we need to save string returned by the ssIncludeXml function onto a variable.
b escape the apostrophes
c print the escaped string

My problem is
1. if ssIncludeXms automatically prints or just returns a string
2. I don't know how to save data onto variables,
3. I don't know how to escape charactes.

What follows is what I came up with after some careful analysis of your first "full" code post. If I did things correctly, then the output would be:
var s3 = '<a href="javascript:nodelink(x2162x);">Link 1</a>'

I know it is not valid javascript, but if you see that line, then it is just a matter of figuring out how to escape the apostrophe in iDoc Script. In other words, if the code below give the result mentioned, then it is a matter of changing the "x" (without the quotes) to hopefully one of the following:
&#39;
\x27
\\'
\\\'

At any rate, try this code snippet.
<select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
 <!--$ loopwhile nPos <= nNumRecords -->
  <!-- Row -->
  <script type="text/javaScript">
  <!--$tempData=ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
  <!--$tempData=strReplace($tempData,"'","x") -->
  var s<!--$nPos--> = '<!--$tempData-->'
  var regx<!--$nPos--> = /^.*\=\"(.*)\">(.*)<.*$/;
  regx<!--$nPos--> = regx<!--$nPos-->.exec(s<!--$nPos-->);
  var url<!--$nPos--> = ''
  var text<!--$nPos--> = ''
  if (regx<!--$nPos--> && regx<!--$nPos-->[1] ) {
   url<!--$nPos--> = regx<!--$nPos-->[1]
   text<!--$nPos--> = regx<!--$nPos-->[2]
  }
  </script>      
  <script type="text/javascript">document.write("<option value='"+url<!--$nPos-->+"'>"+text<!--$nPos-->+"</option>")</script>      
  <!--$nPos=nPos+1-->
 <!--$endloop-->
</select>
Avatar of peazak

ASKER

Hielo - That was a really great idea. It doesn't seem to work because the idoc script doesn't seem to "print" the link out, until after it's on a webpage. I modified your code and still didn't have much luck (see below). I posted this question to a Stellent user group as well. Maybe someone else has some ideas. If you can't think of anything else, please let me know because I'll gladly give you the solution points for your effort.

                      <select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
 <!--$ loopwhile nPos <= nNumRecords -->
  <!-- Row -->
  <script type="text/javaScript">
  <!--$tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
  <!--$printLink = tempData-->
  <!--$newLink = regexReplaceAll($tempData, "'", "x")-->
  var s<!--$nPos--> = '<!--$newLink-->'
    var g<!--$nPos--> = '<!--$tempData-->'
  var regx<!--$nPos--> = /^.*\=\"(.*)\">(.*)<.*$/;
  regx<!--$nPos--> = regx<!--$nPos-->.exec(s<!--$nPos-->);
  var url<!--$nPos--> = ''
  var text<!--$nPos--> = ''
  if (regx<!--$nPos--> && regx<!--$nPos-->[1] ) {
   url<!--$nPos--> = regx<!--$nPos-->[1]
   text<!--$nPos--> = regx<!--$nPos-->[2]
  }
  </script>
  <!--$tempData-->  
    <!--$printLink-->    
      <!--$newLink-->
  <script type="text/javascript">document.write("<option value='"+url<!--$nPos-->+"'>"+text<!--$nPos-->+"</option>")</script>      
  <!--$nPos=nPos+1-->
 <!--$endloop-->
</select>
For now, just for now,  comment out
<!--$newLink = regexReplaceAll($tempData, "'", "x")-->

Then, on the code you posted, change:
<!--$tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
 TO
<!--$exec tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
<!--$tempData-->
if that still does not show any output, then try:
<!--$exec tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
<!--$eval tempData-->
instead.
Avatar of peazak

ASKER

This code displays the link. But that's about it.

<!--$exec tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
<!--$tempData-->

The other code doesn't work.

ASKER CERTIFIED SOLUTION
Avatar of hielo
hielo
Flag of Wallis and Futuna image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of peazak

ASKER

Hielo - I found some idoc script that adds backslashes to escape white space and quotes. It works now. Now I just need to get the drop-down to open nodelink pages. Thanks for all of your help.

Code:

 <select name="initiatives" class="nav_form_list" onChange="MM_jumpMenu('parent',this,0)">
 <!--$ loopwhile nPos <= nNumRecords -->
  <!-- Row -->
  <script type="text/javaScript">
<!--$tempData = ssIncludeXml(SS_DATAFILE, root & "/" & "Item" & "[" & nPos & "]/node()") -->
  var s<!--$nPos--> = '<!--$js(tempData)-->'
  var regx<!--$nPos--> = /^.*\=\"(.*)\">(.*)<.*$/;
  regx<!--$nPos--> = regx<!--$nPos-->.exec(s<!--$nPos-->);
  var url<!--$nPos--> = ''
  var text<!--$nPos--> = ''
  if (regx<!--$nPos--> && regx<!--$nPos-->[1] ) {
   url<!--$nPos--> = regx<!--$nPos-->[1]
   text<!--$nPos--> = regx<!--$nPos-->[2]
  }
  </script>
  <!--$tempData-->  
      <!--$js(tempData)-->
  <script type="text/javascript">document.write("<option value='"+url<!--$nPos-->+"'>"+text<!--$nPos-->+"</option>")</script>      
  <!--$nPos=nPos+1-->
 <!--$endloop-->
</select>

Results:

  <!-- Row -->
  <script type="text/javaScript">

  var s2 = '<a href=\"http://www.yahoo.com\">Link 2</a>'
  var regx2 = /^.*\=\"(.*)\">(.*)<.*$/;
  regx2 = regx2.exec(s2);
  var url2 = ''
  var text2 = ''
  if (regx2 && regx2[1] ) {
   url2 = regx2[1]
   text2 = regx2[2]
  }
  </script>
  <a href="http://www.yahoo.com">Link 2</a>  
      <a href=\"http://www.yahoo.com\">Link 2</a>
  <script type="text/javascript">document.write("<option value='"+url2+"'>"+text2+"</option>")</script>      
 
 
  <!-- Row -->
  <script type="text/javaScript">

  var s3 = '<a href=\"javascript:nodelink(\'2162\');\">Link 1</a>'
  var regx3 = /^.*\=\"(.*)\">(.*)<.*$/;
  regx3 = regx3.exec(s3);
  var url3 = ''
  var text3 = ''
  if (regx3 && regx3[1] ) {
   url3 = regx3[1]
   text3 = regx3[2]
  }
  </script>
  <a href="javascript:nodelink('2162');">Link 1</a>  
      <a href=\"javascript:nodelink(\'2162\');\">Link 1</a>
  <script type="text/javascript">document.write("<option value='"+url3+"'>"+text3+"</option>")</script>      
 
 
</select>

Can you help me get the javascript to use the nodelink correctly?