Interactive real-time sorting method and system for online tables
By implementing an interactive real-time sorting method in online tables, using intelligent sorting strategies for automatically analyzing selected cells, the problems of insufficient sorting flexibility and performance bottlenecks in the existing technology are solved, and data analysis efficiency and user experience are improved.
Patent Information
- Application Number
- CN202411635378.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-15
- Publication Date
- 2025-03-25
AI Technical Summary
The existing online table data sorting methods have problems such as insufficient flexibility, performance bottlenecks and inability to correctly express business meaning.
Adopt interactive real-time sorting method to realize intelligent sorting strategies through automatic analysis of selected cells, support flexible sorting of table headers, data rows, subtotal rows and total rows, avoid sending requests to background services, and realize real-time front-end sorting.
It improves the sorting flexibility and performance of online tables, optimizes the user experience, improves data analysis efficiency, and avoids performance problems in large concurrency situations.
Smart Images

Figure CN119692321A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the technical field of data processing, and in particular to an interactive real-time sorting method and system for online tables. Background Art
[0002] With the rapid development of information technology, online forms have become an important support for digital office due to their convenience, efficiency and flexibility. Online forms can easily process, analyze and publish data, thus promoting the improvement of office efficiency.
[0003] Online tables present data in two dimensions. As a basic function, data sorting plays an important role in various data analysis scenarios. Common processing methods for sorting online table data include the following solutions:
[0004] Solution 1: The server completes the sorting according to fixed rules and displays the data directly in the online table.
[0005] Solution 2: The server completes the sorting according to the configured rules, and the online table is directly displayed. The configured rules can come from the page of the online table or from a specific configuration function.
[0006] Solution 3: Based on Solution 1 or Solution 2, support header sorting, that is, by clicking each cell in the header, the table data can be sorted in ascending or descending order according to the corresponding column.
[0007] Solution 1 cannot dynamically change the sorting rules, and has the problem of inflexible sorting.
[0008] The sorting of Solution 2 still relies on the server. Changing the sorting rules requires waiting for the server to return, reloading and rendering the entire table, which will cause performance problems when the number of visits and data volume is large.
[0009] Solution 3 solves the defects of Solution 1 and Solution 2. However, if there are subtotal rows and total rows in the online table, this sorting result cannot correctly express the business meaning represented by the data. Summary of the invention
[0010] In order to overcome the shortcomings of existing online tables in sorting, the present invention provides an interactive real-time sorting method and system for online tables, which ensures sorting performance while enhancing the sorting flexibility of complex tables and improving the efficiency of data analysis.
[0011] In order to achieve the above-mentioned object of the invention, the technical solution adopted by the present invention is as follows:
[0012] An interactive real-time sorting method for an online table comprises the following steps:
[0013] S1, online form design: define the data and format of the online form, and design the form online;
[0014] S2, online table rendering: perform data acquisition and rendering of online tables;
[0015] S3, Online Table Interaction: Intelligent selection of sorting strategies through automatic analysis of selected cells.
[0016] Furthermore, S1 completes the data and format definition of the online table. For the table rows, there are four types: header row, data row, subtotal row, and total row. For the table columns, there are three types: data column, subtotal column, and total column.
[0017] Furthermore, for subtotal rows, the value of each cell is calculated based on the sum of the values of corresponding columns in a group of data rows; for total rows, the value of each cell is calculated based on the sum of the values of corresponding columns in all data rows; the same applies to subtotal columns and total columns, that is, for subtotal columns, the value of each cell is calculated based on the sum of the values of corresponding rows in a group of data columns; for total columns, the value of each cell is calculated based on the sum of the values of corresponding rows in all data columns.
[0018] Furthermore, S1 completes the online design of the table, including data binding and style setting. The sub-steps of S1 include:
[0019] S101, designing the header of the online table, and inputting the column names in each cell of the header;
[0020] Optionally, the table header can have multiple rows, and row and column merging cells are supported;
[0021] Optionally, you can enter a formula or expression in the header cell, and assign a value to the header cell based on the calculation result when the table is displayed;
[0022] S102, designing the data area of the online table, and entering the data source field name in the cell of the first row below the table header;
[0023] Optionally, you can enter formulas or expressions in the cells of the data area, and assign values to the cells based on the calculation results when the table is displayed;
[0024] Optionally, based on a specific data dimension, set the subtotal column calculation rule, that is, the value of each cell in the subtotal column is equal to the sum of the values of cells in multiple columns. There are generally multiple subtotal columns based on the same dimension (it can be one or more);
[0025] Optionally, based on a specific data dimension, set the calculation rule for the total column, that is, the value of each cell in the total column is equal to the sum of the values of cells in multiple columns. There is only one total column based on the same dimension.
[0026] S103, optionally, based on a specific data dimension, a subtotal row calculation rule is set, that is, the value of each cell in the subtotal row is equal to the sum of the values of cells in multiple rows, and there are generally multiple subtotal rows based on the same dimension (it can be one or more);
[0027] Optionally, based on a specific data dimension, set the calculation rule for the total row, that is, the value of each cell in the total row is equal to the sum of the values of cells in multiple rows. There is only one total row based on the same dimension.
[0028] S104, optionally, setting a display style for the elements in the table, such as color, border, font, etc.;
[0029] S105, saving the above information through the background service.
[0030] Furthermore, S2 completes the data acquisition and rendering of the online form, and the sub-steps of S2 include:
[0031] S201, the online form sends a request to the backend service;
[0032] S202, the backend service receives the request, parses the table data according to the request information, and generates a static HTML string;
[0033] During the background parsing process, the header row, data row, subtotal row, total row, subtotal column, and total column need to be identified and marked in HTML;
[0034] S203, the backend service returns the static HTML string to the online form;
[0035] S204, the online form obtains data returned by the background service and completes loading and rendering.
[0036] Furthermore, S3 implements intelligent selection of sorting strategies by automatically analyzing the selected cells, and the sub-steps of S3 include:
[0037] S301, select a cell, record the row where the selected cell is located as a selected row, and record the column where the selected cell is located as a selected column;
[0038] S302, select a sorting method, including ascending order and descending order;
[0039] S303, if the selected cell is in the header row, the sorting rule is: sort each row and sort all the data in the column;
[0040] S304, if the selected cell is in a data row, the sorting rule is: sort each row, keep the overall order of the subtotal groups of each row in the column unchanged, and sort within the group according to the detail value of the column;
[0041] S305, if the selected cell is in a subtotal row, the sorting rule is: sort each row, first sort each group based on the row subtotal value of the column in which it is located, and then sort within the group based on the detail value of the column in which it is located;
[0042] S306, if the selected cell is in the total row and data column, the sorting rule is: sort each column, keep the overall order of the subtotal groups of each row and column unchanged, and sort the subtotals in the group according to the detailed values of the corresponding columns;
[0043] S307, if the selected cell is located in the total row, subtotal column (or total column), the sorting rule is: sort each column, first sort each group based on the column subtotal of the row, and then sort within the group according to the detailed value.
[0044] The present invention also provides an interactive real-time sorting system for online tables, comprising:
[0045] Online table design module, used to define the data and format of online tables and to design tables online;
[0046] Online table rendering module, used for data acquisition and rendering of online tables;
[0047] Online table interaction module, used to realize intelligent selection of sorting strategy through automatic analysis of selected cells.
[0048] The beneficial effects of the present invention are: by marking and identifying the rows and columns of online tables, intelligently matching data sorting rules, and forming a unified sorting mode, the online table displays data in a more logical way, reducing development costs, optimizing user experience, and improving data analysis efficiency. Since the sorting operation does not require sending a request to the background service, real-time dynamic sorting is achieved, the response efficiency is improved, performance problems in large concurrency situations are avoided, and the pressure on the background server is reduced. BRIEF DESCRIPTION OF THE DRAWINGS
[0049] Figure 1 It is a schematic diagram of the process of Example 1 of the present invention.
[0050] Figure 2 It is a flowchart of step S1 of embodiment 1 of the present invention.
[0051] Figure 3 It is a flowchart of step S2 of embodiment 1 of the present invention.
[0052] Figure 4 It is a flowchart of step S3 of embodiment 1 of the present invention.
[0053] Figure 5 This is an example diagram of an online form according to Embodiment 2 of the present invention.
[0054] Figure 6 This is an example diagram of row sorting based on the header row.
[0055] Figure 7 is an example diagram of row sorting based on data rows.
[0056] Figure 8 is an example diagram of row sorting based on subtotal rows.
[0057] Fig. 9 This is an example diagram of column sorting based on total rows and data columns.
[0058] Fig.10 This is an example of sorting columns based on total rows, not data columns. DETAILED DESCRIPTION
[0059] The present invention will be further described in detail below in conjunction with the accompanying drawings and specific embodiments. Obviously, the described embodiments are only a part of the embodiments of the present invention, rather than all the embodiments.
[0060] Embodiment 1:
[0061] The present invention provides an interactive real-time sorting method for an online table, which can enhance the sorting flexibility of complex tables while ensuring the sorting performance and improve the efficiency of data analysis.
[0062] In order to achieve the above-mentioned purpose, the technical solution adopted by the present invention includes: Figure 1 The following steps:
[0063] S1, online form design;
[0064] S2, online table rendering;
[0065] S3, online table interaction.
[0066] S1 completes the data and format definition of the online table. The table rows include four types: header row, data row, subtotal row, and total row. The table columns include three types: data column, subtotal column, and total column.
[0067] Furthermore, for subtotal rows, the value of each cell is calculated based on the sum of the values of corresponding columns in a group of data rows; for total rows, the value of each cell is calculated based on the sum of the values of corresponding columns in all data rows; the same applies to subtotal columns and total columns, that is, for subtotal columns, the value of each cell is calculated based on the sum of the values of corresponding rows in a group of data columns; for total columns, the value of each cell is calculated based on the sum of the values of corresponding rows in all data columns.
[0068] S1 completes the online design of the table, including data binding and style setting. Figure 2 As shown, the sub-steps of S1 include:
[0069] S101, design the header of the online table and enter the column name in each cell of the header.
[0070] Optionally, the table header can have multiple rows, and row and column merging cells are supported;
[0071] Optionally, you can enter a formula or expression in the header cell, and assign a value to the header cell based on the calculation result when the table is displayed.
[0072] S102, designing the data area of the online table, and entering the data source field name in the cell of the first row below the table header.
[0073] Optionally, you can enter formulas or expressions in the cells of the data area, and assign values to the cells based on the calculation results when the table is displayed;
[0074] Optionally, based on a specific data dimension, set the subtotal column calculation rule, that is, the value of each cell in the subtotal column is equal to the sum of the values of cells in multiple columns. There are usually multiple subtotal columns based on the same dimension.
[0075] Optionally, based on a specific data dimension, set the calculation rules for the total column, that is, the value of each cell in the total column is equal to the sum of the values of cells in multiple columns. There is only one total column based on the same dimension.
[0076] S103, optionally, based on a specific data dimension, a subtotal row calculation rule is set, that is, the value of each cell in the subtotal row is equal to the sum of the values of cells in multiple rows, and there are generally multiple subtotal rows based on the same dimension.
[0077] Optionally, based on a specific data dimension, set the calculation rule for the total row, that is, the value of each cell in the total row is equal to the sum of the values of cells in multiple rows. There is only one total row based on the same dimension.
[0078] S104, optionally, a display style may be set for the elements in the table, such as color, border, font, etc.
[0079] S105, saving the above information through the background service.
[0080] The above steps may also be divided in other forms, for example, S103 may be incorporated into S102, and "setting subtotal column calculation rules" and "setting total column calculation rules" in S102 may also be listed as a separate step, and so on.
[0081] S2 completes the parsing and rendering of the online form. Figure 3 As shown, the sub-steps of S2 include:
[0082] S201, the online form sends a request to the backend service (obtaining a form parsing request);
[0083] S202, the backend service receives the request, parses the table data according to the request information, and generates a static HTML string;
[0084] During the background parsing process, it is necessary to identify the header row, data row, subtotal row, total row, subtotal column, and total column, and mark them in HTML.
[0085] For the marking of the header row, each cell is implemented using HTML tags.
[0086] The marking of the subtotal row is achieved by assigning a value to the class attribute of the row label, such as, etc.
[0087] The marking of the total row is achieved by assigning a value to the class attribute of the row label.
[0088] The marking of the subtotal column is achieved by assigning a value to the class of each cell, such as, etc.
[0089] The marking of the total column is achieved by assigning a value to the class of each cell, such as.
[0090] When there are subtotal rows, the marking of the data rows is achieved by assigning a value to the class of the row label to distinguish the correspondence between the subtotal rows and the data rows, such as, etc.
[0091] When there is a subtotal column, the data column is marked by assigning a class value to each cell in the total row to distinguish the correspondence between the subtotal column and the data column, such as,<tdclass=“subtotal001-001-002”> wait.
[0092] S203, the backend service returns the static HTML string to the online form;
[0093] S204, the online form obtains the data returned by the background service, and completes loading and rendering. Rendering refers to drawing the HTML data as a visual element in the page based on the browser's own capabilities.
[0094] The S3 implements intelligent selection of sorting strategies by automatically analyzing the selected cells. Figure 4 As shown, the sub-steps of S3 include:
[0095] S301, select a cell, record the row where the selected cell is located as a selected row, and record the column where the selected cell is located as a selected column;
[0096] S302, select a sorting method, including ascending order and descending order;
[0097] S303, if the selected cell is in the header row, the sorting rule is: sort each row and sort all the data in the column;
[0098] S304, if the selected cell is in a data row, the sorting rule is: sort each row, keep the overall order of the subtotal groups of each row in the column unchanged, and sort within the group according to the detail value of the column;
[0099] S305, if the selected cell is in a subtotal row, the sorting rule is: sort each row, first sort each group based on the row subtotal value of the column in which it is located, and then sort within the group based on the detail value of the column in which it is located;
[0100] S306, if the selected cell is in the total row and data column, the sorting rule is: sort each column, keep the overall order of the subtotal groups of each row and column unchanged, and sort the subtotals in the group according to the detailed values of the corresponding columns;
[0101] S307, if the selected cell is located in the total row, subtotal column (or total column), the sorting rule is: sort each column, first sort each group based on the column subtotal of the row, and then sort within the group according to the detailed value.
[0102] Embodiment 2:
[0103] This solution is further explained by taking the sales of specific products in certain areas as an example.
[0104] Examples of online forms include Figure 5 As shown, in addition to the table header and data rows, it includes subtotal rows, total rows, subtotal columns, and total columns.
[0105] The following is an example of the markup for a table header:
[0106]
[0107]
[0108] The following is a description of a specific example of interactive sorting.
[0109] 1) Initial data The initial data of the online form is as follows Figure 5 shown.
[0110] 2) Row sorting based on the header row
[0111] In the initial data state, select a cell in the header row, such as the "Amount" cell, and select "Ascending" from the right-click menu to sort all rows in the table. In ascending order of "Block" and "Amount", sort all rows in the table as a whole. The sorting result is as follows: Figure 6 shown.
[0112] 3) Row sorting based on data rows
[0113] In the initial data state, select a cell in the data row, such as the "560" cell, and select "Ascending" in the right-click menu to sort the data rows in the "Northern Region" and "Southern Region" groups respectively. The relative order of the two groups "Northern Region" and "Southern Region" remains unchanged. In ascending order of "Blocks" and "Sales Volume", the sorting results are as follows: Figure 7 shown.
[0114] 4) Row sorting based on subtotal rows
[0115] In the initial data state, select the cell of the subtotal row, such as the "59000" cell, and select "Descending" in the right-click menu. First, sort the rows of "Northern Region" and "Southern Region" as a whole, and then sort each data row within "Northern Region" and "Southern Region". First, sort the two groups of rows in descending order by "Northern Region" "Subtotal" and "Southern Region" "Subtotal" of "Puzzle" "Amount", and then sort each row in descending order according to "Amount" of "Puzzle" within "Northern Region" and "Southern Region". The sorting results are as follows: Figure 8 shown.
[0116] 5) Column sorting based on total rows and data columns
[0117] In the initial data state, select the cells of the total row and data column, such as the "91000" cell, and select "Ascending" in the right-click menu to keep the order of each row unchanged, and sort the data columns in "Toys" and "Stationery" respectively. The two groups of columns "Toys" and "Stationery" are treated as a whole, and the relative order remains unchanged. According to the ascending order of the "amount" of each product, the sorting results are as follows Fig. 9 shown.
[0118] 6) Column sorting based on total rows and non-data columns
[0119] In the initial data state, select the total row, non-data column cell, such as the "306400" cell, and select "Ascending" in the right-click menu to keep the order of each row unchanged. First, sort the "Stationery" and "Toys" columns as a whole, and then sort each data column within "Stationery" and "Toys". First, sort the two groups of columns in ascending order by the "Subtotal Amount" of "Stationery" and "Toys", and then sort the product columns in ascending order according to the "Amount" of each product within "Stationery" and "Toys". The sorting results are as follows: Fig.10 shown.
[0120] The innovative features or inventive points of the present invention are as follows:
[0121] Innovation 1: Interactive sorting. After the online table is rendered, users can complete interactive sorting by clicking or right-clicking the browser, providing more interactive methods.
[0122] Innovation point 2: Intelligent sorting. Based on the tags prepared in advance by the server, the online spreadsheet can intelligently identify the properties of each cell, and the sorting results are more comprehensive based on the business characteristics of the data.
[0123] Innovation point 3: Real-time sorting. Sorting is done on the front end, without returning to the server for calculation, thus avoiding performance bottlenecks.
[0124] Another embodiment of the present invention provides an interactive real-time sorting system for online tables, comprising:
[0125] Online table design module, used to define the data and format of online tables and to design tables online;
[0126] Online table rendering module, used for data acquisition and rendering of online tables;
[0127] Online table interaction module, used to realize intelligent selection of sorting strategy through automatic analysis of selected cells.
[0128] The division of the above modules is only an example. In actual applications, the above functions can be assigned to different functional modules as needed to complete all or part of the functions described in the above method. The specific working process of each module can refer to the corresponding process in the above method embodiment, which will not be repeated here.
[0129] Another embodiment of the present invention provides a computer device (computer, server, smart phone, etc.), which includes a memory and a processor, the memory stores a computer program, the computer program is configured to be executed by the processor, and the computer program includes instructions for executing each step in the method of the present invention.
[0130] Another embodiment of the present invention provides a computer-readable storage medium (such as ROM / RAM, magnetic disk, optical disk), wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a computer, the steps of the method of the present invention are implemented.
[0131] The specific embodiments of the present invention disclosed above are intended to help understand the content of the present invention and implement it accordingly. It can be understood by those skilled in the art that various replacements, changes and modifications are possible without departing from the spirit and scope of the present invention. The present invention should not be limited to the contents disclosed in the embodiments of this specification, and the scope of protection of the present invention shall be subject to the scope defined in the claims.
Claims
1. An interactive real-time sorting method for online tables, characterized in that: The following steps are involved: Define the data and format of online tables, and design the tables online; Perform data acquisition and rendering of online forms; Intelligent selection of sorting strategy is achieved through automatic analysis of selected cells.
2. The method according to claim 1, characterized in that The data and format definition of the online form includes: For table rows, there are four types: header row, data row, subtotal row, and total row; for table columns, there are three types: data column, subtotal column, and total column; For a subtotal row, the value of each cell is calculated based on the sum of the values of the corresponding columns in a set of data rows; For the total row, the value of each cell is calculated based on the sum of the values of the corresponding columns in all data rows; For a subtotal column, the value of each cell is calculated based on the sum of the values of the corresponding rows in a set of data columns; For a total column, the value of each cell is calculated based on the sum of the values of the corresponding rows in all data columns.
3. The method according to claim 1, characterized in that Online design of the form, including: Design the header of the online table and enter the column names in each cell of the header; Design the data area of the online table and enter the data source field name in the cell of the first row below the table header; Based on a specific data dimension, set the subtotal column calculation rule, that is, the value of each cell in the subtotal column is equal to the sum of the values of cells in multiple columns. There are usually multiple subtotal columns based on the same dimension; Based on a specific data dimension, set the calculation rules for the total column, that is, the value of each cell in the total column is equal to the sum of the values of cells in multiple columns. There is only one total column based on the same dimension. Based on a specific data dimension, set the subtotal row calculation rule, that is, the value of each cell in the subtotal row is equal to the sum of the values of cells in multiple rows. There are usually multiple subtotal rows based on the same dimension. Based on a specific data dimension, set the calculation rule for the total row, that is, the value of each cell in the total row is equal to the sum of the values of cells in multiple rows. There is only one total row based on the same dimension. Sets the display style for the elements in the table.
4. The method according to claim 3, characterized in that The table header may have multiple rows and support row and column merging cells; formulas or expressions may be entered into the table header cells, and values are assigned to the header cells based on the calculation results when the table is displayed.
5. The method according to claim 3, characterized in that: Formulas or expressions can be entered into the cells of the data area, and the cells are assigned values according to the calculation results when the table is displayed; the display style includes color, border, and font.
6. The method according to claim 1, characterized in that The data acquisition and rendering of the online form includes The online form sends a request to the backend service; The backend service receives the request, parses the table data according to the request information, and generates a static HTML string. During the parsing process, the backend service identifies the header row, data row, subtotal row, total row, subtotal column, and total column, and marks them in HTML. The backend service returns a static HTML string to the online form; The online form obtains data returned by the background service and completes loading and rendering.
7. The method according to claim 1, characterized in that The intelligent selection of the sorting strategy by automatically analyzing the selected cells includes: Select a cell, record the row where the selected cell is located as the selected row, and record the column where the selected cell is located as the selected column; Select the sorting method, including ascending and descending; If the selected cell is in the header row, the sorting rule is: sort each row and sort all the data in the column; If the selected cell is in the data row, the sorting rule is: sort each row, keep the overall order of the subtotal groups of each row in the column unchanged, and sort within the group according to the detailed value of the column; If the selected cell is in a subtotal row, the sorting rule is: sort each row, first sort each group based on the row subtotal value of the column, and then sort within the group based on the detail value of the column; If the selected cell is in the total row and data column, the sorting rule is: sort each column, keep the overall order of the subtotal groups of each row and column unchanged, and sort within the group according to the detailed values of the corresponding columns; If the selected cell is in the total row or subtotal column, or the selected cell is in the total row or total column, the sorting rule is: sort each column, first sort each group based on the column subtotal of the row, and then sort within the group according to the detail value.
8. An interactive real-time ranking system for online tables, characterized in that: include: Online table design module, used to define the data and format of online tables and to design tables online; Online table rendering module, used for data acquisition and rendering of online tables; Online table interaction module, used to realize intelligent selection of sorting strategy through automatic analysis of selected cells.
9. A computer device, characterized in that: The method comprises a memory and a processor, wherein the memory stores a computer program, the computer program is configured to be executed by the processor, and the computer program comprises instructions for executing the method according to any one of claims 1 to 7.
10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, and when the computer program is executed by a computer, the method according to any one of claims 1 to 7 is implemented.