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 1 of 1
  1. #1
    Regular Coder
    Join Date
    Mar 2010
    Posts
    235
    Thanks
    39
    Thanked 6 Times in 6 Posts

    Autocomplete arrow up arrow down

    I am requesting assistance in the final step of an autocomplete script. I'm still new to jQuery. I picked this script up online and made a few updates to it. After reviewing in Firebug, I have the errors removed, but the script is not allowing me to arrow up or arrow down in the drop down list.

    Try typing the word "division". Then arrow down. I would like the arrow down/arrow up to load the value of the selection into #sbox.

    http://www.mathcelebrity.com/topmenu2.php

    PHP Code:
    <input type="text" name="searchInput" id="sbox" maxlength="150" size="18" value="" onkeyup="lookup(this.value)">&nbsp;<input TYPE="submit" id="sbox" VALUE="GO!" name="pl" onblur="fill();">
    <
    div class="suggestionsBox" id="suggestions" style="display: none;">

    <
    div class="suggestionList" id="autoSuggestionsList">

    </
    div>

    </
    div>



    <
    script type="text/javascript">
    function 
    lookup(inputString){

    if (
    inputString.length == 0){
    $(
    '#suggestions').hide();
    }
    else{

    $.
    post("calcsave.php", {xterm""+inputString+""}, function(data){

    if(
    data.length>0){
    $(
    '#suggestions').show();
    $(
    '#autoSuggestionsList').html(data);
    // end data.length

    });

    }

    // end lookup function

    function fill(thisValue) {
    $(
    '#sbox').val(thisValue);
    setTimeout("$('#suggestions').hide();"200);
    // end fill function


            
    $('#sbox').keypress(function(e) {                                       
    if (
    window.currentIndex===undefined) {currentIndex 0;}
    input = $('#sbox');  
    input.suggestionsList = $('ul#suggestions');    
    input.active 'active_li';
    input.items document.getElementById('autoSuggestionsList').getElementsByTagName('li');

                switch(
    getEventCode(e)) {
                    case 
    13 //prevent form submission through the enter button
                        
    $('#sbox').val($(input.items[currentIndex-1]).html());
                        return 
    false;
                        break;
                    case 
    38 :
                        
    go("up");
                        break;
                    case 
    40 :
                        
    go("down");
                        break;
                    case 
    27 :
                        break;
                    default :
                        
    //go("nowhere")
                        
    break;
                }
        });

        
    go = function(where) {
            
    last currentIndex;
            
    currentIndex += (where == "down") ? : -1;
            if (
    currentIndex 1currentIndex input.items.length;
            if (
    currentIndex input.items.lengthcurrentIndex 1;
            
    selectItem(currentIndexlast);
        }

        
    selectItem = function(indexlastIndex) {
            for ( 
    =1<= input.items.lengthi++ ) {
                if (
    == index) {
                    
    thisElem input.items[i-1];
                    $(
    thisElem).addClass(input.active);
                }

                if (
    == lastIndex) {
                    
    thisElem input.items[i-1];
                    $(
    thisElem).removeClass(input.active);
                }
            }
        }

        
    submitForm = function() {
            
    value input.items[currentIndex-1].html();
            $(
    'input#sbox').val(value);

        }

        
    reset = function() {
            
    currentIndex 0;
        }

            
    getEventCode = function(evt) {
               
    code null;
               if (!
    evtevt window.event;
               
    code evt.keyCode;
               return 
    code;
            }


    </script> 
    Last edited by mathceleb; 02-17-2011 at 08:12 PM.


 

Posting Permissions

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