rogerg Posted November 17, 2011 Share Posted November 17, 2011 Hi thereI am struggling with using JS to create a search on a xml file I have built.I have an xml file with over 1000 books listed and I wish to add a search option to it .As I imported an excel file with oxygen to create the xml, I have the xml written in the style<root> <row> <Heading0>English Literature</Heading0> <Heading1>Woolf</Heading1> <Heading2>Virginia</Heading2> <Heading3>To the lighthouse</Heading3> <Heading4>UK</Heading4> <Heading5>english</Heading5> <Heading6></Heading6> </row> <row> <Heading0>Italian Literature</Heading0> <Heading1>Boccaccio</Heading1> <Heading2>Giovanni</Heading2> <Heading3>Decameron</Heading3> <Heading4>IT</Heading4> <Heading5>italiano/deutsch</Heading5> <Heading6></Heading6> </row> ...</root>I have added also a XSL sheet to the XML and a CSS to the XSL.Now, I want to create a javascript search function in an external html file:I have started with something like***********************<!DOCTYPE html><html><head> <link rel="stylesheet" href= "style.css"> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>Search</title><script type="text/javascript">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 if (!xmlDoc) { loadIndex(); } // get the search term from a form field with id 'searchme' var searchterm = document.getElementById("searchme").Value; var allitems = xmlDoc.getElementsByTagName("row" ); 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.lastChild.nodeValue; var exp = new RegExp(searchterm,"i"); if ( name.match(exp) != null) { results.push(allitems); } }// send the results to another function that displays them to the user showResults(results, searchterm); }}// Write search results to a tablefunction showResults(results, searchterm) { if (results.length > 0) {// if there are any results, write them to a table document.write('<div><a href="search2.html">New Search</a></div>You searched for <b><i>'+searchterm+'</i></b><br><br>'); document.write('<table border="1" style="width: 100%;">'); document.write('<tr><th>category</th><th>title</th><th>name</th><th>first name></th><th>country</th><th>language</th><th>year</th><th>With</th></tr>'); for(var i=0; i<results.length; i++) { document.write('<tr>'); document.write('<td>' + results.getAttributeNode("category") + '</td>'); document.write('<td>' + results.getAttributeNode("title") + '</td>'); document.write('<td>' + results.getAttribute("name") + '</td>'); document.write('<td>' + results.getAttribute("first name") + '</td>'); document.write('<td>' + results.getAttribute("country") + '</td>'); document.write('<td>' + results.getAttribute("language") + '</td>'); document.write('<td>' + results.getAttribute("year") + '</td>'); document.write('</tr>'); } document.write('<table>'); document.close(); } else {// else tell the user no matches were found var notfound = alert('No results found for '+searchterm+'!'); }}</script></head><body> <form name="frmMain" id="frmMain" action="" onsubmit="searchIndex(); return false;"><b>Search: </b><br><br><input type="radio" name="criteria" value="category" checked="checked">category <input type="radio" name="criteria" value="title">title <input type="radio" name="criteria" value="name">name <input type="radio" name="criteria" value="first name">first name <input type="radio" name="criteria" value="country">country <input type="radio" name="criteria" value="language">language <input type="radio" name="criteria" value="year">year <br><br><input id="searchme" type="text" size="20"> <br><br><input type="submit" value="Submit" id="btnSearch" /></form></body></html>***********************I think I have to declare the table headings somehow yet, but I don't really know how to do it.after that, those lines are probably wrong for my case?: var searchterm = document.getElementById("searchme").Value; var allitems = xmlDoc.getElementsByTagName("row" );Any help would be appreciated./Roger Link to comment Share on other sites More sharing options...
rogerg Posted January 28, 2012 Author Share Posted January 28, 2012 ok, any idea how to do a simple search function in JS that would work if I have an xml with <row><Heading0>a</Heading0><Heading1>b</Heading1><Heading2>c</Heading2><Heading3>d</Heading3><Heading4>e</Heading4><Heading5>f</Heading5><Heading6>g</Heading6></row> Link to comment Share on other sites More sharing options...
justsomeguy Posted January 30, 2012 Share Posted January 30, 2012 What does the code above do? Or, what does it not do? Are there any errors? Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.