How call a function when view is attached in Durandal?

Question

I'm just started to develeop a web app with Durandal. I don't understand how call a function from a viewmodel and why if I find an element of my document it seems is not attached yet.

Example: viewmodel.js

    define( ['libone', 'libtwo'], function () {


      $('.carousel').libone({
          expandbuttons: true,
          keyboard: true,
          mouse: true
      });

    });

It doesn't find the ID call carousel is why there's no view.hmtl content but index.html content.

Any ideas? Thanks in advance

UPDATE No errors but the view content is not returned. view.html

<section> 
  <h2 data-bind="html:name"></h2> 
  <blockquote data-bind="html:descr"></blockquote> 
    <div class="carousel"> 
      <div class="carousel-sections"> 
        <div class="carousel-section"> ... some content ... </div> 
      </div> 
    </div> 
  <a id="carousel-scroll-prev" href="#"></a> 
  <a id="carousel-scroll-next" href="#"></a> 
<section>

modelview.js

define( ['libone', 'libtwo'], function (libone, libtwo) {
  var viewattached = function(view){
    var view = $(view);
    view.find('.carousel').libone({
      expandbuttons: true,
      keyboard: true,
      mouse: true
    });
  };

  var vm = {
    attached: viewattached,
    name: 'How about we start?',
    descr: 'You have many choices to make and many roads to cross...'
  };

  return vm;
});

Only name, descr and scroll are shown but not carousel-section.

Excommunicated · Answer 1 · 2013-10-29T19:19:41.597

0

to gain access to the controls using jquery like you are requesting, you should use the views attached event e.g.

define( ['libone', 'libtwo'], function (libone, libtwo) {
    var viewattached = function(view){
      var view = $(view);
      view.find('.carousel').libone({
          expandbuttons: true,
          keyboard: true,
          mouse: true
      });
    };

    var vm = {
        attached: viewattached
    };

    return vm;
});

The other one that may work will be the compsitionComplete..

edited Oct 29 '13 at 19:19

answered Oct 28 '13 at 18:03

Excommunicated

1,252
8
14

I've already tried but it returns this error: Uncaught TypeError: Object # has no method 'find' – user2312187 Oct 28 '13 at 18:16
can you elaborate? your view is not being rendered? – Excommunicated Oct 28 '13 at 20:54
Edited question with UPDATE section. Thanks – user2312187 Oct 29 '13 at 08:57
What's wrong with that, why if I call libone function content view not rendered? Can you help me? – user2312187 Oct 29 '13 at 13:52
is libone another module you have registered? is it a 3rd party library like jquery or knockout? – Excommunicated Oct 29 '13 at 15:42

score 0 · Accepted Answer · answered Oct 29 '13 at 15:30

0

The rendering problem has been resolved using compositionComplete instead attached.

answered Oct 29 '13 at 15:30

user2312187

60
1
13

score 0 · Answer 3 · answered Aug 05 '14 at 12:41

0

compositionComplete works fine.But if you refresh the page ,composition complete skips the binding of element with the carousel and teh carousel doesnt work. Any

answered Aug 05 '14 at 12:41

darkHorse

13
8

How call a function when view is attached in Durandal?

3 Answers3