gmail标签选择器难题 - 有更好的方法吗?

时间:2011-07-10 18:38:52

标签: javascript jquery algorithm gmail

我们正在为我们的webapp实现与gmail完全相同的标签功能 - 您可以选择帖子(复选框)并从'标签'下拉列表中选择要应用/删除的标签(它们本身就是一组复选框)。问题是“如何去做?”我有一个解决方案,在我解决它之前,我希望得到一个关于它是否是正确方法的意见,以及是否可以使用我可能不知道的某些jquery / javascript结构进行简化。无论如何,我不是JavaScript / jQuery pro。 :)

让: M = {帖子集} N = {标签集} M_N = M和N之间的多对多关系,即具有至少一个N标签的帖子集

输出:给定一组“选定”帖子,并且“选定”标签集获取具有以下值的JSON项目数组:

  • Post_id,Label_id,action {add,delete}

这是我提出的方法(天真或最佳,我不知道):

  1. 获取所选帖子的当前数量:var selectionCount = 5(例如,选择5个帖子)
  2. 为选择中的每个项目捕获以下数据集:
  3.  Label_id | numberOfLabelsInSelection| currentStateToShow |   newState
          4   |            3             |    partialTick     |  ticked (add)
          10  |            5             |      ticked        |  none (delete)
          12  |            1             |    partialTick     |  partialTick (ignore)
          14  |            0             |       none         |  ticked (add)
    

    基本上上面的数据结构只是捕获显示条件,即总共选择了5个帖子,只有两个标签有“x”表示,那么标签列表应该在复选框中显示“部分刻度标记”,如果全部帖子有一个标签“y”,然后下拉列表显示“完整勾选”。不在所选集合上的标签只是未选中但只能切换到刻度线或“无”但不能切换到部分状态(即仅打开/关闭.deittyTick有三种状态可以这么说:开/关/部分)

    'newState'列基本上是已选择的内容。输出操作基于先前的状态(即currentStateToShow):

    • partial to tick意味着为没有该标签的所有帖子添加标签
    • 勾选为无意味着从所有帖子中删除该标签
    • 偏向无意味着仅删除来自所选帖子的标签
    • none to ticked暗示将新标签添加到所有帖子
    • 偏向部分暗示忽略,即无变化

    然后我可以迭代这个集合并决定将以下数据发送到服务器:

    | Post_id | Label_id | Action |
    |   99    |     4    |   add  |
    |   23    |    10    | delete |
     ...
    

    等等。

    那么问题是什么?这是非常复杂的! Javascript实际上没有地图数据结构(是吗?),它需要过多的连续迭代并检查每一件事,然后有很多if-else来确定newState的值。

    我不是在寻找“如何编码”但我能做些什么来让我的生活更轻松?有没有我可以使用的东西?逻辑是正确还是有点过于复杂?有关如何攻击问题或某些内置数据结构(或外部库)可能会使事情变得不那么粗糙的任何建议?代码示例:P?

    我正在使用javascript / jquery + AJAX和restlet / java / mysql,并将为此发送一个JSON数据结构,但我很满意这个问题。它看起来并不像我最初认为的那样容易(我的意思是我认为它比我现在面对的更容易)。)

    我最初想过将所有数据发送到服务器并在后端执行所有这些操作。但收到确认后,我仍然需要以类似的方式更新前端,所以我可以“回到原点”,因为我必须在前端重复相同的事情来决定隐藏哪些标签以及要显示的内容。因此,我认为在客户端做整件事情会更好。

    根据我的“专业知识”,我猜这是一个简单的100-150 + javascript / jquery代码行,可以说,也许关闭...但这就是为什么我在这里:D

    PS:我已经看了这篇文章和演示How can I implement a gmail-style label chooser?但是该演示一次只能用于一个帖子并且可以轻松完成。由于使用这些部分选择等的选择设置,我的问题更加严重,

1 个答案:

答案 0 :(得分:5)