jQuery auto suggest

JavaScript
1

Hi,

I am following the following example to create predictive text pull out of the database…

http://papermashup.com/jquery-php-ajax-autosuggest/

Seemed quite easy but it seems like it’s not working for me, maybe because i’m doing something wrong?

This is the page:

http://www.prima.cse.salford.ac.uk:8080/~ibrarhussain/view/test.php

If you start typing in the big search box the suggestions box appears in the wrong place, and it should be returning some results but it’s not.

This is my autoSuggest.php file:


   $db = new mysqli('***', '***' ,'****', '****');
	
	if(!$db) {
	
		echo 'Could not connect to the database.';
	} else {
	
		if(isset($_POST['queryString'])) {
			$queryString = $db->real_escape_string($_POST['queryString']);
			
			if(strlen($queryString) >0) {

				$query = $db->query("SELECT CPtitle FROM ConfPaper WHERE CPtitle LIKE '$queryString%' LIMIT 10");
				if($query) {
				echo '<ul>';
					while ($result = $query ->fetch_object()) {
	         			echo '<li onClick="fill(\\''.addslashes($result->CPtitle).'\\');">'.$result->CPtitle.'</li>';
	         		}
				echo '</ul>';
					
				} else {
					echo 'OOPS we had a problem :(';
				}
			} else {
				// do nothing
			}
		} else {
			echo 'There should be no direct access to this script!';
		}
	}

And finally this is the JavaScript:


    <script type="text/javascript">
    function suggest(inputString){
                    if(inputString.length == 0) {
                            $('#suggestions').fadeOut();
                    } else {
                    $('#documents').addClass('load');
                            $.post("includes/autosuggest.php", {queryString: ""+inputString+""}, function(data){
                                    if(data.length >0) {
                                            $('#suggestions').fadeIn();
                                            $('#suggestionsList').html(data);
                                            $('#documents').removeClass('load');
                                    }
                            });
                    }
            }

            function fill(thisValue) {
                    $('#documents').val(thisValue);
                    setTimeout("$('#suggestions').fadeOut();", 600);
            }
    </script>

Can you see an obvious problem with what i am doing?

Thanks

2

I managed to get it working, it was a school boy error!

misspelled a variable :lol:

Thanks