Advanced Search

Results 1 to 1 of 1

Thread: Hyperlinks in XML

  1. #1
    Join Date
    May 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Hyperlinks in XML

    Hello, can someone please show me how to hyperlink the output in the below xml. This is not my original work. Iwould like to modify the javascript to render the xml oputput with hyperlinks. Please help. Thanks in advance.

    ---------------------------------------------------------------

    // The sample XML:

    HTML Code:
    <?xml version="1.0" encoding="utf-8"?>
    <searchable_index>
    	<item>John</item>
    	<item>Paul</item>
    	<item>George</item>
    	<item>Ringo</item>
    </searchable_index>
    ----------------------------------------------------------------------

    // The javascript:

    Code:
    window.onload = loadIndex;
    
    function loadIndex() { // load indexfile
    // most current browsers support document.implementation
    	if (document.implementation && document.implementation.createDocument) {
    		xmlDoc = document.implementation.createDocument("", "", null);
    		xmlDoc.load("index.xml");
    	}
    // MSIE uses ActiveX
    	else if (window.ActiveXObject) {
    		xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    		xmlDoc.async = "false";
    		xmlDoc.load("index.xml");
    	}
    }
    
    
    function searchIndex() { // search the index (duh!)
    	if (!xmlDoc) {
    		loadIndex();
    	}
    	// get the search term from a form field with id 'searchme'
    
    	var searchterm = document.getElementById("searchme").value;
    	var allitems = xmlDoc.getElementsByTagName("item");
    	results = new Array;
    	if (searchterm.length < 3) {
    		alert("Enter at least three characters");
    	} else {
    		for (var i=0;i<allitems.length;i++) {
    // see if the XML entry matches the search term,
    // and (if so) store it in an array
    			var name = allitems[i].lastChild.nodeValue;
    			var exp = new RegExp(searchterm,"i");
    			if ( name.match(exp) != null) {
    				results.push(allitems[i]);
    			}
    		}
    // send the results to another function that displays them to the user
    	showResults(results, searchterm);
    	}
    }
    
    
    // The following is just an example of how you
    // could handle the search results
    function showResults(results, searchterm) {
    
    	if (results.length > 0) {
    // if there are any results, put them in a list inside the "resultshere" div
    		var resultshere = document.getElementById("resultshere");
    		var header = document.createElement("h5");
    		var list = document.createElement("ul");
    		var searchedfor = document.createTextNode("You've searched for "+searchterm);
    		resultshere.appendChild(header);
    		header.appendChild(searchedfor);
    		resultshere.appendChild(list);
    		for (var i=0;i<results.length;i++) {
    			var listitem = document.createElement("li");
    			var item = document.createTextNode(results[i].lastChild.nodeValue);
    			list.appendChild(listitem);
    			listitem.appendChild(item);
    		}
    	} else {
    // else tell the user no matches were found
    		var resultshere = document.getElementById("resultshere");
    		var para = document.createElement("p");
    		var notfound = document.createTextNode("Sorry, I couldn't find anything like "+searchterm +"!");
    		resultshere.appendChild(para);
    		para.appendChild(notfound);
    	}
    }

    ----------------------------------------------------------------------
    // Here's some s(a|i)mple HTML that should work with the code above:


    HTML Code:
    <html>
    <head>
    <script type="text/javascript" src="searchindex.js"></script>
    </head>
    <body>
    <form action="">
    <input type="text" id="searchme" />
    <input type="submit" onclick="searchIndex(); return false;" />
    </form>
    <div id="resultshere">
    </div>
    </body>
    </html>
    Last edited by Snookerman; 05-10-2010 at 02:53 PM. Reason: use [code] and [html] tags

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •