Click here to Skip to main content
15,393,377 members
Articles / Productivity Apps and Services / Microsoft Office
Article
Posted 29 Jan 2012

Tagged as

Stats

42.9K views
2K downloads
19 bookmarked

Word and Excel Documents View in IFrame using TreeView control

Rate me:
Please Sign up or sign in to vote.
5.00/5 (5 votes)
29 Jan 2012CPOL6 min read
Office Documents View using TreeView

Introduction

When I was guiding my team for a specific project for one of my clients, I foresaw that part of my project was leading towards document management system. The client wants the documents to be viewed, it includes pdf/word/txt/scanned image of many formats, etc. But for all means, they faced the problem of opening individual applications and also the licensing cost. Also, it is cumbersome to open and maintain. They requested one solution, which led me to create a tree view approach and document view. When I was initiating this, I was Googling any idea, and most of the time, people drove me towards different directions. But still my problem was not resolved. Even in many forums, people were crying to get a solution for the same.

Once I created this, I want to share with all of you and I hope that it will help you a lot.

Here we are going to achieve two things in this article:

  1. Display the files of a specific folder in the TreeView
  2. Display the content of the files in the same aspx page right pane using iframe

Components we are going to use are Interops of Word and Excel.

First from Visual Studio, create a new web application solution.

image001.jpg

Right click the solution and add a new project, select Project Type as Class Library.

image002.jpg image003.jpg

Name the Class Library Project as “LibraryConvertor”. Now rename the Class1.cs to “WordXLS”. In the add reference of the Class Library, add the following interops, Interop.Word.dll and Interop.Excel.dll.

image004.jpg

Let us create the data members in this class library WordXLS.cs as follows:

C#
#region Data Members
public string Message = string.Empty;          // To store the Error or Message
private Word.ApplicationClass OfficeWord;       // The Interop Object for Word
private Excel.ApplicationClass OfficeExcel;     // The Interop Object for Excel
object Unknown = Type.Missing;                  // For passing Empty values
public enum StatusType { SUCCESS, FAILED };     // To Specify Success or Failure Types
public StatusType Status;                       // To know the Current Status
#endregion

In the default constructor, the Status and Message we shall initialize are as follows:

C#
public WordExcelToHTML()
{
Status = StatusType.FAILED;
      Message = string.Empty;
}

We shall create a method which converts the Word Document to HTML and the signature as follows:

C#
public void WordToHTML(object Source, object Target)

Here Source and Target are the filenames. As the Word Active Document always accepts object, here we are also accepting as objects. When we open the document, the application window shouldn’t open explicitly. To suppress, the following code helps us:

C#
// To suppress window display the following code will help
OfficeWord.Visible = false;
OfficeWord.Application.Visible = false;                         
OfficeWord.WindowState = Word.WdWindowState.wdWindowStateMinimize;

For opening the specific document, the Open method of the ApplicationClass object is used as follows:

C#
OfficeWord.Documents.Open(ref Source, ref Unknown,
                     ref Unknown, ref Unknown, ref Unknown,
                     ref Unknown, ref Unknown, ref Unknown,
                     ref Unknown, ref Unknown, ref Unknown,
                     ref Unknown, ref Unknown, ref Unknown, ref Unknown); 

Note, here we are passing only the Source and remaining arguments as empty. Following are the arguments and its purpose of the Open method.

SlNo Argument Type
1 FileName
2 ConfirmConversions
3 ReadOnly
4 AddToRecentFiles
5 PasswordDocument
6 PasswordTemplate
7 Revert
8 WritePasswordDocument
9 WritePasswordTemplate
10 Format
11 Encoding
12 Visible
13 OpenAndRepair
14 DocumentDirection
15 NoEncodingDialog
C#
object format = Word.WdSaveFormat.wdFormatHTML;

Here we are specifying to convert to HTML format. The List of formats to which can be converted are as follows:

SlNo Argument Type
1 wdFormatDocument
2 wdFormatDOSText
3 wdFormatDOSTextLineBreaks
4 wdFormatEncodedText
5 wdFormatFilteredHTML
6 wdFormatHTML
7 wdFormatRTF
8 wdFormatTemplate
9 wdFormatText
10 wdFormatTextLineBreaks
11 wdFormatUnicodeText
12 wdFormatWebArchive

You can explore the above two tables respectively. Here anyway we try to convert to HTML.

Open and FormatHTML should be inside the try...catch block. Thus any exceptions can be caught respectively.

Now it is time for us to save as HTML using the Target file name as follows.

C#
OfficeWord.ActiveDocument.SaveAs(ref Target, ref format,
                        ref Unknown, ref Unknown, ref Unknown,
                        ref Unknown, ref Unknown, ref Unknown,
                        ref Unknown, ref Unknown, ref Unknown,
                        ref Unknown, ref Unknown, ref Unknown,
                        ref Unknown, ref Unknown);

Status = StatusType.SUCCESS;
Message = Status.ToString();

Following are the different arguments for you to explore further:

SlNo Argument Type
1 FileName
2 FileFormat
3 LockComments
4 Password
5 AddToRecentFiles
6 WritePassword
7 ReadOnlyRecommended
8 EmbedTrueTypeFonts
9 SaveNativePictureFormat
10 SaveFormsData
11 SaveAsAOCELetter
12 Encoding
13 InsertLineBreaks
14 AllowSubstitutions
15 LineEnd<code>ing

In the finally block, let us dispose the objects we have instantiated.

C#
finally
{
if (OfficeWord != null)
{    
OfficeWord.Documents.Close(ref Unknown, ref Unknown, ref Unknown);
OfficeWord.Quit(ref Unknown, ref Unknown, ref Unknown);
}
}

For Excel Operations, the following method needs to be created:

C#
public void ExcelToHTML(string Source, string Target)

In this, we shall take Source and Target as it is as string because the Excel class accepts as String only.

Similarly for Open and SaveAs, let us follow as it is in Word, but note, the parameters have differences. I leave it for you to explore further. You will enjoy more when you do this for different formats.

Please refer to the code in the attached sample.

Now the Class Library is completed. We have to create a web form for this library to consume.

Add our “LibraryConvertor” assembly to the reference of our web application.

First delete your Default.aspx and create a new form and name it as “LandingPage.aspx”.

The Markup should look like the following:

image005.gif

In our aspx file, we have to do the following.

Add the scriptManager:

ASP.NET
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

Add a table with two columns, left for TreeView and Right for iframe.

The code should look like the following:

image006.jpg

In the DesignMode, select the TreeView and two Events properties, double click the selected Node changed event “DocView_TreeView_SelectedNodeChanged” and move to the code behind.

In our Code Behind, include the Library’s namespace as follows:

C#
using LibraryConvertor; 

and instantiate the WordXLS class.

Add the following two keys in the appsettings of the web.config:

XML
<add key="ConvertLocation" value="D:\ TreeView_DocView\target\"/>
<add key="ErrorFile" value="D:\ TreeView_DocView\target\ErrorPage.jpg"/>

Correspondingly, create a folder called target in our application folder. Also add an Error Jpeg also in the same directory.

Include this namespace:

C#
using System.IO;

Create a method as follows in order to retrieve the files from the specific folder which are to be provided to the tree view:

C#
TreeNode OutputDirectory(System.IO.DirectoryInfo directory, TreeNode parentNode)
{
if (directory == null) return null;
      TreeNode DirNode = new TreeNode(directory.Name);
      System.IO.FileInfo[] Files = directory.GetFiles();
      for (int FileCount = 0; FileCount < Files.Length; FileCount++)
          DirNode.ChildNodes.Add(new TreeNode(Files[FileCount].Name));

if (parentNode == null)
          return DirNode;
else
      {
          parentNode.ChildNodes.Add(DirNode);
            return parentNode;
}
}

Also create one more method which actually does Tree Clear functionality and calls the OutputDirectory method actually.

C#
private void BindTree()
{
DocViewTreeView.Nodes.Clear();
DirectoryInfo RootDir = new DirectoryInfo(Server.MapPath("~/target"));
TreeNode RootNode = OutputDirectory(RootDir, null);
DocViewTreeView.Nodes.Add(RootNode);
DocViewTreeView.ExpandAll();
}

From the Page Load Event, as follows:

C#
if (!IsPostBack)
{
lblText.Text = "FileName :Error.jpg";
BindTree();
}
image007.gif

In order to display the ErrorPage.jpg, we have to write the following code in the “DocView_TreeView_SelectedNodeChanged” event.

C#
WordXLS conv = new WordXLS();            
lblText.Text = "FileName :" + DocViewTreeView.SelectedNode.Text;
string strFilePath = ConfigurationManager.AppSettings
    ["ConvertLocation"].ToString().Trim();
string strFile = DocViewTreeView.SelectedNode.Text.ToString();
string strExtension = DocViewTreeView.SelectedNode.Text.ToString().Split
        ('.')[1].ToString().Trim().ToUpper();
string strUrl = "http://" + Request.Url.Authority + "/target/";

if (strExtension == "DOCX" || strExtension == "DOC")
{
conv.WordToHTML(strFilePath + strFile, strFilePath + strFile.Split('.')[0] + ".html");
      if (conv.Status == WordXLS.StatusType.SUCCESS)
          docPreview.Attributes["src"] = strUrl + strFile.Split('.')[0] + ".html";
}
else if (strExtension == "XLS" || strExtension == "XLSX")
{
conv.ExcelToHTML(strFilePath + strFile, strFilePath + strFile.Split('.')[0] + ".html");
      if (conv.Status == WordXLS.StatusType.SUCCESS)
          docPreview.Attributes["src"] = strUrl + strFile.Split('.')[0] + ".html";
}
else
docPreview.Attributes["src"] = strUrl + DocViewTreeView.SelectedNode.Text;

The “DocViewTreeView.SelectedNode.Text;” will provide the selected file and the extension of the file must be checked first. Based on the extension, we can call the appropriate “WordToHTML” or ExcelToHTML” and fetch the output file, which can then be associated to the “src” of the docPreview’s attribute.

Now when we execute, the output should be like the following:

image008.gif

Add a pdf file, a .doc file, .docx, .xls, .xlsx, .txt in the target folder and see, what happens.

For example, find the following excel in the target folder.

image009.jpg

Now the output in the browser should look like the following:

image010.jpg

Note, the client system need not to have Microsoft Office installed, but they can view all Word and XLS documents in this fashion.

If it is PDF, the client system must have Adobe reader. But definitely now you can do work around for the same.

If it is a text file or any image file, it will display in the iframe itself.

Points of Interest

Also if it is Excel, one amazing functionality is the sheets will be displayed as a separate toolbar below. By clicking the specific sheet, we can view respective sheets.

Try to delete the HTML file and the _files folder of the respective word/excel file before creation. Otherwise, we get, overwrite yes/no issue.

Don’t forget to explore through all different formats of conversions.

Observations

  1. C#
    strUrl = "http://" + Request.Url.Authority + "/target/"; 
  2. C#
    strExtension == "XLS" || strExtension == "XLSX" 
  3. C#
    strFile.Split('.')[0] + ".html" 

I have made it intentionally. Kindly change according to your need. I have used for easy coding in order to make you to understand the exact meaning of what I want to communicate.

History

I will work on improving this application more to make it as a separate document management system as a component.

Author

image011.jpgA. Rishi Ganesh, Project Manager, India

If you have any comments or suggestions, please reach me at rishwins@hotmail.com.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

rish_wins
Web Developer
India India
No Biography provided

Comments and Discussions

 
QuestionDynamic view of the excel Pin
Member 108894608-Mar-17 19:04
MemberMember 108894608-Mar-17 19:04 
QuestionConversion Failure after publishing the application Pin
V!jAy pAnT6-Feb-13 2:38
MemberV!jAy pAnT6-Feb-13 2:38 
GeneralMy vote of 5 Pin
V!jAy pAnT6-Feb-13 2:28
MemberV!jAy pAnT6-Feb-13 2:28 
QuestionYour code is very good, but... Pin
Member 864493321-Jan-13 20:37
MemberMember 864493321-Jan-13 20:37 
QuestionYour code is greate Pin
Member 92025675-Jul-12 0:53
MemberMember 92025675-Jul-12 0:53 
QuestionDoc and Excel files are not opening up Pin
er.vandanajindal4-Jul-12 20:42
Memberer.vandanajindal4-Jul-12 20:42 
QuestionNot working with TestXLSX.xlsx and neither with docx Pin
Member 314438511-May-12 23:42
MemberMember 314438511-May-12 23:42 
AnswerRe: Not working with TestXLSX.xlsx and neither with docx Pin
rish_wins22-Jun-12 1:55
Memberrish_wins22-Jun-12 1:55 
Questionwhy my browser cannot display doc or xls file Pin
Marhani9-Apr-12 23:10
MemberMarhani9-Apr-12 23:10 
AnswerRe: why my browser cannot display doc or xls file Pin
rish_wins4-May-12 0:23
Memberrish_wins4-May-12 0:23 
GeneralRe: why my browser cannot display doc or xls file Pin
V!jAy pAnT6-Feb-13 2:31
MemberV!jAy pAnT6-Feb-13 2:31 
GeneralMy vote of 5 Pin
Manoj Kumar Choubey2-Mar-12 22:48
professionalManoj Kumar Choubey2-Mar-12 22:48 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.