Delete generated elements from div angularjs

Question

I want to delete the criteria list item on clicking the delete button. Right now only the filter is getting refreshed. The tables are not being deleted. Suggestions to get through this.

HTML

   <ul class="list-unstyled">
  <li style="display: inline-block" ng-repeat="crtia in newCriteria" >
    <table>
      <tr>

        <td>
          <select class="input-sm" ng-model="crtia.name" ng-options="searchopt for searchopt in searchcriteria " ng-click="searchy.check()"></select>
        </td>
        <td>
          <input class="input-sm " ng-model="crtia.value" placeholder="{{crtia.name}}" ng-change="newList()" ng-click="searchy.check()" />
        </td>
        <td>
       <button type="button" class="btn btn-danger btn-xs" aria-label="Left Align" ng-click="removeCriteria($index)">
       <span class="glyphicon glyphicon-remove" aria-hidden="true" ></span>
        </button>
        </td>
      </tr>

    </table>
  </li>
</ul>

JS

     $scope.removeCriteria=function($index){
      $scope.searchy.check();
      alert($index);
     $scope.newCriteria.splice($index,1);
      $scope.newList();         //Refreshes the filter
    }

plunkr: plnkr.co/edit/3yOmiIJ9Yu9RfAgmuVA7

Nitesh Kadam
– Nitesh Kadam

2015-11-05 04:36:23 +00:00
Commented Nov 5, 2015 at 4:36 — Nitesh Kadam
– Nitesh Kadam, Commented Nov 5, 2015 at 4:36
i am fixing your problem wait

Shohel
– Shohel

2015-11-05 04:46:36 +00:00
Commented Nov 5, 2015 at 4:46 — Shohel
– Shohel, Commented Nov 5, 2015 at 4:46

Shohel · Accepted Answer · 2015-11-05 04:56:57Z

1

Try this

HTML

<button type="button" class="btn btn-danger btn-xs" aria-label="Left Align" data-ng-click="removeCriteria(crtia)">
   <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
</button>

JS:

$scope.removeCriteria = function (sourceToRemove) {
    $scope.searchy.check();

    var index = $scope.newCriteria.indexOf(sourceToRemove);
    $scope.newCriteria.splice(index, 1);
    $scope.newList();         //Refreshes the filter
}

Update Plunker

edited Nov 5, 2015 at 4:56

answered Nov 5, 2015 at 4:41

Shohel

3,9645 gold badges41 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shohel Over a year ago

Object index and ng repeat index both are different

Collectives™ on Stack Overflow

Delete generated elements from div angularjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related