From b1371fdb3ebd567d96952e39cfc1ef60b87e861c Mon Sep 17 00:00:00 2001 From: Jocavdh Date: Tue, 5 Jun 2018 15:05:09 +0200 Subject: [PATCH] Added autocomplete as part of a user session. Hooray, no more autocomplete based on other users!! --- app/__init__.py | 1 - app/static/js/app.js | 80 ++++------------------------------- app/templates/base.html | 1 + app/templates/show_books.html | 1 + app/views.py | 14 ++++-- 5 files changed, 21 insertions(+), 76 deletions(-) diff --git a/app/__init__.py b/app/__init__.py index b2dc543..ceebaa6 100755 --- a/app/__init__.py +++ b/app/__init__.py @@ -40,4 +40,3 @@ app.config.from_object(__name__) from app import views flask_whooshalchemyplus.init_app(app) # initialize - diff --git a/app/static/js/app.js b/app/static/js/app.js index 460c9ee..29adeff 100755 --- a/app/static/js/app.js +++ b/app/static/js/app.js @@ -160,10 +160,10 @@ $(document).ready(function() // Autocomplete for search - Contact Joca in case of trouble + $('#search').on("input", function() { var query = this.value; - $.ajax({ url: "/autocomplete_suggestions", data: $('form').serialize(), @@ -173,83 +173,21 @@ $('#search').on("input", function() { } }); - function getData() { - var deferredData = new jQuery.Deferred(); $.ajax({ type: "GET", url: "/autocomplete_suggestions", dataType: "json", success: function(data) { - deferredData.resolve(data); - } - }); - return deferredData; // contains the passed data - }; - - var dataDeferred = getData(); - - $.when(dataDeferred).done( function( data ) { - var suggestion_list = data; - console.log(suggestion_list); - $().ready(function() { - // search only, if the regexp matches - var suggestions = data; - - // Defines for the example the match to take which is any word (with Umlauts!!). - function _leftMatch(string, area) { - //return string.substring(0, area.selectionStart).match(/[\wäöüÄÖÜß]+$/) - //console.log(string.substring(string.lastIndexOf(" ")+1).match(/[\wäöüÄÖÜß]+$/)) - return string.substring(string.lastIndexOf(" ")+1).match(/[\wäöüÄÖÜß]+$/) - - } - - function _setCursorPosition(area, pos) { - if (area.setSelectionRange) { - area.setSelectionRange(pos, pos); - } else if (area.createTextRange) { - var range = area.createTextRange(); - range.collapse(true); - range.moveEnd('character', pos); - range.moveStart('character', pos); - range.select(); - } - } - - - - $("#search").autocomplete({ - position: { my : "right top", at: "right bottom" }, - source: function(request, response) { - var str = _leftMatch(request.term, $("#search")[0]); - str = (str != null) ? str[0] : ""; - console.log(str); - response($.ui.autocomplete.filter( - suggestions, str)); - }, - minLength: 1, // does have no effect, regexpression is used instead - focus: function() { - // prevent value inserted on focus - return false; - }, - // Insert the match inside the ui element at the current position by replacing the matching substring - select: function(event, ui) { - //alert("completing "+ui.item.value);}, - var m = _leftMatch(this.value, this)[0]; - var beg = this.value.substring(0, this.selectionStart - m.length); - this.value = beg + ui.item.value + this.value.substring(this.selectionStart, this.value.length); - var pos = beg.length + ui.item.value.length; - _setCursorPosition(this, pos); - return false; - }, - search:function(event, ui) { - var m = _leftMatch(this.value, this); - return (m != null ) - } - - }); - }) + // Start autocomplete + var availableTags = data; + console.log(availableTags); + $( "#search" ).autocomplete({ + source: availableTags + }); + // End of autocomplete + } }); }); diff --git a/app/templates/base.html b/app/templates/base.html index cae3d58..9af5ed1 100755 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -15,6 +15,7 @@ + {% block css %} {% endblock%} diff --git a/app/templates/show_books.html b/app/templates/show_books.html index 27f539a..4171fef 100755 --- a/app/templates/show_books.html +++ b/app/templates/show_books.html @@ -3,6 +3,7 @@ {% block main %}
{% from "_formhelpers.html" import render_field %} +
{{ form.select(style="width: 100px; margin: 10px; float: left; font-size: 20px") }}