CN103823615A - 一种在web页面显示表格的方法及系统 - Google Patents

Abstract

本发明实施例公开了一种在web页面上显示表格的方法及系统，通过划分固定列组和扩展列组来区分表格列字段中的关键列字段和非关键列字段，递进选择需要显示的扩展列组，保持表格显示页面的美观，还便于管理。本发明实施例方法包括：将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与一个扩展列组。

Description

一种在web页面显示表格的方法及系统

技术领域

本发明涉及表显示技术处理领域，具体涉及一种在web页面显示表格的方法及系统。

背景技术

浏览器/服务器模式（Browser/Server，简称B/S）是web兴起后的一种网络结构模式，通过在客户机上安装一个浏览器（browser），而在服务器端安装数据库，客户机上的浏览器可以通过网络服务器（web server）同服务器端上的数据库进行交互。

浏览器与数据库交互时，在web页面上显示表格，以便用户在前端对表格进行管理。其中，表格的列字段由用户自定义设置，可以对单个列字段设置宽度、排序、隐藏等，如果表格的列字段较多，则表格上会出现滚动条，通过滚动条滚动显示需要的列字段，对某些不需要显示的列字段只能对其设置隐藏，不支持后台统一设置，也无法区分表格列字段中的关键列字段和非关键列字段。

发明内容

针对上述缺陷，本发明实施例提供了一种在web页面显示表格的方法及系统，可以区分表格的关键列字段和非关键列字段，实现分列组管理，保证表格显示面的直观和美观，且更加方便用户管理表格。

本发明实施例提供了一种在web页面显示表格的方法，包括：

将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

优选地，所述固定列组设置在所述扩展列组的左边，所述扩展列组从左向右排列。

优选地，所述移动按钮为左移/右移按钮，进而所述通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组，具体包括：

当触发所述右移按钮且当前显示的扩展列组不是右边最后一个扩展列组时，所述表格上显示所述固定列组与下一个扩展列组；

当触发所述左移按钮且当前显示的扩展列组不是左边第一个扩展列组时，所述表格上显示所述固定列组与前一个扩展列组。

优选地，当默认显示所述表格时，显示所述固定列组与左边第一个扩展列组。

优选地，所述左移按钮可通过点击触发和/或通过键盘上的方向键“←”触发；

所述右移按钮可通过点击触发和/或通过键盘上的方向键“→”触发。

优选地，所述固定列组可包括3~5个关键列字段，每个所述扩展列组可包括4~5个非关键列字段。

本发明实施例还提供了一种在web页面显示表格的系统，包括：

划分单元，用于将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

显示单元，用于通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

进一步地，所述移动按钮为左移/右移按钮，所述显示单元具体包括：

右移显示单元，用于当触发所述右移按钮且当前显示的扩展列组不是右边最后一个扩展列组时，所述表格上显示所述固定列组与下一个扩展列组；

左移显示单元，用于当触发所述左移按钮且当前显示的扩展列组不是左边第一个扩展列组时，所述表格上显示所述固定列组与前一个扩展列组。

从以上技术方案可以看出，本发明实施例具有以下优点：

本发明实施例所提供的在web页面显示表格的方法中，通过将表格列字段划分为包含表格的关键列字段的固定列组，而关键列字段中包含的是表格数据中的关键字，和至少一个包含表格非关键列字段的扩展列组，非关键列字段中包含的是表格数据中的非关键字，再由表格上的移动按钮来递进选择需要显示的扩展列组，每一次表格上只显示固定列组和一个扩展列组，直观显示使得用户能够更容易地区分关键列字段和非关键列字段，便于查找表格数据中的关键字，还可以对列组实现统一设置。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对本发明实施例中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的一种在web页面显示表格的方法流程图；

图2为本发明实施例提供的一种在web页面显示表格的方法另一流程图；

图3为本发明实施例提供的一种在web页面显示表格的方法另一流程图；

图4为本发明实施例提供的一种在web页面显示表格的系统结构示意图；

图5为本发明实施例提供的一种在web页面显示表格的系统另一结构示意图。

具体实施方式

下面将结合本发明实施例的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

本发明实施例提供了一种在web页面显示表格的方法，通过划分固定列组和扩展列组来区分关键列字段和非关键列字段，递进选择需要显示的扩展列组，减少表格显示页面的显示压力且保持表格显示页面的美观，分列组更加便于用户管理。相应地，本发明实施例还提供了一种在web页面显示表格的系统，下面将对本发明的技术方案进行详细的说明，请参阅图1~图5。

如图1所示，一种在web页面显示表格的方法，包括：

步骤110、将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

其中，在B/S模式中，在后台将一个表格中的列字段划分为固定列组和至少一个扩展列组，实现后台对整个列组的统一设置，无需用户操作。固定列组是表格中的关键列字段的组合，每个扩展列组是几个非关键列字段的组合。关键列字段中包含的是表格数据中的关键字，而非关键列字段包含的是表格数据中的非关键字。

可以理解的是，每个表格中大概有3~5个关键列字段，所以固定列组可以包括3~5个关键列字段，扩展列组可以包括4~5个非关键列字段。为了在web页面更加直观显示，且根据用户习惯，可以将固定列组设置在表格的左边，扩展列组设置在固定列组的右边，扩展列组再从左向右排列。在首先对表格列字段录入数据时，可以先对固定列组的关键列字段录入表格数据中的关键字，并保存起来，在后续可以分阶段对扩展列组录入非关键字。

步骤120、通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

其中，表格上设置有移动按钮，可以通过触发移动按钮，向右或向左递进选择需要显示的扩展列组，默认地，在表格上显示固定列组与表格最左边的第一个扩展列组。优选地，移动按钮可以是左移按钮和右移按钮，如果当前显示的扩展列组不是最后一个扩展列组时，在触发了右移按钮后，将选择下一个扩展列组，进而显示固定列组与选择的下一个扩展列组；如果当前显示的扩展列组不是第一个扩展列组时，在触发了左移按钮后，将选择前一个扩展列组，进而显示固定列组与前一个扩展列组，实现了递进选择显示扩展列组，而每次保持显示固定列组，可以直接对应固定列组中的关键列字段中的关键字，方便快捷地在扩展列组的非关键列字段的对应位置中录入非关键字，减少录入差错。

可以理解的是，可以通过直接点击来触发左移按钮或者右移按钮，当然还可以使用键盘上的方向键，其中，按下方向键“←”向左移动，按下方向键“→”向右移动。在向左移动到第一个扩展列组时，不能再向左移动；在向右移动到最后一个扩展列组时，不能再向右移动。

本发明实施例中通过将表格列字段划分成由关键列字段组成的固定列组，以及由非关键列字段组成的至少一个扩展列组，从而对表格列字段实现关键列字段和非关键列字段管理，在划分了固定列组和扩展列组后，通过触发移动按钮实现向右或向左递进选择需要显示的扩展列组，使得显示页面上只显示固定列组和任意一个扩展列组，保持表格显示页面简洁美观，更进一步地，由于是对表格列字段进行划分，可以在后台统一管理，无需用户操作，甚至后台可以随时对扩展列组进行编辑，更加方便后台操作人员，管理更加灵活。

为了进一步描写本发明的技术方案，请参阅2，一种在web页面显示表格的方法，包括：

步骤210、将表格列字段划分为1个固定列组和n个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字，其中，所述n为大于或等于1的正整数；

其中，将表格列字段划分为1个固定列组和n个扩展列组。在表格列字段中，一般而言有几个列字段是较为关键的列字段，例如学生信息的记录表格中姓名列字段、学号列字段、学院列字段、班级列字段等，这些关键列字段归为固定列组；而身高列字段、年龄列字段、奖项列字段等作为非关键列字段，将几个非关键列字段归为一个扩展列组。之后，根据需要后台可以对扩展列组进行扩展，并对扩展列组编辑录入非关键字。

步骤220、当当前表格上显示的扩展列组为固定列组和第m个扩展列组，且所述第m个扩展列组不是最后一个扩展列组时，通过触发所述表格上的右移按钮，进而显示所述固定列组与第m+1个扩展列组，其中，所述m为大于或等于1且小于或等于n的正整数；

其中，在表格显示时，默认先行显示固定列组和第一个扩展列组，通过触发右移按钮或左移按钮选择扩展列组。如果当前显示的扩展列组不是最后一个扩展列组而是第m个扩展列组时，即m<n，通过触发右移按钮，将选择第m+1个扩展列组，进而将会显示固定列组和第m+1个扩展列组，m为大于或等于1且小于或等于n的正整数。

步骤230、当当前表格上显示的扩展列组为固定列组和第m个扩展列组，且所述第m个扩展列组不是第一个扩展列组时，通过触发所述表格上的左移按钮，进而显示所述固定列组与第m-1个扩展列组，其中，所述m为大于或等于1且小于或等于n的正整数。

其中，如果当前显示的扩展列组不是第一个列组时，而是第m个扩展列组，即m>1，通过触发左移按钮，将选择第m-1个扩展列组，进而将会显示固定列组和第m-1个扩展列组，所述m为大于或等于1且小于或等于n的正整数。

本发明实施例中，假设将表格上列字段划分为1个固定列组和n个扩展列组，所述n为大于或等于1的正整数，首次默认显示固定列组与第1个扩展列组，在触发右移按钮后，递进选择第2个扩展列组，改为显示固定列组与第2个扩展列组，一直触发右移按钮递进选择扩展列组，直到显示固定列组与第n个扩展列组，后续无法再向右移动；当当前显示的是固定列组与第m个扩展列组，所述m为大于或等于1且小于或等于n的正整数，在触发了左移按钮后，改为显示固定列组与第m-1个扩展列组，直到显示了固定列组与第1个扩展列组，无法再向左移动。

如图3所示，一种在web页面显示表格的方法，包括：

步骤310、确定表格列字段中的关键列字段；

其中，在一个表格中，相应地有比较关键的列字段和一些非关键的列字段，关键列字段在表格显示时，用户希望能够一目了然，为此，先确定表格列字段中哪些是关键列字段。

步骤320、将确定的关键列字段划分为固定列组；

其中，为了便于管理和显示清楚，将表格列字段中的关键列字段归为固定列组，以便在显示表格时，保持首先显示固定列组，进而使得每次关键列字段都能够在显示页面上显示。

步骤330、将表格列字段中的非关键列字段划分为至少一个扩展列组；

其中，表格中除了必要的关键列字段，还可以增加许多非关键的列字段，为了能在一个页面上合理显示表格上的内容，且减少使用滚动条等繁琐操作，将非关键列字段划分为至少一个扩展列组。

步骤340、通过触发右/左移按钮选择需要显示的任意一个扩展列组，使得每次表格上显示固定列组和任意一个扩展列组。

其中，配合使用表格上的右移或左移按钮，选择想要显示的扩展列组，每次显示表格时，只显示表格上的固定列组和任意一个扩展列组，保持显示页面的简洁。

本发明实施例中，确定表格列字段中的关键列字段，将关键列字段归为一个固定列组，然后将表格列字段中的非关键列字段划分为至少一个扩展列组，在触发了右移或左移按钮后，选择需要显示的扩展列组，保证显示页面简洁美观。

在划分了固定列组和扩展列组后，在后台中可以对固定列组和扩展列组进行设置，在固定列组中显示的是表格列字段中的关键列字段，关键列字段包含表格数据中的关键字，用户可以从固定列组中找到表格数据中的关键字，整个表格直观呈现给用户，管理简单。

如图4所示，本发明实施例提供了一种在web页面显示表格的系统，可包括：划分单元410和显示单元420；

其中，划分单元410，用于将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

显示单元420，用于通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

更进一步地，如图5所示，上述的显示单元420具体包括右移显示单元510和左移显示单元520；

其中，右移显示单元510，用于当触发所述右移按钮且当前显示的扩展列组不是右边最后一个扩展列组时，所述表格上显示所述固定列组与下一个扩展列组；

左移显示单元520，用于当触发所述左移按钮且当前显示的扩展列组不是左边第一个扩展列组时，所述表格上显示所述固定列组与前一个扩展列组。

本发明实施例提供的在web页面显示表格的系统，通过划分单元410将表格列字段划分为固定列组和至少一个扩展列组，显示单元420递进选择扩展列组后，在显示页面显示固定列组和任意一个扩展列组，显示页面简洁美观，可以在后台统一管理设置表格，在页面上选择需要显示的扩展列组。

本发明实施例提供了一种在web页面显示表格的方法及系统，将表格的列字段划分了固定列组和扩展列组，固定列组是表格中的关键列字段，扩展列组是表格中的非关键列字段，进而区分了表格数据中的关键列字段和非关键列字段，方便用户找到表格数据中的关键字，同时，通过左移按钮或右移按钮实现递进选择需要显示的扩展列组，每次只在表格中显示固定列组和任意一个扩展列组，简化表格的显示界面，还有利于用户管理和设置。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。

以上对本发明所提供的一种在web页面显示表格的方法及系统进行了详细介绍，对于本领域的一般技术人员，依据本发明实施例的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims (8)

1.一种在web页面显示表格的方法，其特征在于，包括：

将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

2.根据权利要求1所述的方法，其特征在于，所述固定列组设置在所述扩展列组的左边，所述扩展列组从左向右排列。

3.根据权利要求2所述的方法，其特征在于，所述移动按钮为左移/右移按钮，进而所述通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组，具体包括：

当触发所述右移按钮且当前显示的扩展列组不是右边最后一个扩展列组时，所述表格上显示所述固定列组与下一个扩展列组；

当触发所述左移按钮且当前显示的扩展列组不是左边第一个扩展列组时，所述表格上显示所述固定列组与前一个扩展列组。

4.根据权利要求1~3任一项所述的方法，其特征在于，当默认显示所述表格时，显示所述固定列组与左边第一个扩展列组。

5.根据权利要求3所述的方法，其特征在于，

所述左移按钮可通过点击触发和/或通过键盘上的方向键“←”触发；

所述右移按钮可通过点击触发和/或通过键盘上的方向键“→”触发。

6.根据权利要求1~3任一项所述的方法，其特征在于，所述固定列组可包括3~5个关键列字段，每个所述扩展列组可包括4~5个非关键列字段。

7.一种在web页面显示表格的系统，其特征在于，包括：

划分单元，用于将表格列字段划分为固定列组和至少一个扩展列组，所述固定列组的列字段为所述表格中的关键列字段，所述关键列字段包含表格数据中的关键字，所述扩展列组的列字段为所述表格中的非关键列字段，所述非关键列字段包含表格数据中的非关键字；

显示单元，用于通过触发所述表格上的移动按钮选择需要显示的扩展列组，使得每次所述表格上显示所述固定列组与任意一个扩展列组。

8.根据权利要求7所述的系统，其特征在于，所述移动按钮为左移/右移按钮，所述显示单元具体包括：

右移显示单元，用于当触发所述右移按钮且当前显示的扩展列组不是右边最后一个扩展列组时，所述表格上显示所述固定列组与下一个扩展列组；

左移显示单元，用于当触发所述左移按钮且当前显示的扩展列组不是左边第一个扩展列组时，所述表格上显示所述固定列组与前一个扩展列组。

Images