Our requirement is that we have to allocate some cash in % to list of items and to provide reason and effective date for allocations.

Multiple times allocations can be added to same set of items. Once effective date reaches, new becomes active and the active one move to inactive state.

I have 2 tables:

  1. Item Allocations

enter image description here

2 Reason and effective date

enter image description here .

allocations provided in column 2 of table 1 mapped to reasons and effective date mentioned in column 2 of table 2 and so on.

So the user flow would be : 1. Initial view will have one column for allocation and one for Reason and effective date.

ITEM      100%
======= =======
Item1     10
------  -------
Item2     30
------  -------
Item3     60
------  -------

State              New
=======          --------
Reason             R2
=======          --------
Effective date    08/05/2017
=======          ---------

User enters the allocations sum up to 100% and provides reason/comment and effective date under new state for that allocation as shown above.

  1. User fills the above details and saves it. Once effective date reaches, it state changes to active.
  2. Now if user wants to add new allocations, he can again go to maintenance page, that will show the active allocation that he saved previously.
ITEM      100%    100%
======= ======= =======
Item1     0      10
------  ------- -------
Item2     0      30
------  ------- ------
Item3     0      60
------  ------- ------

State              New      Active
=======          --------   --------
Reason                        R2
=======          --------   --------
Effective date               08/05/2017
=======          ---------  -----------

Similar to step 1, user fills the column values in both the tables. Final view of the tables can be seen at the top of this description.

I am not able to find a way to show relationship between columns of above tables. Thanks in advance.

  • What's the difference between both 100% columns on the 1st table and is the content on the 2nd content related with one of the items selected on the 1st table? May 9, 2017 at 6:57
  • I have updated the description, request you to go through once. To answer your question: we can add as many 100% columns, each having different effective date. We can add one column at a time for a given work flow. Yes, user need to provide reason/comment and effective date for every 100% column. So the relationship is if I am providing the allocations that should sum up to 100% for my items, I have to give reasons/comments for such allocations and also the effective date for allocation to come into effect or to become active.
    – Honey
    May 9, 2017 at 9:09

2 Answers 2


If you keep the information in two seperate tables you will force users to constantly link information between the two tables thus creating unessesary cognitive load, so I recommend you to merge the two tables :

enter image description here

  • Thanks for the prompt response. Look good to me. But I need to provide a way to the user to enter values for state, date and reasons. How I can do so. What I think we can add one button/icon below each column except first and onclick of it a model opens asking user to enter the required details. once user submit/save it starts reflecting as shown by you. And also how I can make it mandatory.
    – Honey
    May 9, 2017 at 10:29
  • @Honey Yes you may try a pop up dialog as you suggest, if it is technically more easy to do. But ideally you can use enterable fields for reason, date and state, just as it is now displayed on the header. You can vaildate mandatory when the users tries to enter percentages on the fields below. May 9, 2017 at 10:40
  • So if I understand correctly, you suggest to show editable fields in column header itself. Date and reasons (which could be upto 500 characters) fields may take good amount of space. Will not be any space issue ? Is it good idea to make column header editable as usually we only do it for td cell.
    – Honey
    May 9, 2017 at 11:28
  • You have all the specs for the problem, and you can judge better than me what is best. I am only making a suggestion here. If there is a space issue you may use a pop window for edit and you may display part of the reason field in the header i.e. only the first 50 characters. May 9, 2017 at 12:00
  • Thanks for the suggestions. First time I have posted on stack exchange and found it very useful. Cheers
    – Honey
    May 9, 2017 at 12:10

Based on the suggestions provided, here is how my final version of table looks like:

enter image description here

Just avoided the duplication of labels.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.