onyx Posted June 30, 2009 Report Share Posted June 30, 2009 Hey guys, new to this forum... I am working on an Ajax autosuggest for an offline browser-based GPLd accounting app. Everything is working except the keyboard control to enter the Suggestion DIV, selecting the first < li >. ANY Tips?? Code below: function findPos(obj) { //find the REAL position of the parent object, especially useful when scrolling can occur var curleft = curtop = 0; if (obj.offsetParent) { do { curleft += obj.offsetLeft; } while (obj = obj.offsetParent); return [curleft]; } } function jQajax(ipfield,ajd,dbtable,company,select,element){ if (!ipfield || !ajd || !dbtable || !company || !select || !element){alert("Parameters not sent to ajax handler correctly; Input to act on, Ajax Div, Database table to check, Company (database name), Field to select, Element Id. "); return false;} actobj="#"+ipfield;// set the active object for jQuery ajdiv="#"+ajd; //set the ajax responding div //var offset = $(actobj).offset(); //leftpos= offset.left; leftpos = findPos($(actobj)); var width = $(actobj).width()-2; $(ajdiv).css("left",leftpos); $(ajdiv).css("width",width); $(actobj).keyup(function(event){ //alert(event.keyCode); //Key presses you need to know: 40=down 38=up 13=Enter 27=ESC 8=Bkspc 46=DEL var keyword = $(actobj).val(); if(keyword.length) { if(event.keyCode != 40 && event.keyCode != 38 && event.keyCode != 13) { $.ajax({ type: "GET", url: "includes/ajax_server.php", cache: false, data: "company="+company+"&data="+keyword+"&table="+dbtable+"&select="+select, success: function(msg){ if(msg != 0) $(ajdiv).fadeIn("slow").html(msg); else $(ajdiv).fadeOut("slow"); } }); } else { switch (event.keyCode) { case 40: //alert("you pressed down"); { found = 0; $("li").each(function(){ if($(this).attr("class") == "selected") found = 1; }); if(found == 1) { var sel = $("li[class='selected']"); sel.next().addClass("selected"); sel.removeClass("selected"); } else $("li:first").addClass("selected"); } break; case 38: { found = 0; $("li").each(function(){ if($(this).attr("class") == "selected") found = 1; }); if(found == 1) { var sel = $("li[class='selected']"); sel.prev().addClass("selected"); sel.removeClass("selected"); } else $("li:last").addClass("selected"); } break; case 13: $(ajdiv).fadeOut("slow"); $(actobj).val($("li[class='selected'] a").text()); loadSkuDetails(element); $(ajdiv).fadeOut("slow"); break; } } } else $(ajdiv).fadeOut("slow"); }); $(ajdiv).mouseover(function(){ $(this).find("li a:first-child").mouseover(function () { $(this).addClass("selected"); }); $(this).find("li a:first-child").mouseout(function () { $(this).removeClass("selected"); }); $(this).find("li a:first-child").click(function () { $(actobj).val($(this).text()); loadSkuDetails(element); $(ajdiv).fadeOut("slow"); }); }); }; Quote Link to comment Share on other sites More sharing options...
administrator Posted July 19, 2009 Report Share Posted July 19, 2009 Sorry guy. I haven't gone deep into jQuery and keyboard/keystroke trapping. Stefan Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.