Proper use of kendoWindow

[Steven]

Does anyone have some samples of how kendoWindow is supposed to be used/configured to display an ajax loaded content dialog box with inputs they need to be passed to the controlling code? For example, I am trying to bring up a dialog which accepts the username and password for an application. The calling module is actually a class, so visibility from within the content is not available from the content page. If the window is destroyed after the close is clicked, then the parent object can no longer see the content tags. What is the "right" way to do this.

[Dan]

var ticketEdit = {};

 

ticketEdit.openWin = function (o) {

    /// <summary>

    ///Opens window to edit/create ticket.

    /// </summary>

    /// <param name="o" type="Dictionary">

    /// custId, ticketId, callback

    /// </param>

 

    var custId = o.custId;

    var ticketId = o.ticketId;

    var callback = o.callback;

 

    //create dialog container

    var d = $("<div id='ticketEditWin'></div>")

        .appendTo('body');

 

    var win = d.kendoWindow({

        modal: true,

        title: "Edit Ticket",

        animation:false,

        visible: false,

        deactivate: function (e) { this.destroy(); }

    }).data("kendoWindow");

 

    //subscribe to event to trigger callback function.

    d.bind("ticketUpdated", { custId: o.custId }, o.callback);

 

    //init and open dialog

    $.post("/mycontroller/myaction",

        { custId: o.custId, ticketId: ticketId })

        .success(function (content) {

            d.html(content);

            win.center();

            win.open();

        });

};

 

//Close ticket edit modal window and call callback

ticketEdit.onTicketEditSuccess = function (response, status, data) {

        //response is a json object

    if (response.success != true)

        return;

 

    //close modal window

    var win = $('#ticketEditWin');

    win.trigger("ticketUpdated", { success: true, ticketId: response.ticketId });

    win.data("kendoWindow").close();

};

That's what I do.  Basically, I create a wrapper to open the window and load a view into it.  I send the wrapper a callback function to make it reusable throughout my application.  In this case, when the form is submitted, ticketEdit.onTicketEditSuccess is called, and the new ticketId is sent back to the callback function.  If you wanted, you could send more data back than just an id.  I just send the id, and my callback function does whatever it needs to do, like load a new partial view based on that ticketId.

I store the callback function as an event in the jquery object for the div.  I don't know if this is best practice or not.  You could store it as a variable anywhere else.  The point is, you call it and send data through it when you close the window.

[Steven]

Dan,

Thank you so much for your reply!    It really helped me to work my way around the issue.  

I am currently using moo4q so I had to re-structure it a little, but it got me started in the right direction.

Thanks again.