限制 jQuery-QueryBuilder 仅在 DNF 中构建

Question

我正在尝试使用 jQuery-QueryBuilder for constructing rules in DNF 形式（连词从句的分离）。这些规则只有一层深 - 并强制任何 内部查询组 由 AND 加入，并且这些规则中的任何规则 groups 全部由 OR 加入。现在，jQuery-QueryBuilder 是表达我需要的方式 - 我试图强制它只允许构建 DNF 格式的查询。

这需要三件事：

查询只能有一组
最外层查询由 OR
最内层的查询由 AND

我可以通过在构造查询时使用 allow_groups: 1 来强制规则只有一层深（这很好用！）。但是，我找不到使条件在组级别之间有所不同的方法。

我可以使用 conditions 选项 (docs) 设置可用条件 - 但这适用于所有情况。我希望能够设置类似

outer_conditions = ['OR']
inner_conditions = ['AND']

我也试过用 CSS 隐藏按钮（绝对不是我的专长）。这是我目前为止最接近的结果：

// Hide main "AND" conditional value
.rules-group-container .rules-group-header .btn-group.group-conditions {
  display: none;
}

// Hide groups "OR" conditional value
.rules-group-container .rules-group-body .rules-list .btn-group.group-conditions > .btn:last-child {
  display: none;
}

这仅在隐藏内部条件选项时有效，但在试图隐藏两者时无效。

这是一个我一直在玩的 JS fiddle，它将组限制为 1，隐藏内部 OR 选项，但不隐藏外部 OR 选项。

https://jsfiddle.net/qzq1mm5z/3/

感谢任何帮助！

Answer 1

引导我所有的内心 CSS-foo 并弄清楚了这个。使用通配符选择器和 :not.

使其工作

这 css 排除了我想要的按钮并将它们很好地四舍五入以隐藏组中某些按钮消失的事实。

// Hide the main group "AND" button
#builder-basic_group_0 > .rules-group-header .btn-primary:nth-child(1) {
  display: None;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

// Fix the radius of the remaining "OR" button sharp edge
#builder-basic_group_0 > .rules-group-header .btn-primary:nth-child(2) {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

// Hide all child groups "OR" button
[id^="builder-basic_group_"]:not(#builder-basic_group_0) > .rules-group-header .btn-primary:nth-child(2) {
  display: None;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

// Fix the radius of all remaining "OR" button sharp edges
[id^="builder-basic_group_"]:not(#builder-basic_group_0) > .rules-group-header .btn-primary:nth-child(1) {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

修复了 JS fiddle：https://jsfiddle.net/qzq1mm5z/4/

限制 jQuery-QueryBuilder 仅在 DNF 中构建

Restrict jQuery-QueryBuilder To Build Only In DNF

css

jquery

sass

query-builder