如何在网络表单GUI中实现用户友好的布尔逻辑？

Question

目前我有一个Web应用程序，用户可以使用下拉列表生成SQL SELECT语句，如下：

列选择下拉列表 | 运算符下拉列表（= != > < <= >=）| 值选择下拉列表

用户可以多次执行此操作，并且“筛选器”当前全部为AND操作。

我希望添加创建OR语句的可能性。如果列相同，我可以很容易地添加OR，但是对于像((A OR B OR C) AND (D OR E)) OR (F AND G)这样的复杂逻辑语句怎么办？

如何让用户以用户友好的方式创建这样的语句？

编辑：为了具有通用性，面向广大受众友好。目前，我与偶尔手工编写SQL查询以获取数据库中特定信息的非技术客户端合作。目标是通过提供易于使用的工具来消除我们手动编码它们的需要，使这个Web应用程序能够让客户自行完成它们。

编辑2：目前该应用程序未被最终用户使用。我所拥有的唯一数据是以前手写的SQL查询，因此是客户要求的查询类型。鉴于此，我可以简化它（例如，限制用户生成他们倾向于询问的查询类型），但我想看看是否有人有在GUI中简单而完整地传达布尔逻辑的经验。

感谢您的时间。

- Miguel

---

“用户友好”是指“面向普通受众的用户友好”还是“面向至少有一点布尔逻辑基础的用户友好”？ - Ben Dunlap

抱歉，还有一个问题：最终用户是否已经在使用当前版本的应用程序？我想知道他们是否已经接受过培训，能够识别和有效地使用下拉菜单中的列/运算符/值三元组。 - Ben Dunlap

Answer 1

有一个jQuery插件可以实现这个功能，它叫做QueryBuilder，以一种有趣的方式实现了此功能：http://mistic100.github.io/jQuery-QueryBuilder/

- Rey0bs

Answer 2

苹果似乎已经找到了一种为嵌套布尔表达式设计GUI的方法：请参见 UX.stackexchange 上接受的答案。

- mb21

Answer 3

当你需要处理 ( (A or B) and C) or (D or E or F) 时，你正在使用类似树形的数据结构。在我的经验中，没有一种简单的方法可以以“漂亮”或“直观”的方式向用户表示决策树。在 ASP.NET webforms 中更是难上加难。

然而，一个经过验证的方法是：使用单个文本框接受 where 子句。相信我，单输入的方法确实是最简单和最直观的用户界面，它还具有快速输入/修改查询过滤器的优点。

从技术角度来看，另一个优点是能够编写自己的词法分析器/解析器和 AST。在基本的 crud 应用程序中，你有多少机会这样做呢？

如果你采用这种方法，请为用户提供可用列的下拉列表，这样双击项目就会将项目插入到光标位置的文本框中。同时，你已经在为用户培训如何使用你的特定查询引擎，那么也可以训练他们输入 (account.Balance < -2000 and account.Type == 'Checking') OR (account.Number = 123456) 可以返回其所述的内容。

- Juliet

---

我想同意UI原则，但任意的“WHERE”输入听起来像是一个安全噩梦。有没有一种可靠的过滤这种输入的方法？ - Ben Dunlap

你可以尝试进行清理，例如删除;和其他恶意内容，但是告诉客户学习SQL并不是一个好的解决方案。 - Earlz

它并不是真的告诉客户去学习SQL，只是告诉客户学习如何用书面形式表达这些要求，这可能比基于视觉和下拉菜单的方式更直接。 - Ben Dunlap

实际上，我越想这个想法，就越喜欢它。要安全地执行此操作，您必须对输入进行标记化，并仅允许短且严格执行的运算符列表。但是，这可能比尝试创建一个隐藏所有这些内容的非极客用户界面要容易得多。+1 - Ben Dunlap

@Ben Dunlap：是的，验证输入的可靠方法是编写一个简单的词法分析器/语法分析器，尝试构建输入的AST。如果输入无法解析（当它包含非法字符、未识别的标记或无效的语法时），则拒绝它。 - Juliet

我投反对票。我曾尝试过与我们的客户成功（支持）团队一起采用这种方法，他们花了数月时间才意识到语法上微不足道的变化带来的巨大影响。何时使用点号，何时不需要？什么时候需要引号？为什么有时需要括号，有时不需要？等等。真的不建议将其作为面向最终用户的 GUI。 - oriadam

Answer 4

即使在WinForms应用程序中，这也很难表示。

你需要做的是实现一个条件组的概念，该组由一个或多个语句和一个条件运算符组成。

我见过的最好的实现来自GameSpy服务器过滤 - 我试图搜索以找到屏幕截图，但没有结果（那个程序还存在吗？）。从我记得的情况来看，他们做了类似于这样的事情：

(
    条件1
) 运算符
(
    条件2
) 运算符
(
    (
        条件3
    ) 运算符
    (
        条件4
    )
)

- Jon Seigel

Answer 5

我认为在编写自定义的"where","select","from"或任何其他SQL命令代理时，没有商业价值。特别是，在这种特定的上下文（DB访问和即席查询）中，客户端打开了安全通道的地狱之门。

让“菜鸟”（我认为他们不会使用常规的SQL工具）组成“直观”的查询是一场灾难等待发生。我猜BJ俱乐部信用卡信息爆炸事件在2003或2004年左右就已经非常接近了这一点的精神内涵。我猜（仅仅是猜测！）一些大型市场老板说：“我们将保存信用卡条纹信息，以便稍后利用该信息。”开发人员问道：“您只想要一个表中的公开可用信息和PII统计桶吗？”“不，我们还不知道如何使用这些信息，为我们开发一个可以以自定义方式查询它的工具......”这是通往灾难的第一步。:(

与此同时，确实有需要使用UI来组合/解析表达式的地方（安全策略分析工具，布尔/开关代数研究等）。我认为最好的UI尚未创建（总是：）），但如果创建了，我预计它将具有以下可能性：

1. 解析表达式（应该很容易，因为用户逐步添加表达式块时可以构建解析树）
2. 以解析树形式显示表达式（这应该很有趣）。
3. 为BF提供真/假表格
4. 绘制BF超立方体（对于“单调类似”函数尤其有价值）
5. 创建具有拓扑链接的Karnaugh图（尽管高维表达式需要好运气）
6. 动态生成表达式的Venn图。
7. 突出显示非必要变量或“表达式块”。
8. 使用McCluskey或Petrick方法进行布尔表达式最小化。

- Wanted by FBI.... Sexually LOL

Answer 6

当我看到这样的问题时，我不禁想到将其实现为一个栈，类似于逆波兰表达式解决此问题的方式。

问题在于它似乎不太直观。

Sample UI: ([Button] <a text box for user input> {list}

Value : < > [Push] [And] [Or]

Stack
{
    

}

HP RPN计算器将堆栈放在编辑区域上方

所以，如果我想写表达式((A and B) or (C and D))，我会这样做：

A [push] (stack would contain "A")
B [push] (stack would contain "B", "A")
[and]    (stack would contain "(A and B)")
C [push] (stack would contain "C", "(A and B)")
D [push] (stack would contain "D", "C", "(A and B)")
[and]    (stack would contain "(C and D)", "(A and B)")
[or]     (stack would contain "((A and B) or (C and D)")

如果您想要添加其他运算符，并且数量不多，您可以只需添加附加按钮或为运算符制作单独的文本框。

Value: < > [Push] Operator < > [Combine]

如果你想支持一元运算符，你需要跟踪它是前缀还是后缀运算符，或者只假设为前缀（布尔一元运算符“not”通常是前缀）。三元运算符通常有两个中缀标识符，因此如果要支持它们，则会更加复杂。一些二元（和n元）运算符具有前缀、中缀和后缀组件“CallMethod(A,B)”所以这真的取决于您想要使其多么复杂。

只是一个想法。

- McKay

Answer 7

Mac OS X提供了非常好的GUI小部件，可以完美地完成这种类型的操作。您可以按照此类布局/交互模型设计您的GUI。

- Matt Ball

---

从截图中并不明显有任何方法可以实现OP所要求的（涉及多个条件的复杂布尔逻辑），如果OP不在Mac上开发，那么这个截图就是他唯一拥有的东西。 - Ben Dunlap

我的理解是他正在寻找一种清晰的用户界面，使用户能够编写布尔逻辑语句列表。我认为他并不是在询问如何编写实际解释用户输入的代码。 - Matt Ball

抱歉，我会将我的评论改为问题形式：如何在上面截图的UI中输入类似于“((A OR B OR C) AND (D OR E)) OR (F AND G)”（引用自OP的问题）的内容？ - Ben Dunlap

@Matt 感谢您的编辑。我从未意识到imageshack会利用404页面来展示广告。这真是个恶劣的举动。 - Matt Ball

Answer 8

另一个选项是类似于SQL Server Management Studio查询构建器界面 - 多行和多列，其中行表示AND，而列表示OR（或反之亦然，我不记得了）。

您可以实时更新生成的查询以帮助用户（就像SQL Server更新生成的SQL一样）。

- queen3

Answer 9

属性过滤表单（点击查看表单图片）

我有一个类似的任务，根据属性值过滤文件。用户是机械工程师，所以不完全是“普通受众”。

在表单中，用户创建一组条件。每个条件都单独列出并分配一个字母（A、B、...）。

默认的布尔表达式（A AND B AND ...）会自动生成。但是，用户可以根据需要选择性更改它，例如 A AND (B OR C)。

它已经投入生产超过一年了，到目前为止没有重大混淆或投诉。

- rmcanany