jQWidgets Forums

jQuery UI Widgets Forums Grid Show Grouping Aggregate Sums directly over column

Tagged: 

This topic contains 1 reply, has 1 voice, and was last updated by  jacobraccuia 8 years, 1 month ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • jacobraccuia
    Participant

    I believe there are other posts about this, but I am desperate for a solution or a stronger push in the right direction. The business requirement is to have the sum of the aggregate in the grouping header, like this (Run Rate, Amount):

    I put these headers here by using the groupsrenderer and calculating the distance from the left. On initial load, it works, but as soon as you scroll left or right, the header position is moved and it looks off and, well, not good. (see img below). I scrolled to the right, and because the aggregates don’t scroll left or right, it’s positioned off. I also tried to calculate the scrolled distance but there are too many variables and it was janky.

    I had an idea to put the columns directly after the name, but that is my absolute last resort. The table grid is seen behind this group aggregate row, and I tried using JS to pop the value into that field, but it is overwritten as soon as any thing is on the grid/window is interacted with.

    This might not be the right place but I have access to a budget and can donate for a solution if that is something possible to do.


    jacobraccuia
    Participant

    I actually think I just solved this and need to test more and format tomorrow….

    Inside groupsrenderer, I take the aggregate value and set it to the column value, inside of the group parent. I have to do an each loop and check to make sure the value isn’t already set.

    The below function is inside of my groupsrenderer, prior to the return which sets the group header. I will post my complete code once it’s checked out!

    ` $(‘.jqx-grid-group-details-cell’).each(function() {

    aTarget = $(this).closest(‘div[role=”row”]’).find(‘.amount’);
    bTarget = $(this).closest(‘div[role=”row”]’).find(‘.runRateFinal’);

    if(aTarget.html() == ”) {
    aTarget.html(aggregateA);
    }

    if(bTarget.html() == ”) {
    bTarget.html(aggregateB);
    }

    });`

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.