jQuery-QueryBuilderをDNFでのみ構築するには

Question

DNFフォーム（結合句の論理和）の規則を構築するためにjQuery-QueryBuilderを使用しようとしています。これらのルールは、一つだけのレベル深さ - 及び任意内側クエリグループがANDによって接合され、これらの基内の任意のルールを全てORによって接合されていることを強制します。今のところ、jQuery-QueryBuilderは必要なものを表現する方法であり、DNF形式のクエリの構築のみを許可するようにしています。

これは、3つのことを必要とします。

1. クエリでは唯一、私はそのルールを適用することができます一つのグループ
2. 最も外側のクエリがによって結合されているOR
3. 最も内側のクエリが

によりAND結合されていることができますクエリを作成するときにallow_groups: 1を使用すると、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のフィドルですが、グループを1に制限し、内側の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フィドル：https://jsfiddle.net/qzq1mm5z/4/