.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Articles >> SharePoint >> Post New Resource Bookmark and Share   

 Subscribe to Articles

Page Viewer web part to show List folder contents in SharePoint

Posted By:Jean Paul       Posted Date: September 29, 2014    Points: 200    Category: SharePoint    URL: http://www.dotnetspark.com  

In this article, I will show the usage of Page Viewer web part to show List folder contents.
 

In this article, I will show the usage of Page Viewer web part to show List folder contents.

Following is our List with 3 folders.

image

You need to configure a Page which only shows the contents of Human Resources.  How to achieve it?

Solution

We can use Page Viewer web part.

Create a new page.

image

Choose Edit Page & Insert Page Viewer web part.

image

Construct the folder path in file-url format.

file://hp/davWWWroot/Shared Documents/Human Resources

Please note that the above url contains davWWWroot for accessing the folder contents & omitted the Lists from the url.

davWWWRoot is a special keyword that alerts the WebDAV client that you are referring to the root of a WebDAV server.

From the web part properties, choose Folder  & Paste the URL.c

image 

Click the Ok button & You should be ready with the Folder View.

image

Please note that we can connect to any SharePoint or Network folder in this way.

Next Challenge

Now your users will start asking for the Add Document link which is missing.

Solution

As a solution we can do the following:

  1. Edit the page
  2. Insert a Content Editor web part, Hide the Chrome
  3. Edit the web part
  4. Edit the HTML
  5. Create a link that calls JavaScript code
  6. Insert the JavaScript code below

<a onclick="OpenDialog();" href="#">Add Document</a>

<script type="text/javascript">

function OpenDialog(){
        var options = {
            url:"http://hp/_layouts/Upload.aspx?List={E4C76E09-2F22-4C18-A20E-C07E56F246D9}&RootFolder=%2FShared%20Documents%2FHuman%20Resources",
            width: document.body.offsetWidth,
            height: document.body.offsetHeight,
            dialogReturnValueCallback: DialogCallback
            };

        SP.UI.ModalDialog.showModalDialog(options);
}

function DialogCallback(dialogResult, returnValue)
 
  location.reload();             
}

</script>

You can find the HTML Code window here.

image

You need to copy the URL from original list > folder > Add document > Copy shortcut action.

Clicking the Ok button & Saving the changes you can refresh the page to Add Document.

image

You can see that Folder automatically shows Human Resources value.

Selecting a document & clicking Ok button will take you through the previous page with a  Refresh.

image

Summary

In this article we have explored how to use Page Viewer web part along with the Add Document functionality.  I hope this will be useful in real-worlds scenarios.

References

How to use Content Editor web part?v


 Subscribe to Articles

     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend