bone.js 搜索过滤系统 [结构]

Question

我正在使用控制器来获取 URL。我需要一种将参数放入此 POST 的方法。这些参数是用户在查看中选择的，还没有存储（我不知道如何存储）

目前我设法

1. 使用来自 API 的搜索结果显示和路由视图
2. 当有人选择过滤选项时显示和刷新页面

问题

1. 我不知道如何记录用户点击的内容
2. 如何“重新发布”以便获得新的结果集
3. 我读到有人说 POST Fetch 应该在 Model 中完成， Collection 用于存储多个我不知道的模型 场景？

集合 Jobs.js

    define([
        'jquery',
        'underscore',
        'backbone',
        'models/filter'
    ], function($, _, Backbone,JobListFilterModel){
        var Jobs = Backbone.Collection.extend({
            url: function () {
                return 'http://punchgag.com/api/jobs?page='+this.page+''
            },
            page: 1,
            model: JobListFilterModel
        });
        return Jobs;
});

Collections Filter.JS

define([
    'jquery',
    'underscore',
    'backbone',
    'models/filter'
], function($, _, Backbone,JobListFilterModel){
    console.log("Loaded");

    var Jobs = Backbone.Collection.extend({
        url: function () {
            return 'http://punchgag.com/api/jobs?page='+this.page+''
        },
        page: 1,
        model: JobListFilterModel
    });

//    var donuts = new JobListFilterModel;
//    console.log(donuts.get("E"));

    return Jobs;
});

型号 过滤器.js

define([
    'underscore',
    'backbone'
], function(_, Backbone){
    var JobFilterModel = Backbone.Model.extend({
        defaults: {
            T: '1',   //Task / Event-based
            PT: '1',  //Part-time
            C: '1',   //Contract
            I: '1'    //Internship
        }
    });
    // Return the model for the module
    return JobFilterModel;
});

型号 Job.js

define([
    'underscore',
    'backbone'
], function(_, Backbone){
    var JobModel = Backbone.Model.extend({
        defaults: {
            name: "Harry Potter"
        }
    });
    // Return the model for the module
    return JobModel;
});

Router.js

define([
    'jquery',
    'underscore',
    'backbone',
    'views/jobs/list',
    'views/jobs/filter'



], function($, _, Backbone, JobListView, JobListFilterView){
    var AppRouter = Backbone.Router.extend({
        routes: {
// Define some URL routes
            'seeker/jobs': 'showJobs',
            '*actions': 'defaultAction'
        },
        initialize: function(attr)
        {
            Backbone.history.start({pushState: true, root: "/"})
        },
        showJobs: function()
        {
            var view = new JobListView();
            view.$el.appendTo('#bbJobList');
            view.render();
            console.log(view);


            var jobListFilterView = new JobListFilterView();
            jobListFilterView.render()
        },
        defaultAction: function(actions)
        {
            console.info('defaultAction Route');
            console.log('No route:', actions);
        }
    });

    var initialize = function(){

        console.log('Router Initialized');// <- To e sure yout initialize method is called

        var app_router = new AppRouter();
    };
    return {
        initialize: initialize
    };
});

一些例子会很棒。谢谢

Answer 1

获取意味着检索（您可能知道），从服务器获取一些信息。

POST 通常用于创建新资源。例如，保存一个新的 Job 将是一个 POST 上的 /jobs URL 中的 REST 之类的 API。

在你的情况下，你可能想要的是：

• JobCollection 从 Backbone Collection 扩展并使用 JobModel 作为模型
• 表示 Job 的 JobModel。

您当前已经拥有 JobModel，但它没有 Collection... 相反，您拥有 JobFilters 的 Collection，这意味着您正在处理多组过滤器。这可能不是你的想法？

假设您现在有一个 JobCollection 表示您的视图将显示的所有作业的列表，当您对其执行 collection.fetch() 时，它将获取所有作业，没有任何过滤器。

现在的问题变成了：如何将额外的参数传递给集合中的 fetch()？

有很多方法可以做到这一点。由于您已经有了 JobFilterModel，您可以在 JobFilterModel 中执行以下方法：

//jobCollection being the instance of Job collection you want to refresh
refreshJobs: function(jobCollection) {
  jobCollection.fetch({reset: true, data: this.toJSON()});
}

模型的 toJSON 会将模型转换为一个不错的 Javascript 对象。因此，对于您的 JobFilterModel，toJSON() 将返回如下内容：

{
  T: '1',   //Task / Event-based
  PT: '1',  //Part-time
  C: '1',   //Contract
  I: '1'    //Internship
}

将它放在 Collection 的 fetch() 选项哈希的 data 属性中，会将这些添加到服务器的查询中。然后，无论您的服务器回答什么作业，它们都将用于重置（这就是为什么 reset: true 在选项中，否则它只会更新）作业集合。然后，您可以在您的视图中绑定 jobCollection "reset" 事件以了解何时重新渲染。

所以，现在，您的 JobFilterModel 唯一的“工作”是存储（在内存中）用户选择的过滤器，而 JobCollection 和 JobModel 对过滤器一无所知（他们不应该知道）。至于存储 JobFilterModel 的当前状态，您可以查看 Backbone localstorage 插件或将其保存在您的服务器上/从您的服务器获取它（使用模型的 fetch() 和 save() 方法）。

我希望这会有所帮助！