Edit button on AngularJS Todo App not working


I am creating a todo app using AngularJS. But my code is not working well. So, I need someone to help me fix my code.

My edit button is not working. When I clicked it, it doesn’t show the edit form as I expected. You can try by yourself by looking at my JSfiddle

Here is my code :

Can you provide a little more detail?

Describe the steps, expected behavior, inappropriate behavior. Walk me through the problem.

I don’t have experience with Angular but there are many here who can help you; if you can describe the problem.


Done ! People can try through my jsfiddle

All your change function does is copy it into selected. It needs to do more if you want it to do more.

<button type="submit" ng-click="change(todo)">Edit</button>
$scope.change = function(field){
    $scope.selected = angular.copy(field);

It doesn’t even look like you’re trying to handle editing. Unless I’m overlooking some Angular magic somewhere, but I don’t think I am.

But, I have created a template that will edit an item :

$scope.getTemplate = function (todo) {
if ($scope.todos.indexOf(todo) === $scope.todos.indexOf($scope.selected)) return ‘edit’;
else return ‘display’;

So, when I clicked edit button. It will checked if the clicked item index is equal to $scope.selected index

Can u fix my code please ?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.