angular-ui/ui-grid

Focus on input lost (cellTemplate)

Open

#4,994 opened on Jan 19, 2016

View on GitHub
 (1 comment) (0 reactions) (0 assignees)JavaScript (5,395 stars) (2,496 forks)batch import
help wanted

Description

There's an issue when you have a regularly updating datasource. Let's say i update my grid datasource with the latest values every 15 seconds and in my grid i have a templated column with an input field. (not edit mode)

lets say i have row ids: 1 , 2 , 3 , 4 , 5 And for my third row i start typing in the input field while someone deleted row 2. Now i have rowId's 1 , 3 , 4 , 5. Now rowId 3 is my second row in the grid. Whatever i have typed, it appears in the input field of the second row. Which is correct. However, focus is now set to the input of my third row, thus rowid 4. Which is wrong.

I've been able to figure out that in 'ui-grid/ui-grid-row' template a variable rowRenderIndex is used to identify my grid row, however, when the datasource is updated, this value doesn't change? I've tried replacing that variable with the id of my record row.entity.id, but upon datasource update i see an inconsistency between my json object and the id used in the html. In the html it keeps using the order 1,2,3,4,5, eventhough i no longer have a record with id 2.

Is there any way to keep focus on my record with id 3? Seems like there's a bug in here somewhere.

A plunker to demonstrate the issue: http://plnkr.co/edit/HIWWHwJa7YTQMrvp7b1c?p=preview Every 2 second i remove the first row. just start typing in the input field of record 8.

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.
4
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
3-5 days
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.
mostly clear
Prerequisites
AngularJSui grid componentDOM focus managementgrid data binding
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
25
Research direction
Investigate the 'ui grid row' directive to understand how rowRenderIndex is computed and updated during data source changes. Examine the focus handling in the cell template to ensure it tracks the correct row entity. Use the provided plunker example to reproduce the bug and verify any fix.