Open a div in SharePoint modal dialog

Sometimes we need to load a div in modal popup instead of a page. Following is an example code that we can use in such scenarios.

In this scenario I use a modal popup to load file upload control in the same page.

1. function Opendialog(ctType) {
2.   SP.SOD.executeOrDelayUntilScriptLoaded(function () {
3.     var element = document.createElement('div');
4.     element.innerHTML = '<input type="file" id="documentUpload" accept="*" /><input id="btnUpload" type="button" value="Upload" onclick="UploadFile(\'' + ctType + '\')"; />';
5.  
6.     SP.UI.ModalDialog.showModalDialog({
7.      html: element,
8.      title: 'Document Upload',
9.      allowMaximize: false,
10.      showClose: true,
11.      dialogReturnValueCallback : Function.createDelegate(null, CloseCallback),
12.      autoSize: true
13.     });
14.    }, "SP.js");
15. }
16.  
17. function CloseCallback(result, target) {
18.    location.reload(true);
19. }