javascript - 在 Backbone JS 中传递 unescape 查询字符串

Question

我正在尝试根据 4 个下拉列表中的不同选择传递查询字符串。我通过变量传递查询字符串，但它被转义，因此结果是 404 错误。

这是我正在编写的用于制作查询字符串的代码...

      function setQueryString(product,brand,demographic,region)
     {
      product =  dropdownlists.get('Product');
      brand = dropdownlists.get('Brand');
      demographic = dropdownlists.get('Demographic');
      region = dropdownlists.get('Region');
      if(product !=='' && brand !=='' && demographic !=='' && region !=='')
        {
           queryString = 'product='+product+'&'+'brand='+brand+'&'+'demographic='+demographic+'&'+'region='+region ;
           return queryString;
        }
      else{console.log('nevermind!!');}
     }

每次用户做出选择时，都有一个 View 函数使用选定的值更新 DataModel 模型。根据这些选择，我们从服务器获取(色阶)数据。

    var DataModel = Backbone.Model.extend({
              urlRoot : '/api/web/',
              idAttribute: 'value',
              defaults : {
                 Product : '',
                 Brand : '',
                 Demographic : '',
                 Region : ''
             }
      });
    var dropdownlists = new DataModel();



    var colorscalelist = new ColorScaleModel({value: setQueryString()});
         colorscalelist.fetch({success: function(){
         console.log(colorscalelist);
        }
      });

色阶模型是:

    var ColorScaleModel = Backbone.Model.extend({
    urlRoot : '/api/web/colorscale',
    idAttribute: 'value',
    defaults : {
            DPRBID: " ",
            F: "",
            BR1: " ",
            BR2: " ",
            BR3: " ",
            UN: " ",
            C: " ",
            T: " "
      }
        });

正在传递的 URL 将转换为 ASCII 字符。有没有办法直接通过，不转义。或者，有没有其他方法可以解决发送数据的问题。这是我的第一个 BackboneJS 项目，任何帮助都会很棒。 谢谢。

Answer 1

Backbone 中的 Ajax 操作最终委托(delegate)给 jQuery，因此接受将修改请求的选项。要添加请求参数，您可以传递data参数，该参数将作为查询字符串传输。

例如，

var ColorScaleModel = Backbone.Model.extend({
    url : '/api/web/colorscale',

    defaults : {
    }
});

var dropdownlists = new DataModel({
    Product : 'P1',
    Brand : 'B1',
    Demographic : 'D1',
    Region : 'R1'
});

var colorscalelist = new ColorScaleModel();
colorscalelist.fetch({
   data: dropdownlists.toJSON() 
});

将导致对 /api/web/colorscale?Brand=B1&Demographic=D1&Product=P1&Region=R1

的请求

参见http://jsfiddle.net/nikoshr/wufbL/演示

您可以更进一步，通过覆盖 model.fetch 将过滤器合并到您的模型中。例如:

var ColorScaleModel = Backbone.Model.extend({
    url : '/api/web/colorscale',

    defaults : {
    },

    initialize: function(attrs, opts) {
        this.filters = opts.filters;
    },

    fetch: function(opts) {
        opts = opts || {};
        opts.data = this.filters.toJSON();

        return Backbone.Model.prototype.fetch.call(this, opts);
    }
});

var dropdownlists  = new DataModel();
var m = new ColorScaleModel({}, {filters: dropdownlists});
m.fetch();

f.set({Product: "P1", Brand: "B1"});
m.fetch();

还有一个可以玩的 fiddle http://jsfiddle.net/nikoshr/wufbL/1/