Find solution
how to write to java file in the best way?

Write java script for a webpage that will 1) seach an Excel File 2) return hits

  • BACKGROUND I have an Excel file that contains several rows (~360) of data. Each row has several columns worth of data, such as serial number, name, and location. IDEAL ANSWER Create a webpage with java script that has a "search box." If I enter a string (or substring)of numbers, it searches the excel file for a match or matches. It then returns a webpage that either notes that there are no matches, or returns a webpage that contains the entire row of data for each correct match. To rephrase, I don't want it to link to the excel file, I want it to find a match in the rows, then take that row/those rows of data and present it/them on the returned page. HELPFUL NOTES: -this webpage, the excel file, etc will all be OFFLINE. What I mean is, it does not need to be able to search an excel file outside of the same folder that the search page is in. -there is only ONE Excel file that needs to be searched. -the string of numbers to be searched should be able to be a substring of the serial number, e.g. if I enter 456 it should find the match in 123456789. -Prefer it to not be case sensitive. -a "heavily commented" answer is most appreciated, so that if I have to tweak I'll know what the heck I'm tweaking. -be aware that this will be used on a PocketPC with Pocket Internet Explorer. However, if your answer works on a PC but NOT on a PocketPC, I'll be OK with that, as I realize that would be asking a little much. It's a shot in the dark. CAVEAT NOTE: If there is some technical reason why this can't be done, such as "java script can't search an Excel file," please let me know and I'll consider changing the requirement to searching another webpage/database and then I'd have to first change the excel file to that format.

  • Answer:

    Hi Ken3141, Happy to hear my suggestion is acceptable to you! Here are the results. Anything you want to have changed, or which doesn't work for you, let me know and we'll take it through the clarifications. Note there is a simple phrase vs keywords differentiation (try entering _is a_ versus _"is a"_). Also check the comments for things that can be easily adapted by you (like the highlight style). ------------ "index.html" file follows below ------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>CSV Search</title> <style><!-- body { background-color: white; color: black; font-family: arial, helvetica, sans-serif; } /* The result-found highlight style for a matching string, can be changed. For example, you could give it a yellow background-color (see comment). */ .hilite { color: red; /* background-color: yellow; */ font-weight: bold; } table { border-collapse: collapse; border: 1px solid black; } td { text-align: left; vertical-align: top; padding: 6px; border: 1px solid black; width: 120px; } /* Two row background-colors to seperate rows; can be changed: */ tr td { background-color: #eee; } tr.alternateRow td { background-color: #ccc; } #excel { display: none; } --></style> <script type="text/javascript"><!-- // Row and column separator // characters, can be changed: var rowSeparator = "~"; var columnSeparator = ";"; var resultsI = 0; function searchData() { var data = getData(); var search = document.getElementById("searchString").value; var arrRows = data.split(rowSeparator); var rowsLength = arrRows.length; var s = ""; search = replaceStr(search, " ", " "); var phraseSearch = ( search.indexOf("\"") >= 0 ); if (phraseSearch) { resultsI = 0; search = replaceStr(search, "\"", ""); s += getMatchingRows(arrRows, search); if (s != "") { s = "<p>" + resultsI + " results found for phrase \"" + search + "\":</p> " + "<table>" + s + "</table>"; } } else { var searchWords = search.split(" "); var wordsLength = searchWords.length; for (var i = 0; i < wordsLength; i++) { resultsI = 0; if (searchWords[i] != "") { var thisS = getMatchingRows(arrRows, searchWords[i]); if (thisS != "") { thisS = "<p>" + resultsI + " results found for \"" + searchWords[i] + "\":</p> " + "<table>" + thisS + "</table>"; s += thisS; } } } } if (resultsI < 1) { // No results output s = "<p><em>No results matching \"" + search + "\" were found.</em></p>"; } var outputLayer = document.getElementById("dataOutput"); outputLayer.innerHTML = s; document.getElementById("h1data").innerHTML = "Results"; searchForm.style.display = "none"; newSearchLink.style.display = "block"; } function newSearch() { var outputLayer = document.getElementById("dataOutput"); outputLayer.innerHTML = ""; searchForm.style.display = "block"; newSearchLink.style.display = "none"; document.getElementById("h1data").innerHTML = "Search Data"; } function getMatchingRows(arrRows, search) { var sRow = ""; var isAlternate = false; var rowsLength = arrRows.length; var lowSearch = search.toLowerCase(); for (var i = 0; i < rowsLength; i++) { var row = arrRows[i]; if ( row.toLowerCase().indexOf(lowSearch) >= 0 ) { // Construct a table row with matches // to display later: var classString = (isAlternate) ? " class=\"alternateRow\"" : ""; var rowDisplay = replaceStr(row, search, "<span class=\"hilite\">" + search + "</span>"); sRow += "<tr" + classString + "><td>"; sRow += replaceStr(rowDisplay, columnSeparator, "</td><td>"); sRow += "</td></tr>"; isAlternate = !isAlternate; resultsI++; } } return sRow; } function getData() { var excelLayer = document.getElementById("excel"); return excelLayer.firstChild.data; } function replaceStr(str, oldStr, newStr) { var strPos = str.indexOf(oldStr); return (strPos >= 0) ? str.substring(0, strPos) + newStr + replaceStr( str.substring(strPos + oldStr.length), oldStr, newStr ) : str; } // --></script> </head> <body> <h1 id="h1data">Search Data</h1> <form id="searchForm"> <p> Your query: <input type="text" size="20" name="searchString" id="searchString" /> <input type="text" name="suppressReturn" style="display: none;" /> <input type="button" onclick="searchData()" value="Search" /> </p> </form> <div id="dataOutput"> &nbsp; </div> <div id="newSearchLink" style="display: none;"> <p>[<a href="javascript:newSearch()">New search ...</a>]</p> </div> <div id="excel"> d;3;40~this;is a;test~this;is a second;test~testing yet;again;... </div> <p>Copyright &copy; 2003 by Ken</p> </body> </html>

ken3141-ga at Google Answers Visit the source

Was this solution helpful to you?

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.