Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jun 2008
    Posts
    682
    Thanks
    114
    Thanked 2 Times in 2 Posts

    Search Form Troubles

    There is an issue somewhere in this code. It is an assignment for debugging the code and I've gone through all of the code and can not find why it won't show the results regardless when someone submits the search form.

    Code:
    // Create privatized scope using a self-executing function
    (function() {
    	
    	// Variable initialization (DO NOT FIX ANY OF THE BELOW VAR's)
    	var resultsDIV = document.getElementById("results"),
    		searchInput = document.forms[0].search,
    		currentSearch = ''
    	;
    
    	// Validates search query
    
    	var validate = function(query) {
    		
    		// Trim whitespace from start and end of search query
    		while(query.charAt(0) === " ") {
    			query = query.subString(1, query.length);
    		};
    		while(query.charAt(query.length-1) === "") {
                query = query.subString(0, query.length - 1);
            };
    		
    		// Check search length, must have 3 characters
    		if(query.length < 3) {
    			alert("Your search query is too small, try again.");
    			
    			// (DO NOT FIX THE LINE DIRECTLY BELOW)
    			searchInput.focus();
    			return;
    		};
    		
    		search(query);
    	};
    	
    	// Finds search matches
    	var search = function(query) {
    
    		// split the user's search query string into an array
    		var queryArray = query.split(" ");
    
    		// array to store matched results from database.js
    		var results = [];
    
    		// loop through each index of db array
    		for(var i=0, j=db.length; i<j; i++) {
    
                // each db[i] is a single video item, each title ends with a pipe "|"
                // save a lowercase variable of the video title
                var dbTitleEnd = db[i].indexOf('|');
                var dbitem = db[i].toLowerCase().subString(0, dbTitleEnd);
    
                // loop through the user's search query words
                // save a lowercase variable of the search keyword
                for (var ii = 0, jj = queryArray.length; ii < jj; ii++) {
                    var qitem = queryArray[ii].toLowerCase();
    
                    // is the keyword anywhere in the video title?
                    // If a match is found, push full db[i] into results array
                    var compare = dbitem.indexOf(qitem);
                    if (compare !== -1) {
                        results.push(db[i]);
                    };
                };
            };
    
    		results.sort();
    		
    		// Check that matches were found, and run output functions
    		if(results.length === 0) {
    			noMatch();
    		}else{
    			showMatches(results);
    		};
    
    	};
    	
    	// Put "No Results" message into page (DO NOT FIX THE HTML VAR NOR THE innerHTML)
    	var noMatch = function() {
    		var html = ''+
    			'<p>No Results found.</p>'+
    			'<p style="font-size:10px;">Try searching for "JavaScript".  Just an idea.</p>'
    		;
    		resultsDIV.innerHTML = html;
    	};
    	
    	// Put matches into page as paragraphs with anchors
    	var showMatches = function(results) {
    		
    		// THE NEXT 4 LINES ARE CORRECT.
    		var html = '<p>Results</p>', 
    			title, 
    			url
    		;
    		
    		// loop through all the results search() function
    		for(var i=0, j=results.length; i<j; i++) {
    		
    			// title of video ends with pipe
    			// pull the title's string using index numbers
    			titleEnd = results[i].indexOf('|');
    			title = results[i].subString(0, titleEnd);
    			
    			// pull the video url after the title
    			url = results[i].subString(results[i].indexOf('|')+1, results[i].length);
    			
    			// make the video link - THE NEXT LINE IS CORRECT.
    			html += '<p><a href=' + url + '>' + title + '</a></p>';
    		};
    		resultsDIV.innerHTML = html; //THIS LINE IS CORRECT.
    	};
    	
    	// The onsubmit event will be reviewed in upcoming Course Material.
    	// THE LINE DIRECTLY BELOW IS CORRECT
    	document.forms[0].onsubmit = function() {
            var query = searchInput.value;
    
            validate(query);
    
            // return false is needed for most events - this will be reviewed in upcoming course material
            // THE LINE DIRECTLY BELOW IS CORRECT
            return false;
        };
    
    })();

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Have you tried using your error console (F12 key)?

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    Regular Coder low tech's Avatar
    Join Date
    Dec 2009
    Posts
    851
    Thanks
    172
    Thanked 93 Times in 93 Posts
    Hi

    Took me 15 minutes using the error console. Slow I know.

    My point is to encourage you to persevere and you'll feel better having found it yourself.
    Last edited by low tech; 05-14-2014 at 08:49 AM.
    "The greatest revenge is to accomplish what others say you cannot do."
    ~ Unknown

    I used to be indecisive, but now I'm not so sure.

  • #4
    Regular Coder
    Join Date
    Jun 2008
    Posts
    682
    Thanks
    114
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by low tech View Post
    Hi

    Took me 15 minutes using the error console. Slow I know.

    My point is to encourage you to persevere and you'll feel better having found it yourself.
    I've been at this for two days and my teacher won't help me.

  • #5
    Regular Coder low tech's Avatar
    Join Date
    Dec 2009
    Posts
    851
    Thanks
    172
    Thanked 93 Times in 93 Posts
    I sent you a pm with some specific debug advice to get you going.

    You can also read

    https://developer.chrome.com/devtools/index


    Specifically:
    https://developer.chrome.com/devtool...ript-debugging
    Last edited by low tech; 05-15-2014 at 02:24 AM.
    "The greatest revenge is to accomplish what others say you cannot do."
    ~ Unknown

    I used to be indecisive, but now I'm not so sure.


  •  

    Posting Permissions

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