Sharepoint dialog open event

Question

I have an initiation form for my workflow. The form uses a people/user picker. This picker opens a dialog, in that dialog the div in which list of people appears comes with a small height in Internet Explorer 10.

I want to change that using css. As it uses systems master page, I can't directly add css to it. I want to change css using script for which I want to use event like dialog open so that after the dialog opens I can change the css of it.

Is there any way to capture open event of dialog?

Answer 1

You could perhaps do something like the following in JS.

Override the default implementation of showModalDialog in JS. Create a tmp-pointer to the old method. Override the showModalDialog to your own method, with your own code/event capturing the showModalDialog.

Something like this for a normal modal dialog:

var oldMethod = SP.UI.ModalDialog.showModalDialog;

SP.UI.ModalDialog.showModalDialog = function (options) {
    var defd;
    try {
       defd = typeof ();
    } catch (e) {
        defd = "undefined"
    }
    EnsureScript("SP.UI.Dialog.js", defd, function () {   oldMethod(options);
      // Custom code - Fetch the div tag using jquery and with a specific id=MyDiv
      $("#MyDiv").css({ height: "20px"});

 });
};

Not sure if the picker uses the same method. If it doesn't, I'd try to debug to find the correct method to overload in a similar way.