【问题标题】:Meteor: allow predetermined values to enter a collectionMeteor:允许预定值进入集合
【发布时间】:2014-11-27 06:34:35
【问题描述】:

在我的表单中,我创建了一个下拉列表以在用户键入时显示国家/地区列表。就目前而言,他们可以选择一个,单击“sublit”,然后通过流星调用将其插入到我的帖子集合中。下面的代码以及这个 jQuery 代码(保存在客户端文件夹中)是允许它运行的原因。使用的输入 ID 是“国家/地区”。

https://github.com/twitter/typeahead.js/blob/master/dist/typeahead.jquery.js

我的目标:允许将我的“国家”变量中列出的国家/地区插入数据库。我希望在我的方法函数中对此进行验证。

客户:

Template.createpost.rendered = function() {
if (!this.rendered){
    var substringMatcher = function(strs) {
return function findMatches(q, cb) {
var matches, substrRegex;
matches = [];
substrRegex = new RegExp(q, 'i');
$.each(strs, function(i, str) {
  if (substrRegex.test(str)) {
    matches.push({ value: str });
  }
});
cb(matches);
};
};
var country = [
"Afghanistan",
    "Albania",
    "Algeria",
    "Andorra",
    "Angola",
    "Antigua and Barbuda",
    "Argentina",
    "Rest Of Countries"
];
$('#country').typeahead({
hint: true,
highlight: true,
minLength: 1
},
{
name: 'country',
displayKey: 'value',
source: substringMatcher(country)
});
this.rendered = true;
} 
};


Template.createpost.events({
'submit form#createpost': function(e, tmpl) {
    e.preventDefault();
    var insertPostData = {
        country: $(e.target).find('#country').val()
    }
    Meteor.call('insertPostData', insertPostData, function(error, id){
        if (error) {
            alert(error.reason);
        }
    });
}

});

服务器:到目前为止,如果用户没有选择国家,我的方法只会引发错误。我不确定检查从客户收到的国家/地区值与我想在我的方法中列出的值数组的语法我愿意接受其他建议来实现这一点,请告诉我。谢谢各位。

Meteor.methods({
'insertPostData': function(insertPostData){
  if (!insertPostData.country) 
    throw new Meteor.Error(422, 'please select valid country');
  return insertPostData._id = AllPosts.insert(insertPostData);

}});

【问题讨论】:

标签: javascript jquery validation meteor typeahead.js


【解决方案1】:

如果只是针对数组检查值,我会在数组上使用过滤器方法。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

var countries = [
"Afghanistan",
    "Albania",
    "Algeria",
    "Andorra",
    "Angola",
    "Antigua and Barbuda",
    "Argentina",
    "Rest Of Countries"
];

var insertPostData = {};

insertPostData.country = "Albania";

if(countries.filter(function(country){ return insertPostData.country === country; }).length > 0) 
    {
        console.log("country listed");
    } else {
        console.log('country not listed');
    }

这个过滤器函数遍历你的数组,并根据你给它的过滤器创建一个新数组,如果返回为真则添加它,如果不是则跳过它。因此,如果长度为 0,则它没有找到任何与该值匹配的国家。

或者 Meteor 附带下划线库,您可以执行以下操作:

Meteor.methods({
  'insertPostData': function(insertPostData){
    if (!insertPostData.country ||  _.contains(countries, insertPostData.country);) 
      throw new Meteor.Error(422, 'please select valid country');
    return insertPostData._id = AllPosts.insert(insertPostData);
} });

然后将数组添加到客户端和服务器可以看到的位置,例如libs/countries.js

并添加不带 var 关键字的数组,因此它不限于该文件:

countries = [
    "Afghanistan",
    "Albania",
    "Algeria",
    "Andorra",
    "Angola",
    "Antigua and Barbuda",
    "Argentina",
    "Rest Of Countries"
];

【讨论】:

  • 感谢您的输入 Jeff,我会检查这种替代方法,但 saimeunt 更接近我现在的要求。
  • 嗨,杰夫,您能否扩展您提供的替代方案。我只是想检查我的方法 insertPostData.country 是否等于服务器端数组中列出的项目之一。
【解决方案2】:

这就是我要进行的操作:首先,在您的应用的共享文件夹中声明您的国家/地区数组,以便它在两种环境中都可用。

lib/constants.js

countries=[...];

然后使用此数组构建您的 typeahead 客户端并检查发送到该方法的国家/地区的有效性。

if (!insertPostData.country || !_.contains(countries,insertPostData.country)){
  throw new Meteor.Error(422, 'please select valid country');
}

我们为此使用 _.contains。

http://underscorejs.org/#contains

【讨论】:

  • 好的,这设置了验证,非常好。如何在 Template.createpost.rendered 代码中使用这个填充的 constants.js 文件中的数组? (我的客户端现在有 underscore.js)。
  • 只需在您的客户端代码中使用其名称countries 引用它,即source: substringMatcher(countries) ?
  • 我在 substringMatcher 中引用了这个国家,但它没有验证。我用我提供的上述代码中的国家/地区替换了它。
  • 除非没有正确引用 constant.js 文件中的国家/地区数组。来源:substringMatcher(国家)?
  • 请使用您拥有的当前代码编辑您的代码。 lib/constants.js 中的 countries 变量应在声明时不包含要导出的 var 关键字。
猜你喜欢
  • 2015-02-15
  • 1970-01-01
  • 1970-01-01
  • 2023-03-23
  • 1970-01-01
  • 2015-09-22
  • 1970-01-01
  • 2019-08-30
  • 2011-01-18
相关资源
最近更新 更多