Ключ автозаполнения Ajax всегда неопределен

Question

Я использую автозаполнение, он прекрасно работает, когда я удаляю phpspellcheck api. но когда я использую это. всегда говорят, что ключ не определен . Я думаю, прежде чем ответить на мой spellcheck api Ajax работает. как запустить сначала проверку орфографии api, затем ajax.

$("#school-searchbox-wrapper > .search").autocomplete({
                source: function (request, response) {
                    var keys = request.term;
                    //console.log(key);
                    var mySpellInstance = new LiveSpellInstance()   
                    mySpellInstance.AjaxDidYouMean(request.term);
                    mySpellInstance.onDidYouMean = function(suggestion, original){
                        var message="";
                        if(suggestion!=""){
                            var key = suggestion; 
                            //alert(key);     
                        }else{
                                var key = keys;
                        }
                    }

                    console.log(key);
                    $.ajax({
                        async: false,
                        url: SITE_URL + "books/search/school",
                        dataType: "json",
                        data: {
                            q: key
                        },
                        success: function (data) {
                            console.log(data);
                            response(data.response);
                        }
                    });
                },
                focus: function (event, ui) {
                    //$( "#search" ).val( ui.item.title ); // uncomment this line if you want to select value to search box  
                    return false;
                },
                select: function (event, ui) {
                    window.location.href = "book-detail.php?id=" + ui.item.id;
                }
            }).data("ui-autocomplete")._renderItem = function (ul, item) {
                var inner_html = "<div class='ui-menu-item-wrapper'>" + item.name + "</div>";
                return $("<li></li>")
                        .data("item.autocomplete", item)
                        .append(inner_html)
                        .appendTo(ul);
            }