Databases
StackOverflow2013
Postsdbo
POProgrammatically closing a Durandal modal
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POProgrammatically closing a Durandal modal
    primarykey
    data
    text
    <p>I'm new to Durandal, so I might be taking the wrong approach to my problem.</p> <p>I want to show a modal popup with a message of 'logging in...please wait' when the user has clicked the login button. I want to close the modal popup once the response is received. My attempted approach is to call a custom modal popup using Durandal's app.showModal and a view with no buttons, from the login view model. This shows the modal popup I'm after, but I haven't been able to figure out how to close the popup once the server response is received. All the examples I've seen have a button on the modal popup view that closes the popup.</p> <p>Is this possible? If not, is there a better approach that will show the user something is happening and also stop the user from trying to use any other button on the view?</p> <p>Here's the view model code for the login view (with extraneous code removed):</p> <pre><code>define(['services/appsecurity', 'durandal/plugins/router', 'services/utils', 'services/errorhandler', 'durandal/app', 'viewmodels/controls/activityindicator'], function (appsecurity, router, utils, errorhandler, app, activityIndicator) { var username = ko.observable().extend({ required: true }), password = ko.observable().extend({ required: true, minLength: 6 }), rememberMe = ko.observable(), returnUrl = ko.observable(), isRedirect = ko.observable(false), var viewmodel = { username: username, password: password, rememberMe: rememberMe, returnUrl: returnUrl, isRedirect: isRedirect, appsecurity: appsecurity, login: function() { var credential = new appsecurity.credential(this.username(), this.password(), this.rememberMe() || false), self = this; activityIndicator.message = 'Logging in...please wait'; app.showModal(activityIndicator); appsecurity.login(credential, self.returnUrl()) .fail(self.handlevalidationerrors) .always(function() { activityIndicator.close(); }); }}; return viewmodel; }); </code></pre> <p>The <code>appsecurity.login</code> function is the ajax post call. The view model for the custom modal is:</p> <pre><code>define(function () { var activityIndicator = function (message, title, options) { this.message = message; this.title = title || activityIndicator.defaultTitle; this.options = options || activityIndicator.defaultOptions; this.close = function() { this.modal.close(); }; }; return activityIndicator; }); </code></pre> <p>When running this, I get an error on <code>.always(function() { activityIndicator.close(); });</code> of <code>close</code> is undefined.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCraig
    1. USCraig
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POProgrammatically closing a Durandal modal
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThis is very easy to do, if you could post your code we could guide you on where to put the statement but you are looking for this - this.modal.close() - if you are calling it within a function on success of login or within an AJAX call you may need to provide the proper scope by using something like self = this; instead of just this. See this question http://stackoverflow.com/questions/16322159/durandal-modal-wont-close
      singulars
      1. POProgrammatically closing a Durandal modal
      1. USPW Kad
    2. COWhat version of Durandal are you using?
      singulars
      1. POProgrammatically closing a Durandal modal
      1. USTyrsius
    3. COAdded the code, as requested. Thanks.
      singulars
      1. POProgrammatically closing a Durandal modal
      1. USCraig
 

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