Displaying Documents in a ASP.NET Modal Dialog Box using Google Doc Viewer

Many people have faced a situation where they have to show documents like .PDF,.Doc ,.Docx and other like images too.

For showing Images there are lots JQuery Plugins available which can accomplish these task and are really good.

But how to show real document to the user, in stead of showing them the option to download you can provide facility to your users where they can view documents without leaving your page.

Today i will show a very simple option for doing the same using good doc viewer.

you might be aware of Google Docs feature where you can store your documents and view and edit the same. But have you ever used the same viewer for viewing document that are stored inside your web directory.

Let see how we can achieve the same using ASP.NET AJAX ModalPopup Control Toolkit.

I will not provide you the ASP.NET page code but will only provide code for related Controls
Like Update Panel, Control for Loading Pupup and closing Popup and Code for Loading document for viewing.

I will provide you the CSS that i have used for display ModalPopUp

.modalbackground
{
background-color:Gray;
opacity: 0.5;
filter:Alpha(opacity=50);
}

.modalpopup
{
background-color:White;
padding:6px 6px 6px 6px;
}




Now lets have the Code behind Event for showing the Document.

I have used Iframe for showing the document in ModalPupup but i am loading the document on Request that is the reason you will find any IFrame tag in in Code posted above.

Please find below code for showing document on Show button Client Event

Done.......

Run your page and check whether you are able to load the document in popup or not..
Some points to remember is that you have access rights to the location from where you are loading the page. and do not forget to add attribute  "embed=true" otherwise it will not load in IFrame.

Thank you,