1

We have a UIform (angular js) which has Edit button in each row. Edit button has a condition that only one row can be edited at a time. I need to insert another button at top to disable edit button in all the rows. Please assist.

Current code: btn ng-disable = disableedit ng-click form-edit > button < /btn

disableedit function disables all edit button except for current row which is being edited. Please assist what should be the code for the new EditDisable button.

Sujith K
  • 11
  • 1
  • Can i write a blank function and assign it to new button. And in edit button is it possible to give more than one ng-disable. – Sujith K Aug 08 '20 at 04:47

1 Answers1

0

As i understand you want to enable edit button only when the user is hovering at that row. Here is my attempt to achieve the same. You can use ng-mouseenter and ng-mouseout events to trigger functions.

  • mouseenter : The event occurs when the pointer is moved onto an element.

  • mouseout : The event occurs when a user moves the mouse pointer out of an element, or out of one of its children

    <div ng-app="myApp" ng-controller="MainCtrl">
  <div class="mb-20" ng-repeat="row in rows" ng-mouseenter="rowid=$index+1">
    <span>{{$index+1}}</span>
    <span>{{row.value}}</span>
    <span>
     <button ng-disabled="rowid!=$index+1" ng-mouseout="rowid=0">edit</button>
    </span>
  </div>
</div>

So , basically check if your row_id is equal to the current index enable the button else let it be disabled.

Here's the jsfiddle link : http://jsfiddle.net/khushboo097/ohvqjdye/

Khushboo
  • 96
  • 5