Table "jumps" when url is changed, angular js - angularjs

Question

I have a table with items. When a row is clicked, detailed item information shows upp in a fixed div next to the table.
The div next to the table is hooked up to a parameter in the url. So when I click an item, the url changes the url to /project/:itemID
The issue is that when a row is clicked, the table "jumps" to another position. The scroll changes position. I want it to stay the same place.
This is my controller which changes the url:
$scope.goToProduct = function(id){
var path = $location.path();
var splitUrl = path.split('/');
var project = splitUrl[1];
console.log(project);
$location.path(project + '/' + id);
}
This is my view:
<input type="text" class="form-control" placeholder="Search">
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>Code</th>
<th>Namn</th>
<th>Manufactor</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="product in products | filter:query" ng-click="goToProduct(product.pr_id)">
<td>{{product.pr_usercode}}</td>
<td>{{product.pr_title}}</td>
<td>{{product.pr_producer}}</td>
<td>{{product.pr_description}}</td>
</tr>
</tbody>
</table>
</div>
Any idea how to solve this?

Answer 1

Solved. Ui-router had a handy directive. Just add autoscroll="false". Docs: https://github.com/angular-ui/ui-router/wiki/Quick-Reference#wiki-autoscroll