Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Call Function on View Loaded (Activate) in Hot Towel/Durandal Single Page App

I'm using the Hot Towel SPA project I'm trying to call a simple js function when a view is activated. What I'm seeing is that the item does not seem to be loaded when the activate function is called.

I've also tried putting the code in an initialize function called by activate as suggested on other SO posts. This does not seem to help.

So what is the recommended method in Durandal/HotTowel for calling a function on view load?

home.js (view model)

define(['services/logger'], function (logger) {
    var vm = {
        activate: activate,
        title: 'Home'
    };

    return vm;

    function activate() {       
        logger.log('Home View Activated', null, 'home', true);
        return init();
    }

    function init() {
        $("#backBtn").hide();
        console.log($("#myBtn").html()); // returns undefined 
    }
});

home.html (view)

<section>  
  <div id="myBtn">test</div>
</section>
like image 235
Ben Ripley Avatar asked May 08 '13 15:05

Ben Ripley


1 Answers

According to the latest Durandal docs at Interacting with the DOM, viewAttached renamed to attached, so you code using Durandal 2 will be the following:

define(['services/logger'], function (logger) {
var vm = {
    activate: activate,
    attached: attached
    title: 'Home'
};

return vm;

function activate() {       
    logger.log('Home View Activated', null, 'home', true);
}

function attached(view, parent) {
    $(view).find("#backBtn").hide();
    console.log($(view).find("#myBtn").html()); 
}
});
like image 92
Yevgen Safronov Avatar answered Sep 21 '22 01:09

Yevgen Safronov