使用ExtJs4进行Solr实时搜索

时间:2012-03-20 05:23:10

标签: json solr extjs4


我在后端使用solr + haystack(django插件),搜索工作正常;

虽然Django(和Haystack)的模板正在为我做一切(我的意思是配置和使用起来非常简单),但ExtJS4有点复杂;

问题是如何使用ExtJS4使用Solr?

非常感谢一个例子;
感谢您的帮助,对不起我的英语;

2 个答案:

答案 0 :(得分:1)

由于ExtJS4是一个MVC框架,解决方案就像MVC一样完成;

controller / Search.js

Ext.define('yourapp.controller.Search',{
extend:'Ext.app.Controller',

stores:[
    'Searches'
],

views:[
    'search.Search',
    'search.SearchList'
],

models:[
    'Search'
],

init:function(){
    this.control({
        "search":{
            'keyup':this.search,                
        },
    });
},

search:function(inputedTxt, e, eOpts){
    this.getSearchesStore().load({
        //When sending a request, q will rely to request.POST['q'] on server-side;
        //inputedTxt.getValue() -- a value, entered in textfield (or whatever)
        params:{
            q:inputedTxt.getValue()
        },
        callback:function(result){
            if(result[0]){
                //do something with the result
                //i'd been creating a window with a grid inside. "Grid"'s view is written below.
            }
        }               
    }
});

models / Search.js

Ext.define('yourapp.model.Search',{
    extend:'Ext.data.Model',

    fields:[
        {name:'name',   type:'string'}
    ]   
});

store / Searches.js

Ext.define('yourapp.store.Searches',{
extend:'Ext.data.Store',
storeId: "searchStore",

model:'yourapp.model.Search',

autoLoad: false,

proxy:{
    type:'ajax',
    // server-side url
    url: '/searchlist/',

    actionMethods:{create: "POST", read: "POST", update: "POST", destroy: "POST"},
    reader:{
        type:'json',
        root:'searches'
    }
}
});

view / search / Search.js

//a Text field to input text;
Ext.define('yourapp.view.search.Search',{
extend:'Ext.form.field.Text',
alias: 'widget.search',
id:    "searchView",

enableKeyEvents: true,
initComponent:function(){
    this.callParent(arguments);     
}
});

view / search / SearchList.js

//a view for a result
Ext.define('yourapp.view.search.SearchList',{
extend: 'Ext.grid.Panel',

alias:'widget.searchlist',
title: 'search result',
store: 'Searches',

columns:[
        { 
        header:'Name', 
        dataIndex:'name',
        flex:1                      
    }
]
});

应插入视图/ Viewport.js xtype: 'search',中的某处以显示文本字段。

这就是ExtJS4的一部分。


在服务器端 - Django: 应该安装和配置'haystack'和Solr(通过'配置'我的意思是:搜索应该已经在服务器端工作);

someapp / view.py

def searchlist(request):    
    from haystack.query import SearchQuerySet
    # POST["q"] should be receivedt from our client-side
    searchText = request.POST["q"]

    sqs = SearchQuerySet().filter(name=searchText)

    data = []
    for result in sqs:            
        data.append({"name": result.object.name})

return HttpResponse('{ success:true, searches:'+simplejson.dumps(data)+'}', mimetype = 'application/json')

最后在 urls.py 中添加:

(r'^searchlist/','someapp.views.searchlist'),

那是为了它。最好的祝愿。

<强> P.S。
我知道这不是最好的答案而且缺乏解释,但就我而言,我更喜欢代码示例而不是口头解释。

答案 1 :(得分:0)

SOLR使用wt=json参数从其查询中获得JSON输出,并且可以很容易地被ExtJS使用。

http://wiki.apache.org/solr/SolJSON?action=fullsearch&context=180&value=jsonp&titlesearch=Titles#JSON_Response_Writer

如果您需要使用jsonp,可以通过此参数指定回调函数json.wrf=callback