WEB Need some JS help? Possible paypal reward

Discussion in 'OT Technology' started by Insert Tokens, Nov 4, 2009.

  1. Insert Tokens

    Insert Tokens Making Cancer My Bitch OT Supporter

    Joined:
    Jan 12, 2006
    Messages:
    8,330
    Likes Received:
    76
    Location:
    Tasmania
    I have an Excel spreadsheet with a Vlookup, so a person can enter a 4 digit number, and finds a row that has that 4 digit number in column A, and pulls out the associated columns B, C, D, E, and F from that row.

    The numbers are NOT sequential, so it's not as simple as an ordered list.. they're IDs for items, and can be any 4 digit number.

    So for example, I have this (but 3000 rows, and the N/A's sometimes have values):

    Code:
    0010	2 hrs		N/A	N/A	N/A	1.3G
    0012	12 hrs		 N/A	N/A	N/A	1.4S
    0014	12 hrs		 N/A	N/A	N/A	1.4S
    0015	2 hrs		 N/A	N/A	N/A	1.2G
    0016	2 hrs		 N/A	N/A	N/A	1.3G
    0018	2 hrs		 N/A	N/A	N/A	1.2G
    0019	2 hrs		 N/A	N/A	N/A	1.3G
    0020	2 hrs		 N/A	N/A	N/A	1.2K
    
    I need to turn this excel spreadsheet + vlookup, into a standalone HTML file that only uses JS (no serverside PHP, database, etc).. so our docks can use their laptops to look up values quick with no net connection. Reason it needs to be HTML, is so we can duplicate it onto our website, but they can save that page and it still works.

    I don't mind data-entering the spreadsheet into JS arrays if required, or an XML file, or whatever.. but what's the best way to do this?

    I kind've had it working doing this.. using some copypasta'd crap found via google, but it's messy and seems like a real roundabout way to do it:

    Code:
    <html>
    <head>
    <title>UN Lookup</title>
    
    <script type="text/javaScript">
    // Array of UN Numbers, that helps us search quicker.
    theList = new Array()
    theList[0] = '0000';
    theList[1] = '0001';
    theList[2] = '0002';
    theList[3] = '0003';
    theList[4] = '0004';
    
    var dataStore = new Array();
    // Array of Results, associated to the above UN Numbers.
    dataStore[0] = new Array("0000", "Not Found", "Not Found", "Not Found");
    dataStore[1] = new Array("0001", "N/A", "N/A", "6 Hours");
    dataStore[2] = new Array("0002", "N/A", "6 Hours", "12 Hours");
    dataStore[3] = new Array("0003", "2 Hours", "4 Hours", "6 Hours");
    dataStore[4] = new Array("0004", "This is", "a string", "of text");
    
    function binarySearch(theList, key)
    {
    var left = 0;
    var right = theList.length - 1;
     
    while (left <= right)
    {
    var mid = parseInt((left + right)/2);
    if (theList[mid] == key)
    return mid;
    else if (theList[mid] < key)
    left = mid + 1;
    else
    right = mid - 1;
    }
     
    //when element is not found
    return "0";
    }
     
    function search()
    {
    var findUN = document.DGForm.elements[0].value;
    var elementFound = binarySearch(theList,findUN);
    // document.getElementById('DGresults').innerHTML = 'Your results are in Array item: ' + elementFound; 
    
    document.getElementById('DGresults1').innerHTML = dataStore[elementFound][1]; 
    document.getElementById('DGresults2').innerHTML = dataStore[elementFound][2]; 
    document.getElementById('DGresults3').innerHTML = dataStore[elementFound][3]; 
    }
     
    </script>
    </head>
    
    <body style="font: 14px Calibri">
    
    <div style="margin: 0 auto; width: 400px; padding: 50px; background-color: #eee">
    	<form name="DGForm">
    		<h1 style="margin:0 0 30px 0; padding:0; font: 24px Calibri; border-bottom: 1px solid #ffae00">Lookup</h1>
    		UN Number <input type=TEXT name="UNnumber">
    		<a href="javascript:search()">SUBMIT</a>
    	</form>
    	
    	<!--<div id="DGresults" style="font:14px Calibri"></div>-->
    
    	<div style="width: 103px; float: left; margin: 0 5px; padding: 10px; background: #ddd">Packing Group I</div>
    	<div style="width: 103px; float: left; margin: 0 5px; padding: 10px; background: #ddd">Packing Group II</div>
    	<div style="width: 103px; float: left; margin: 0 5px; padding: 10px; background: #ddd">Packing Group III</div>
    	<br clear="all">	
    	<div id="DGresults1" style="width: 103px; float: left; height: 50px; margin: 0 5px; padding: 10px; background: #fff; font-size: 22px"></div>
    	<div id="DGresults2" style="width: 103px; float: left; height: 50px; margin: 0 5px; padding: 10px; background: #fff; font-size: 22px"></div>
    	<div id="DGresults3" style="width: 103px; float: left; height: 50px; margin: 0 5px; padding: 10px; background: #fff; font-size: 22px"></div>
    	<br clear="all">
    	
    </div>
    
    </body>
    </html>
    
     
  2. Ender0910

    Ender0910 woot!

    Joined:
    Jun 1, 2004
    Messages:
    3,039
    Likes Received:
    0
    Location:
    Redmond/Bay Area
    a 3000 item non-js table would be pretty heavy, but perhaps that's a quick solution that the users could ctrl-f on?

    how is the lookup done? By ID match only or is it a search?

    edit: read the post again. yeah that wouldn't be too hard.

    so the results will ALWAYS just be a single row (assuming it exists)?
     
  3. Insert Tokens

    Insert Tokens Making Cancer My Bitch OT Supporter

    Joined:
    Jan 12, 2006
    Messages:
    8,330
    Likes Received:
    76
    Location:
    Tasmania
    Done by ID lookup only.

    User types in a 4 digit ID number, I need to dislpay the row of data associated to that ID number.

    This is a lot of code cos of the arrays, but skip past them and you'll see I have it semi-working with this.. problem is, the binary-search doesn't work properly because the ID numbers aren't in order.. and I can't put them in order, because they're given to me as-is, and they have to go online as-is (they're exported from a tracking system).. so some match, some fail.. no idea why. This is ALL beyond my skills, i've just been asked to try get it working.. :hsd:

    View source of: http://temporarycitizen.com/sen/lookup.html
     
  4. Insert Tokens

    Insert Tokens Making Cancer My Bitch OT Supporter

    Joined:
    Jan 12, 2006
    Messages:
    8,330
    Likes Received:
    76
    Location:
    Tasmania
    It seems like it should be so basic.. and it probably is, i'm just FRIED from trying to find the best way to do this.

    In reality, all I need is to match the ID to a array item, and pull out it's elements.

    My brain is fried.

    This'd be like 5 lines of code and take 2 minutes to do in PHP/MySQL, but that's not an option in this situation.
     
  5. Ender0910

    Ender0910 woot!

    Joined:
    Jun 1, 2004
    Messages:
    3,039
    Likes Received:
    0
    Location:
    Redmond/Bay Area
    I was going to suggest a binary search :p But like you said, it won't work if it's unsorted.

    So why don't you replace that binary search with a brute force linear search. If there's only 1 match it will only take about 3000 checks at worst :)

    Code:
    for(var i=0; i < ids.length; i++){
     if(ids[i] == searchID) return i;
    }
    
    I can't reach your webpage, btw. Don't know if you're working on it or what
     
  6. Insert Tokens

    Insert Tokens Making Cancer My Bitch OT Supporter

    Joined:
    Jan 12, 2006
    Messages:
    8,330
    Likes Received:
    76
    Location:
    Tasmania
    Hrm page is up for me.. weird, and nah, not working on it there.. just put that copy there to share it in this thread..

    Only reason I went binary search instead of brute search is the idea of handing over that resource to the user's PC.. we're a shipping company, so high-end PCs aren't exactly a priority in our industry ;) Lots of people have really old PCs. The idea of bruting 3000 lines is trivial for a normal modern PC, but if 1 user happens to have some shitty 10yr old machine, that'll be the user that complains ;)

    I'll try it though, and see how it tests.. cheers.
     
  7. Insert Tokens

    Insert Tokens Making Cancer My Bitch OT Supporter

    Joined:
    Jan 12, 2006
    Messages:
    8,330
    Likes Received:
    76
    Location:
    Tasmania
    Ack ok I think I got it working.. messy as hell, but it works.. and it won't make a difference to the guys who are using it, as long as it works.

    Longer term I gotta find a better way of doing it.. JS destroys my brain cells though.
     

Share This Page