主干表单提交路由

Backbone form submit routing

本文关键字：路由 表单提交      更新时间：2023-09-26

是否可能有一个类似于以下的路由器实现?

var Router = Backbone.Router.extend({
    routes: {
        '' : 'search',
        '*querystring' : 'results'
    },
    search: function() {
        // load search view
    },
    results: function(querystring) {
        // load search view
        // make ajax request using querystring
    }
});

搜索视图有一个表单，当提交时应该转到结果视图，该结果视图将解析查询的url，提交ajax请求，然后显示响应。

显然像这样的东西会更有意义

'results?*querystring' : 'results'

但是我无法让我的表单以那种格式提交URL。

当把我的表单动作作为<form action="index.html/results">时，我得到http://localhost:8000/index.html/results?c=foo&a=bar作为我的URL。

这很接近，但我真的需要http://localhost:8000/index.html#/results?c=foo&a=bar，当我尝试用<form action="index.html#/results">这样做时，它给了我http://localhost:8000/index.html?c=foo&a=bar#/results，这不是我想要的:(

这就是为什么我宁愿没有表单操作，而是有一个路由，可以解析查询，如果存在的话。

好的，谢谢阅读。

不要设置pushstate为true，设置为false

Backbone.js PushStates: Fallback for Internet Explorer不工作

  1. 删除表单或阻止提交
  2. 获取参数并触发路由
  3. 正确处理触发路由中的参数
路由器

routes:{
  'search':'search'     //queryString is automatically passed as last param in backbone 1.1
},
search: function(queryString){
  //Write your logic to do the search
}

视图:

events:{
'submit form':'preventAndNavigate'
},
preventAndNavigate: function(e){
  e.preventDefault();
  var query = $(e.currentTarget).serialize();
  Backbone.history.navigate('search?'+query,{trigger:true});
}

Docs:

骨干路由器现在处理路由片段中的查询参数，将它们作为最后一个参数传递给处理程序。指定为字符串的路由不应再包括查询字符串('foo?:query'应该是'foo').

引用:

http://backbonejs.org/更新日志

相关文章：