title: stop scroll to top by clicking angular xeditable field in ng-repeat form
body: <p>When I click on one of the xeditable fields in my form which is populated by <code>ng-repeat</code>, the form scrolls to the top.</p>
  
  <pre><code>    &lt;form editable-form name="myxedit"&gt;
          &lt;fieldset ng-repeat="shop in myModel.shops track by $index"&gt;
              &lt;h2&gt;Map Test # {{$index + 1}}&lt;/h2&gt;
  
              &lt;div class="col-md-6 pac-card" id="pac-card"&gt;
                  &lt;input id="pac-input-{{$index}}" title="Search" type="text" ng-change="cityCode($index)" ng-model="shop.placeName" /&gt;
                  &lt;div&gt;city is: {{shop.city}}&lt;/div&gt;
                  &lt;div&gt;country is: {{shop.country}}&lt;/div&gt;
              &lt;/div&gt;
              &lt;div id="map_canvas-{{$index}}" style="height: 200px;width: 200px;"&gt;&lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;input id="radio-{{$index}}" type="checkbox" ng-model="shop.isFirst" name="firstShop" style="-webkit-appearance: radio;-moz-appearance: radio;-ms-appearance: radio;" ng-change="firstShopChange($index)"&gt;
                  &lt;label for="radio-{{$index}}"&gt;First Shop&lt;/label&gt;
              &lt;/div&gt;
              &lt;div class="col-md-12"&gt;
                  &lt;div class="form-group" ng-if="myModel.shops.length &gt; 1"&gt;
                      &lt;span class="btn btn-danger pull-right" ng-click="removeShop($index)"&gt;Remove Shop&lt;/span&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;div&gt;
                  &lt;span e-name="erer" class="editable-click" ng-click="$form.$show()" ng-disabled="myxedit.$waiting" e-ng-blur="$form.$hide()" href="#" editable-text="shop.address"&gt;
                {{ shop.address || 'empty' }}
            &lt;/span&gt;
                  &lt;span ng-show="myxedit.$visible"&gt;
                &lt;button type="submit" class="btn btn-primary" ng-disabled="myxedit.$waiting"&gt;
                  &lt;span class="glyphicon glyphicon-ok"&gt;&lt;/span&gt;
                  &lt;/button&gt;
                  &lt;button type="button" class="btn btn-default" ng-disabled="myxedit.$waiting" ng-click="myxedit.$cancel()"&gt;
                      &lt;span class="glyphicon glyphicon-remove"&gt;&lt;/span&gt;
                  &lt;/button&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
  
          &lt;/fieldset&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>I have only one xeditable field in every ng-repeat.
  <br>
  How can I stop it from scrolling to the top?
  <br>
  As you can see that I am tracking the ng-repeat by index, let's say I click on xeditable field in the third <code>fieldset</code> that is repeated by ng-repeat, the form scrolls to top to the xeditable in the first fieldset.</p>
  
  <h2>update:</h2>
  
  <p>here is the plunker.
  <a href="https://plnkr.co/edit/y8UHwTHTxtxvQYSWICoh?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/y8UHwTHTxtxvQYSWICoh?p=preview</a>
  <br>
  this strange behaviour is visible if you add more shops, and then click on the xeditable field in the last shop, and the form will scroll to the top.</p>