Databases
StackOverflow2013
Postsdbo
POHow to control order of view activation in Durandal
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to control order of view activation in Durandal
    primarykey
    data
    text
    <p>I am building an application with Durandal 2.0.<br> My shell view looks like this:</p> <pre class="lang-html prettyprint-override"><code>&lt;div&gt; &lt;header id="nav" data-bind="compose: 'viewmodels/nav', activate: false"&gt; &lt;/header&gt; &lt;section id="content" class="main container-fluid" data-bind="router: { transition: 'entrance' }, activate: false" style="overflow: auto"&gt; &lt;/section&gt; &lt;footer&gt; &lt;!--ko compose: {view: 'footer'} --&gt;&lt;!--/ko--&gt; &lt;/footer&gt; &lt;/div&gt; </code></pre> <p>In the nav section, I want to have my tabs and a drop-down list of users (both of which are retrieved from a web service). Selecting a user from the dropdown will navigate to a new URL which will update the content section. <em>(the route looks something like localhost/#user1/tab2).</em> </p> <ul> <li><strong>Problem:</strong> I need to know the selected user from the nav section before I can retrieve the data for the content section, but the content section is activating before I have retrieved the users. </li> </ul> <p>This is really only an issue for the initial page load, since the user list is only retrieved once. </p> <ul> <li>Is there a way to tell the content section to wait until the nav section is done loading? </li> <li>Is there a better way to go about this than what I'm doing?</li> </ul> <p>The nav activate function looks like this:</p> <pre class="lang-html prettyprint-override"><code>function activate(context) { return dataservice.getUsers().then(function () { //do stuff }); }); </code></pre> <p>This activate function gets called first, and dataservice.getUsers() is called, but then the activate function of the content module gets called before the "do stuff" part happens (and before the data from the getUsers call is returned in the dataservice). Maybe there's a problem with my promises?</p> <p><strong>Edit</strong><br> I've put together a dFiddle with some actual code that shows what I'm talking about: <a href="http://jerrade.github.io/dFiddle-2.0/#test/dashboard" rel="nofollow">http://jerrade.github.io/dFiddle-2.0/#test/dashboard</a><br> The code is here: <a href="https://github.com/jerrade/dFiddle-2.0" rel="nofollow">https://github.com/jerrade/dFiddle-2.0</a> </p> <p>nav.js </p> <pre class="lang-html prettyprint-override"><code> function activate(context) { console.log('Nav View Activated'); if (vm.impersonateUsername == undefined) vm.impersonateUsername = getUsernameFromWindowLocation(); return dataservice.getPageDetailForEmployee(vm.loggedInUsername, vm).then(function () { console.log("Page details retrieved"); // I want to do something here before the dashboard activates. }); } </code></pre> <p>dashboard.js </p> <pre class="lang-html prettyprint-override"><code> function activate(username) { console.log('Dashboard View Activated'); //vm.username = nav.selectedImpersonateEmployee().Username; return dataservice.getDashboard(nav.impersonateUsername, dashboard); } </code></pre> <p>Open the page and watch the console. You'll see (among other things)</p> <pre class="lang-html prettyprint-override"><code>Nav View Activated Dashboard View Activated Page details retrieved </code></pre> <p>What I really want is for the Page details to be retrieved before the Dashboard view activates. I've actually rejiggered things so that this isn't currently a problem anymore, but it may crop again down the road.</p> <p>It doesn't seem like what I'm trying to do should be this complicated. Unless I'm pounding a square peg into a round hole here?</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USJerrad
    1. USJerrad
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow to control order of view activation in Durandal
      1. This table or related slice is empty.
      1. VTApproveEditSuggestion
    1. CONo, I think your promises are fine... the `activate` method of nav has nothing to do with the `activate` method of the content module. See my updated answer below for a suggestion of how you can make them "relate" to each other!
      singulars
      1. POHow to control order of view activation in Durandal
      1. USgerrod
    2. COI've submitted a pull request to your fork. The problem now is that you're returning the deferred from the ajax request as your activate method, which resolves as soon as the ajax request returns (rather than once your processing has finished). I couldn't test the code since I couldn't hit your API but I'm pretty sure it should work now.
      singulars
      1. POHow to control order of view activation in Durandal
      1. USgerrod
    3. COI changed the code to return the deferred, but it's still doing the same thing. Once the code executes dataservice.getPageDetailForEmployee, it switches over to the dashboard activate. I've mocked my api calls, so you should be able to run it on your machine if you want.
      singulars
      1. POHow to control order of view activation in Durandal
      1. USJerrad
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload