用於編輯具有多對多關係的數據的GUI模式

Question

我經常遇到這種情況，我需要提供一個GUI來編輯具有n：m關係的數據。我正在尋找用戶友好的GUI想法。

[table1] 
    | 
    /|\ 
[table2] 
    \|/ 
    | 
[table3] 

通常情況下，GUI類似於這樣的事情：

---

Grid that shows all items from table1

添加表3項......_{（顯示模式窗口與表3項）}

---

Grid that shows all items from table3

---

用戶選擇了一個表3項目之後，我添加了一個新的行表2和刷新網格。

缺點：

• 只能添加表3項目表1，而不是周圍的其他方式;
• 您只能瀏覽table1項目並查看相關的table3項目;
• 我需要有一個過濾網格的table3項目，和一個類似的挑選新項目;

我的問題：

有誰知道一個更好的方式直觀地瀏覽和編輯數據具有N：M的關係？ 或者我可以從現有軟件包中「竊取」任何不錯的模式？

Answer 1

溶液1

如果數據集不是太大，使用一個表，並允許用戶放置在檢查細胞（表1是X軸和表3是Y軸）。

只要您允許用戶過濾或以其他方式限制在x軸和y軸上顯示哪些值，您可以對較大的table1/3數據集執行此操作。

解決方案2

從this page引述，「多到多的關係真的是兩個一到多用接線/鏈接表之間的關係」。因此，作爲一種解決方案，您可以簡單地採取自己的解決方案，並通過讓屏幕/對話框轉到表格1 => 3以及3 => 1來解決您的前兩種不利之處。

不是一個完美的解決方案，但至少提供了所有需要的功能

解決方案3

有點類似自己的解決方案：

1. 顯示基於表1表，其中：

   含有表1

   B. COL1元件

   C.col2包含table3中所有元素的列表，這些元素已經與table1中的該元素相關聯。

   如果通常只有很少的元素關聯，則列表可以是水平的，或者如果水平太寬，則列表可以是垂直的（可滾動的）。

   重要的一點是，table3中的每個顯示元素都有一個「刪除」圖標（x），以便快速刪除。

2. 允許從table1中選擇要添加映射的元素。

   有兩種方法可以做到這一點 - 或者在表格中的每一行添加一個複選框，並有一個按鈕標記爲「添加關係到選定的行」（措辭需要改進）， 或簡單地有一個第3列在表格中，包含用於將關係添加到該單獨行的按鈕/鏈接。

   前者是如果用戶可能經常同一套從表3元的從表1加起來正是以幾行是個好主意。

3. 當「添加」按鈕被點擊/鏈接，顯示從表3元素的過濾多選列表，用「添加選擇」按鈕。

4. 在你的解決方案（見我的＃2），這是一個對稱的，所以你應該從表3實施鏡UI映射，如果需要的表1。

Answer 2

下面是一個可能的解決方案，以員工到項目的m：m關係的形式給出。每個員工都可以在很多項目上工作，每個項目可能涉及很多員工。

由左到右，你看下面：

顯示當前選擇員工的詳細信息的面板。

所有僱員，其中列表中的每個項目顯示了僱員的名字作爲一個可點擊的鏈接或按鈕的列表（以顯示在細節面板的細節）。列表頂部是一個切換按鈕，用於將項目列表過濾爲僅與當前選定員工相關的項目列表。在列表的底部是一個添加新員工的按鈕，該員工顯示一個空的詳細信息面板，準備接受輸入。

在一個單一的「鏈接」按鈕，允許用戶當前選擇的員工與當前選定的項目鏈接中間的垂直空間。單擊此按鈕將打開一個對話框，允許用戶輸入鏈接的詳細信息（即員工分配的時間長度，員工將扮演的角色等）。

所有項目的列表，其中列表中的每個項目將項目名稱顯示爲可單擊的鏈接或按鈕（以在詳細信息面板中顯示詳細信息）。列表頂部是一個切換按鈕，用於將員工列表過濾爲僅與當前選定的projet關聯的員工列表。在列表的底部是一個添加新項目的按鈕，該項目顯示一個空的詳細信息面板，準備接受輸入。

顯示當前所選項目的詳細信息的面板。

顯然，您必須限制詳細信息面板的大小，也許只顯示與m：m關係相關的詳細信息。您甚至可以在詳細信息面板上添加一個按鈕以打開更詳細的彈出窗口，或者如果您主要對管理鏈接感興趣，則可以完全取消詳細信息面板。這個用戶界面在寬屏幕屏幕上可以很好地工作。

HTH！ Klay

Answer 3

讓我使用One Customer有0個或多個Orders關係示例。如果用戶想要查看特定形式的訂單我建議以下使用案例：

1. 用戶點擊搜索客戶鏈接：
2. 系統呈現具有搜索條件的
過濾搜索客戶表
3. 用戶填寫的搜索條件和所匹配的標準
4. 用戶點擊在客戶面前打開按鈕點擊搜索按鈕
5. 系統呈現客戶名單...
6. 系統出現的客戶（以全新的頁面與「回到搜索按鈕」）

新的頁面有3個面板 - 1個面板客戶詳細信息，對訂單的名單和3面板，獲得第二小組當點擊訂單時填充。如果訂單數量大於20，我會放置一個搜索訂單鏈接，該鏈接指向全新的訂單搜索表單，其中預定義的CustomerId使用當前選定的CustomerId修復。

Answer 4

這是一個老問題，但我再次面對同樣的問題就在剛纔，我想出了這個：

1. 2格，並排顯示錶1和表3項，分頁，如果必要。
2. 這兩個網格都有一個頂部的工具欄，它允許從對面的表中進行過濾。根據您的數據和您的gui框架，它可以是一個下拉式組合網格或自動完成的文本輸入。
3. 這兩個網格都有複選框（最後或第一列）
4. 這兩個網格都包含每行的內聯按鈕/操作，以自動過濾該項目上的其他網格。
5. 在任何給定的時間，只有一個網格被顯示/標記爲「活動」或「主人」（以向用戶明確他們正在查看/控制的關係的哪一側）。

當您在grid1中選擇一個項目時，grid1變爲活動狀態，而其他柵格中的所有項目都勾選複選框（如果它們與所選項目關聯）。反之亦然，當您在grid2（table3）中選擇一個項目時，grid2變爲活動狀態，grid2中的所有複選框都是空白（或變暗），並且grid1中的複選框指示與所選項目的關聯。

濾波部分是基於在第4步

我相信這個解決方案將滿足您的所有需求中描述的內嵌按鈕變得更加容易。