Export the Name field in a Document Library list to a mobile app

2023-03-20

Export the Name field of a Document Library list to a mobile app by using the Visual Studio SharePoint List wizard. The Name field does not appear automatically when a user creates a mobile app for a document library in SharePoint. In a Document Library list, a user can upload various documents. A list item for a document typically has Title, Name, and a link to the document as properties. If a developer creates a Windows Phone 7 app against the document library, the Name field is not exported in the IDE wizard. Thus the developer has no easy way of knowing the document name. (This is because SharePoint does not support fields of type "FILE" by default.)

Note

The Title property does not include the file name extension.

So if you want to fetch a document, build the full URL of the document, and open the document in the default application (such as Word), you must write code to get the actual file name.

Important: If you are developing an app for Windows Phone 8, you must use Visual Studio Express 2012 instead of Visual Studio 2010 Express. Except for the development environment, all information in this article applies to creating apps for both Windows Phone 8 and Windows Phone 7. > For more information, see How to: Set up an environment for developing mobile apps for SharePoint.

Prerequisites for exporting the Name field of a document library

SharePoint
Visual Studio Express 2010 with the new SharePoint templates

Customize the generated classes

To export the Name field and access attachments from a document library, you must make a few changes in the ListDataProvider class, in DisplayItemViewModel.cs, and in the DisplayForm class. When a developer uses the new SPList wizard from Visual Studio, the wizard creates several classes that follow the Model-View-ViewModel design pattern. (For more information, see Using the Model-View-ViewModel Pattern.) Two folders are created: One is named Views and contains all files needed to modify various list views (such as DisplayForm, EditForm, List, and NewForm). The other is named ViewModels and contains DisplayItemViewModel, EditItemViewModel, ListViewModel, and NewItemViewModel. You will be modifying some of these classes generated by the wizard.

Step 1: Modify ListDataProvider to fetch SPListItem.File property

In the ListDataProvider class, add the following line of code in the LoadItem method.

Context.Load(spListItem, Item => Item.File);
Also in the ListDataProvider class, add the following code in the LoadData method.

Context.Load(items, listItems => listItems.Include(item => item.File));

Step 2: Add the FileUrl and FileName properties

In DisplayItemViewModel.cs, add the following code to DisplayVM.

  
public string m_fileUrl;
        public string FileUrl
        {
            get
            {
                if (string.IsNullOrEmpty(m_fileUrl))
                {
                    IListDataProvider p = this.DataProvider;
                    p.LoadItem(this.ID, (LoadItemCompletedEventArgs args) =>
                         {
                             FileUrl = this.DataProvider.SiteUrl + 
                                       args.Item.File.ServerRelativeUrl;
                         });
                }
                return m_fileUrl;
            }
            set
            {
                m_fileUrl = value;
                RaisePropertyChanged("FileUrl");
            }
        }
        public string m_fileName;
        public string FileName
        {
            get
            {
                if (string.IsNullOrEmpty(m_fileName))
                {
                    IListDataProvider p = this.DataProvider;
                    p.LoadItem(this.ID, (LoadItemCompletedEventArgs args) =>
                    {
                        FileName = args.Item.File.Name;
                    });
                }

                return m_fileName;
            }
            set
            {
                m_fileName = value;
                RaisePropertyChanged("FileName");
            }
        }

Step 3: Add a hyperlink to the DisplayForm that binds to FileUrl and FileName

Add the following changes to the Display form.

  
<StackPanel HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,5,0,5">
  <TextBlock TextWrapping="Wrap" Width="150" HorizontalAlignment="Left" 
   Style="{StaticResource PhoneTextNormalStyle}">
    FileUrl :
  </TextBlock>
  <HyperlinkButton Content="{Binding FileName}" NavigateUri="{Binding FileUrl}" 
   x:Name="hypFile" TargetName="_blank" />
</StackPanel>

Share via