Attaching to saving and saved events of a Work Item in a Custom Control

We have been asked lately about whether it is possible to do something before or after save operation of a work item inside a custom control. The answer is, yes, you can do that.

When a change occurs in a work item, there is actually a lot of events fired like field change, revert, saving, saved, etc. All you need to do is subscribing to the work item change event and then applying appropriate filtering on the change type when the work item is bound to the form (bind event of all controls on the form is called when a work item is bound to a form).

Please do not forget unsubscribing during unbind. Also note that these are all read-only notifications which means none of them can be cancelled.

Let's see some code:

bind: function (workItem) {
    this._workItemChangeDelegate = function(sender, args) {
        if (args.change === "saving") {
            // Do something...
        } else if (args.change === "saved") {
            // Do something...
    // Delegate enables the specified function to run under current custom control's context
    // so that you can access other methods inside _workItemChangeDelegate 
    workItem.attachWorkItemChanged(TFS.Core.delegate(this, this._workItemChangeDelegate));

unbind: function (workItem) {
    delete this._workItemChangeDelegate;


And one last comment about "Save & Close". The above events are fired from Object Model but  "Save & Close" happens in UI level which prevents custom controls to attach that event. Because we do not have any API's for UI commands, it is not possible to intervene. Sorry for any inconvenience.

Hope this code piece helps and let us know if you have any questions or feedback.

Comments (5)
  1. kumarSur says:

    Thanks Serkan for ery much useful info.

    I have implemented the sme and was able to get this working.

    Only location I face the problem is during unbind.

    Looks like workItem is undefined in the unbind method and throwing an error when calling detachWorkItemChanged method.

    I tried to skip the same, but the event is registered multiple times and an event is firing multiple times. Please let me know a possible work arround for this.

  2. kumarSur says:

    I observed the above behavior when I try to move from one work item to another, and get back to the old work item. Since the unbind is not working as expected, the event is staying back with the work item. I also observed that the . workitem-changed array is incremented when a new work item is opened. Hence the multiple process of _workItemChangeDelegate. Let me know if you need more information.

  3. irenam says:

    I have the same problem during unbind as described by kumarSur. I was wondering if you were able to find a solution?

  4. beytan says:

    @kumarSur and @irenam


    //// var workItem = this._workItem;

    in the unbind event start and remove function parameter "workItem".


    unbind: function () {

    var workItem = this._workItem;



    delete this._workItemChangeDelegate;


  5. Sankalp says:

    Hi ,

    Could you please suggest the way to add or deploy this javascript code? How can we implement this?

Comments are closed.

Skip to main content