Refreshing Selected Sitecore Item from code

I would like to share my experience with a task where we had a third-party  tool that was run from Sitecore ribbon on a selected tree item. This tool does some processing on the selected item and generates children items underneath it. Our problem was that the content editor could not see the children unless they manually refreshed the item. This was un-intuitive for non-technical content editors.

After some research I found out that I could refresh the selected item with some back-end code that lets Sitecore send a message to the client UI to refresh the item with the specified ID. Plus this could be done through Javascript after importing the required js libraries. I did need the Javascript way at the end, so you can have a look at it here.

But neither worked for me. This third party tool opens a new browser windows that lets the user select some configurations and on the submit button, it calls a web service through Javascript to do the final processing. This meant two things for me:

  • The context in the web service is different from the context in the ribbon command execution. So Sitecore could not send the Client a message. If I were to send this message from the ribbon command directly, it would run nicely.
  • I could not send the message through Javascript because I was in a different browser window. This meant that all the Sitecore js libraries were not loaded and I couldn’t just load the libraries I needed on their own.

Luckily, the source code for this tool was available. What I ended up doing is branch from the tool’s repository and switched to use SheerResponse.ShowModalDialog instead of opening a new browser window when clicking the ribbon button. ShowModalDialog allows to wait for a postback event when the dialog is closed. This meant I could write some code after the dialog gets closed and in the ribbon command’s context, which was awesome.

public override void Execute(CommandContext context)
{
   if (context.Items != null && context.Items.Length == 1)
   {
    string id = context.Items[0].ID.ToString();
    NameValueCollection parameters = new NameValueCollection();
    parameters.Add("id", context.Items[0].ID.ToString());
    Context.ClientPage.Start(this, "Run", parameters);
   }
}

protected void Run(ClientPipelineArgs args)
{
   if (!args.IsPostBack)
   {
    string urlString = "";//URL of the tool's aspx page
    urlString = UrlUtil.CreateUrl(urlString, args.Parameters);
    SheerResponse.ShowModalDialog(urlString, "800", "600", string.Empty, true);
    args.WaitForPostBack();
    return;
   }
   else
   {
    string refresh = string.Format("item:refreshchildren(id={0})", args.Parameters["id"]);
    Sitecore.Context.ClientPage.ClientResponse.Timer(refresh, 2);
   }
}

So when IsPostBack is false, this indicates that this is a ribbon button click. This is where we call ShowModalDialog and we specify to wait for the post back on closing the dialog by using args.WaitForPostBack()

When IsPostBack is true, we know that the dialog has been closed and this is the time to refresh the selected item’s children using the selected item ID which was passed from the command’s Execute method.

To refresh the selected item’s children the following is used:

    string refresh = string.Format("item:refreshchildren(id={0})", args.Parameters["id"]);
    Sitecore.Context.ClientPage.ClientResponse.Timer(refresh, 2);

One point to note is that in order to close the Modal dialog from Javascript, we needed to call the following:

window.parent.$('.ui-dialog-content:visible').dialog('close');
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s