javascriptjqueryknockout.js

how to replace image on click, Knockout?

I'd appriciate if anyone could help =) i want my image to change when i click on it

.html file:

<a href="#" data-bind="click: $root.markCompleted"><img class = "check" src = 'bee-icon-gray.jpg' width = '25px' height = '23px'/></a>

.js file

    function AppViewModel() {
            var self = this;
            self.tasks = ko.observableArray([]);

      self.markCompleted = function(task) {
                task.status('completed');
                }
}

So i'd like to replace bee-icon-gray.jpg image with bee-icon-colored.jpg when i click on it, also it would be just perfect if i could toggle the images each time i click! i'd be thankful for any help!

Solution

  • Try with below code:

    $('.check').click(function(){
    $(this).attr('src','newimagesrc');
});