SharePoint Document iframe on the form

Hi,

I am trying to set up this implementation on a custom entity form following this article:

https://meghshyam.wordpress.com/2015/08/21/displaying-an-sharepoint-document-library-in-iframe-in-crm-2015/

I was able to set it up successfully but not quite what I wanted. I've setup to show the document upload control like the below screenshot.

But instead, I am seeing this associated view of SharePoint Document like below:

This is the url I am using in the javascript web resource for setting iframe url.

https://XXXX/userdefined/areas.aspx?oId=FC02FEE6-AA17-E611-80ED-0050569C2FEF&oType=10027&pagemode=iframe&security=852023&tabSet=new_new_document_sharepointdocument&rof=false&inlineEdit=1

The other thing was, I did not see any relationship between my custom document entity and SharePoint Document entity after integrated SharePoint with CRM.. which I guess creates one automatically. So I created a 1:N relationship between my custom Document entity and SharePoint Document entity manually.

What am I doing wrong and why am I not seeing the iframe to upload documents like the first screenshot?

Please guide me through this. Thanks for any help.