1

I have the following:

    app.showMessage('template', book.title(), [save, cancel]).then(function(result) {
        if (result == save) {
            alert('saved');
        } else if (result == cancel) {
            alert('canceled');
        }
    });

This is working great, but I'd like to replace 'template' with the path of a view that will get bound to the current viewmodel (a form for add/edit object). Is there any mechanism in place to achieve this?

I've done this:

  dialog.MessageBox.setViewUrl('/App/views/templates/editBook.html');

Which works, but all of the chrome and dialog goodness is lost - it replaces the entire dialog template, not just the inner template.

EDIT:

I now have a dedicated view/viewmodel pair and I'm using this:

    vm.editBook = function (book) {
        dialog.show('viewmodels/editBook', book);
    };

With my editBook.js:

  define(function () {
    var vm = {};

    vm.book= ko.observable();

    vm.cancel = function () {
        alert('should cancel');
    };

    vm.save = function() {
    };

    vm.activate = function(book) {
        vm.book(book);
    };

    return vm;

});

my view:

<div data-view="plugins/messageBox" class="messageBox" data-bind="with: book">,
    <div class="modal-header">
        <h3 data-bind="text: title"></h3>
    </div>
    <div class="modal-body">
        <p class="message" data-bind="text: title"></p>
    </div>
    <div class="modal-footer">

        <button data-bind="click: $parent.cancel">cancel</button>

        <div style="clear:both;"></div>
    </div>
</div>

But then how do I close the dialog from the view? I tried passing the dialog object to the vm to call dialog.close but this doesn't seem to work.

Update again: By requiring the dialog plugin and calling dialog.close(vm), durandal knows how to select and close the right dialog:

vm.cancel = function () {
    //alert('should cancel');
    dialog.close(vm);
};

So I think I'm all set... but any confirmation would be cool from the pros out there.

RobVious
  • 12,685
  • 25
  • 99
  • 181
  • Look at `dialog.show(viewModel, ..)`, ref. [dialog.js](https://github.com/BlueSpire/Durandal/blob/master/src/plugins/js/dialog.js) – user2864740 Jun 11 '14 at 23:06
  • Thanks @user2864740, I've seen that. Doesn't seem to handle the case where I want to keep the chrome and provide a custom inner html template though. – RobVious Jun 11 '14 at 23:28
  • @user2864740 - just pushed it a bit further with that function. Any idea how I can close the dialog from within a child viewmodel? Code updated. – RobVious Jun 12 '14 at 00:11
  • 1
    You require "durandal/dialog" in you script for your custom dialog, then you use "dialog.close()" from within your model to close the modal dialog. You can also pass "activationData" to your viewmodel using `app.showDialog('path/to/view', { name: 'something' })` and the get the object in the activate function in the viewmodel. – aup Jun 16 '14 at 06:35

0 Answers0