Tag Archives: save and close

USD: How to handle Save & Close without getting a confirmation dialog

In our implementation of the Unified Service Desk, we show each entity in its own separate hosted control and thus, a separate tab. Everything worked perfectly, except that every time we pressed Save & Close, we would get a dialog asking for confirmation before closing the tab. Very annoying, and something that needed to be fixed. After a lot of investigation and considering different approaches, what I will show here is how we finally dealt with the issue.

For our solution we’re taking care of saving the entity through code, and handling the tab close through the USD, which is equivalent to clicking on the tab’s “X”.

JavaScript code used for managing tab closure

The code to handle this should be located in a common JavaScript repository, so that it’s available to all entities. This is all the code needed, so there’s no need to create any new code every time you want to add the functionality to a new service request.

// Execute Save & Close from custom ribbon button, for USD compatibility.
function USDSaveAndClose (context) {
    // Remove and add event to save.
    // Save the current entity.

This first function removes and attaches a function to the OnSave CRM event. Removing and attaching it makes sure that it’s only there once, and avoids repeated execution. There might be a more elegant way to achieve this, but this works and has no performance impact. Note that the function being attached is the next one we’ll take a look at.

The last thing this function does is to save the entity. Note that we’re doing a regular save, and not using the saveandclose parameter.

function FireUSDSaveAndCloseEvent () {

The second function, which is the one fires at the end of the save process, fires a USD Hosted Control event. This is a cool way of pushing events via code into the USD, and works as long as you have an event defined for the current active Hosted Control.

Notice that the event we’re firing, SaveAndClose, is not a standard event. We’ll be creating this event later.

Creating the new command bar button and command

To create the new command bar button, we used the fantastic Ribbon Workbench. If you don’t have it, get it now! Click here to download it from the awesome people at Develop 1.

Create a solution that includes the entities you will be modifying, and don’t forget to include the web resource that contains the code shown above. Now, run the Ribbon Workbench, load your solution, and select the entity your wish to modify. Select the Command Bar at the top right click in the Commands tree node to add a new command.


Now give the command a significant name, something like “publisher.entity.function.Command” works nicely:


Click the lookup button in actions, and add a new JavaScript function. It will have two parameters: the function name (must match the name of the first function shown above), and the web resource it comes from, for which you’ll get a lookup. The end result would be something like this:


Now it’s time to create our own Save & Close button! From the Toolbar area, drag a button to the spot where you want it. We placed ours between the default Save and Save & Close buttons. You’ll need to copy a couple of lines from the existing Save & Close button. I’ve enclosed screenshots comparing between the default button and my new one.

Default button

Default button

New Save & Close button

New Save & Close button

As shown here, I copied the image source paths, and the labels (mostly). In our case, we also need to add the Command that will be run, and it will be selected from the dropdown in the Behaviour section. In this screenshot, it shows in the CommandCore are too because I’ve already saved this record.

Now, hide the old Save & Close button by right-clicking on it and selecting the option from the context menu. Your command bar should look like this:


After you’re done, click the Publish button to make the changes effective.

Adding the custom event and action call

Go to CRM and create a new event for your hosted control, and name it SaveAndCloseThis is the custom event we’ll be firing, and will take care of closing our tab after saving, avoiding any confirmation dialogs from the IE process.


Create a new Action Call for this event, and name it however fits your standards. Reference the standard UII Action Close, which will close the current active tab for this hosted control. It should look like this:


Remember to add these two to the appropriate configurations! That’s all we need! Fire up the USD and test it out. Let me know if you have any questions.

Have fun!

Tagged , , , ,