您选择的 Ruby-on-Rails 很适合这个问题:
- 将每个日记条目存储为数据库条目
- 使用“全文搜索”搜索这些条目 - 无论是在数据库上还是在第三方上
- 用 JS 返回“实时”功能
MVC
Rails 使用MVC programming pattern 让您能够保存到数据库中。这很重要,因为如果您要在 Rails 中进行开发,则需要遵守 MVC 模式:
基本上,您将日记条目保存在database 中,使用controller 处理数据并使用view 显示数据:
#app/models/entry.rb
Class Entry < ActiveRecord::Base
#-> stores & brings back the entry data
end
#app/controllers/entries_controller.rb
Class EntriesController < ApplicationController
respond_to :js, :html, :json, only: :search
def index
@entries = Entry.all
end
def search
@entries = Entry.search params[:query]
respond_with @entries
end
end
#config/routes.rb
resources :entries do
collection do
match :search, via [:get, :post]
end
end
--
全文搜索
当您将请求发送到您的控制器时,您处理搜索的方式将是在您的 Entry 模型中使用 class method(这是您从中获取数据的地方),或者引用 -
#app/models/entry.rb
Class Entry < ActiveRecord::Base
def self.search(query)
where("title LIKE '%#{query}%'")
end
end
您可以使用您正在使用的full text search for the SQL 变体,也可以使用第三方搜索,例如Solr 或其他东西
--
“实时”搜索
您可以使用 Javascript 进行“实时”搜索(例如 here):
有一个number of tutorials 告诉您如何在线执行此操作 - 只需 Google live search rails 或 autocomplete rails。但是,所有实现的原理基本相同:
- JS 将捕获输入到搜索框中的文本
- JS 向 Rails 控制器发送 Ajax 请求
- 控制器向 ajax 发送响应
- JS 响应并在屏幕上显示
注意这主要集中在 JS 元素上吗?这是我们使用的代码:
#app/assets/javascripts/application.js
//Livesearch
$(document).ready( function() {
var base_url = window.location.protocol + "//" + window.location.host;
$('#SearchSearch').searchbox({
url: base_url + '/search/',
param: 'search',
dom_id: '#livesearch',
loading_css: '#livesearch_loading'
})
});
#app/assets/javascripts/livesearch.js
// Author: Ryan Heath
// http://rpheath.com
(function($) {
$.searchbox = {}
$.extend(true, $.searchbox, {
settings: {
url: 'search',
param: 'search',
dom_id: '#livesearch',
minChars: 2,
loading_css: '#livesearch_loading',
del_id: '#livesearch_del'
},
loading: function() {
$($.searchbox.settings.loading_css).show()
},
idle: function() {
$($.searchbox.settings.loading_css).hide()
},
start: function() {
$.searchbox.loading()
$(document).trigger('before.searchbox')
},
stop: function() {
$.searchbox.idle()
$(document).trigger('after.searchbox')
},
kill: function() {
$($.searchbox.settings.dom_id).fadeOut(50)
$($.searchbox.settings.dom_id).html('')
$($.searchbox.settings.del_id).fadeOut(100)
},
reset: function() {
$($.searchbox.settings.dom_id).html('')
$($.searchbox.settings.dom_id).fadeOut(50)
$('#SearchSearch').val('')
$($.searchbox.settings.del_id).fadeOut(100)
},
process: function(terms) {
if(/\S/.test(terms)) {
$.ajax({
type: 'GET',
url: $.searchbox.settings.url,
data: {search: terms.trim()},
complete: function(data) {
$($.searchbox.settings.del_id).fadeIn(50)
$($.searchbox.settings.dom_id).html(data.responseText)
if (!$($.searchbox.settings.dom_id).is(':empty')) {
$($.searchbox.settings.dom_id).fadeIn(100)
}
$.searchbox.stop();
}
});
return false;
}else{
$.searchbox.kill();
}
}
});
$.fn.searchbox = function(config) {
var settings = $.extend(true, $.searchbox.settings, config || {})
$(document).trigger('init.searchbox')
$.searchbox.idle()
return this.each(function() {
var $input = $(this)
$input
.keyup(function() {
if ($input.val() != this.previousValue) {
if(/\S/.test($input.val().trim()) && $input.val().trim().length > $.searchbox.settings.minChars){
$.searchbox.start()
$.searchbox.process($input.val())
}else{
$.searchbox.kill()
}
this.previousValue = $input.val()
}
})
})
}
})(jQuery);