使用远程JSON源+ Google App Engine + Python进行jQuery自动完成

所以,假设我有一个webapp,只是让用户保存自己的爱好。 所以我有这样的善意:

class Hobby(ndb.Model): hobby_name = ndb.StringProperty() 

用户只需使用以下表单创建Hobby实体:

 

然后这个表单由此处理:

 # Handles /new-hobby class NewHobby(webapp2.RequestHandler): def post(self): hobby_name = self.request.get('hobby_name') if hobby_name: h = Hobby(hobby_name = hobby) h.put() app = webapp2.WSGIApplication([ ('/new-hobby/?', NewHobby) ], debug=True) 

这是标准的东西。 通过这种设置,可以看到用户以多种方式进入相同的爱好(例如:“篮球”可以输入“篮球”)。 这是通过增加所有用户的“统一”输入来实现自动完成function的地方。

所以我决定使用Jquery的Multiselect远程自动完成小部件( http://jqueryui.com/autocomplete/#multiple-remote ):

   $(function() { function split( val ) { return val.split( /,\s*/ ); } function extractLast( term ) { return split( term ).pop(); } $( "#birds" ) .bind( "keydown", function( event ) { if ( event.keyCode === $.ui.keyCode.TAB && $( this ).autocomplete( "instance" ).menu.active ) { event.preventDefault(); } }) .autocomplete({ source: function( request, response ) { $.getJSON( "search.php", { term: extractLast( request.term ) }, response ); }, search: function() { var term = extractLast( this.value ); if ( term.length < 2 ) { return false; } }, focus: function() { return false; }, select: function( event, ui ) { var terms = split( this.value ); terms.pop(); // add the selected item terms.push( ui.item.value ); terms.push( "" ); this.value = terms.join( ", " ); return false; } }); });  

远程源在$.getJSON( "search.php",...);行中的代码上方指定$.getJSON( "search.php",...);

所以假设我在正确的轨道上,问题是:我用什么文件替换search.php ,该文件里面应该包含什么?

search.php需要替换为suggetsHobbies.php类的suggetsHobbies.php该文件应该返回一个爱好列表,自动完成工具可以使用它来构建建议的爱好列表。 它被赋予一个参数term ,其中包含用户到目前为止输入的内容。 用它来限制返回的列表。 F.ex. 如果term是“ba”,则返回以“ba”开头的爱好列表。

我认为你应该研究Django包的这种行为。

来自djangopackages.com的这个页面引用了几个完全符合你想要的包,并为Django编写。 我建议你看一下django-autocomplete-light (文档很棒),或django-selectable ,这与你的问题的方法更相似。

Interesting Posts