1

我正在尝试验证表单上的 3 个选择字段,我的应用程序是曲棍球记分应用程序,并且我正在录制得分比赛。A是得分手,B是主要助攻,C是次要助攻。我有以下验证规则:

  1. A 不能为空
  2. B 不能等于 A 或 C
  3. C 不能等于 A 或 B
  4. 如果 B 为空,则 C 必须为空

所以换句话说,A、AB 或 ABC 是有效的组合,但都必须是唯一的。我通过将禁用的引导类/html 属性应用于提交按钮来禁用提交按钮。

在我的实际代码中,A = awayGoal,B = awayPAssist,C = awaySAssist

我目前有以下 jQuery 代码:

var awayGoal = $("#awayGoal");
var awayPAssist = $("#awayPAssist");
var awaySAssist = $("#awaySAssist");
var awayGSubmit = $("#submitAwayScore");

$('#awayScore select').change(function() {
if(awayGoal.val() != "" && awayPAssist.val() != awayGoal.val() && awayGoal.val() != awaySAssist.val()) {
    if(awayPAssist.val() != "" && awaySAssist.val() != "") {
        awayGSubmit.disableButton();
    }
    awayGSubmit.clearDisabled();
}
else {
    awayGSubmit.disableButton();
}
});

这允许唯一的 A + C 组合通过,但是,相同的 A + C 不会通过。每个选择元素都加载了参与游戏的玩家人数。还有第一个option是静态选项,称为 N/A,其代码是:<option value="">N/A</option>这允许管理员在主辅助和辅助辅助不存在的情况下拥有空的辅助辅助。

任何帮助将不胜感激,任何提高效率的方法都非常受欢迎,因为我刚刚开始使用 jQuery。提前致谢。

4

2 回答 2

1

由于您只有三个案例并且只有三个项目,您可以对每个条件进行强力检查,然后将它们组合在一起以确定按钮的禁用状态。

JSBin 示例

var awayGoal = $("#awayGoal");
var awayPAssist = $("#awayPAssist");
var awaySAssist = $("#awaySAssist");
var awayGSubmit = $("#submitAwayScore");


$('#awayScore select').change(function() {
  var A = awayGoal.val();
  var B = awayPAssist.val();
  var C = awaySAssist.val();
  console.log(A,B,C);

  if(// case 1: only A 
     (A !== "" && B === "" && C === "") ||  

     // case 2: only A and B, A != B
     (A !== "" && B !== "" && C === "" && A !== B) || 

     // case 3: A, B, C, all unique
     (A !== "" && B !== "" && C !== "" && A !== B && A !== C && B !== C) ) { 

  //awayGSubmit.clearDisabled();
  console.log("enable button");
}
else {
    //awayGSubmit.disableButton();
    console.log("disable button");
}
});
于 2013-04-05T01:46:50.537 回答
0

我目前正在开发具有如此多的验证规则的系统。我尝试使用我自己构建的 jquery 进行验证,但是我必须考虑很多事情并且要编写很多代码。

我建议你尝试使用这个jquery 验证引擎。您可以在此处查看演示页面它有很多功能,最有趣的部分是您可以定义自己的规则或验证。试试。

祝你好运。

于 2013-04-05T01:37:49.527 回答