turn off re-sorting in angularJS while editing
angularjs, angularjs-ng-repeat
Solution
This is the plunkr that shows how I solved the problem.
http://embed.plnkr.co/eBbjOqNly2QFKkmz9EIh/preview
Problem
I have an AngularJS app that lists a bunch of items in a table. Like this: ``` <table class='unstyled tmain'> <tr> <td ng-click='setSort($event)'>X</td> <td ng-click='setSort($event)'>Desc</td> <td ng-click='setSort($event)'>created</td> <td> </td> </tr> <tr ng-repeat="item in items | orderBy:itemNormalizationFunction:sortReverse"> <td><input type='checkbox' ng-model='item.done' ng-click='onCheckedChanged(item)'/></td> <td><div edit-in-place="item.text" on-save="updateItemText(value,previousValue,item)"></div></td> <td><span class='foo'>{{item.created | dateFormatter}}</span></td> </tr> </table> ``` The table headers are clickable to set the sort order. The cell in the 2nd column in each data row is editable "in place" - if you click on the text it gets replaced with an input textbox, and the user can edit the text. I have a little directive enabling that. This all works. The problem comes in while editing. Suppose I have it set to sort by "description" (the 2nd column). Then if I edit the description (via the edit-in-place directive), as I am typing in the input box, the sort order changes. If I change the first few characters, then angular re-sorts and the item is no longer under my cursor. Nor is it even focused. I have to go hunting through the list to find out where it got re-sorted to, then I can re-focus, and resume typing. This is kinda lame. What I'd like to do is tell angular to (a) stop re-sorting while I am keying in the input box, or (b) sort on a separate (not-displayed) index value that preserves the ordering before the edit began. But I don't know how to do either of those. Can anyone give me a hint? I know this is sort of complicated so I'll try to put together a plunkr to show what's happening.