angular-ui/ui-grid

Incorrect behavior for pinned columns

Open

#6,351 opened on Aug 7, 2017

View on GitHub
 (0 comments) (0 reactions) (0 assignees)JavaScript (5,395 stars) (2,496 forks)batch import
grid-pinninghelp wantedneeds: analysis

Description

The following issue reappeared in 4.0.6 https://github.com/angular-ui/ui-grid/issues/3935

A new issue when the above code is applied, which exists with or without the code are the following: -Pinned columns can be stretched past the grid's max width (happens on both left and right pinned columns) -Columns should only be resized from the right end of the specific column. For example, if you pin a column to the left, the left side of the border will resize the pinned column, the right side of the border will resize the column to the right of the border.

image

Contributor guide

Tech stack
javascriptangular
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
AngularJS basicsUI Grid DOM structureCSS responsive design
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
35
Research direction
Investigate the column resizing logic in the `ui grid` codebase, particularly the handling of pinned columns. Review the previous issue #3935 to understand the original problem and solution. Look at the CSS related to column resizing and max width constraints. Test with a simple grid setup to reproduce both described behaviors. Once identified, propose a fix that ensures pinned columns respect the grid's max width and only resize from the appropriate side.