Agregar un elemento web a una página en un complemento de SharePoint hospedado en SharePoint

Este es el quinto artículo de una serie sobre los conceptos básicos de desarrollo de complementos de SharePoint hospedados en SharePoint. Primero debe familiarizarse con Complementos de SharePoint y con los anteriores artículos de esta serie, los cuales puede encontrar en Introducción a la creación de complementos de SharePoint hospedados en SharePoint | Pasos siguientes.

Nota

Si ha estado trabajando en esta serie sobre complementos hospedados por SharePoint, hay una solución de Visual Studio que puede usar para continuar con este tema. También puede descargar el repositorio que encontrará en SharePoint_SP-hosted_Add-Ins_Tutorials y abrir el archivo BeforeWebPart.sln.

En este artículo, agregará un elemento web a la página predeterminada del complemento de SharePoint Orientación para empleados.

Agregar un elemento web a una página

1. En el Explorador de soluciones, abra el archivo Default.aspx.

2. Como vamos a agregar un elemento web de una vista de lista a la página que muestra los nuevos empleados en la lista de Seattle, ya no necesitaremos un vínculo a la página de vista de lista para la lista. Quite el <elemento asp:HyperLink> del <elemento asp:Content> cuyo ContentPlaceHolderId es PlaceHolderMain.

3. Dentro del mismo <elemento asp:Content> , agregue el siguiente elemento WebPartZone.

     <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly"
         ID="HomePage1" Title="loc:full" />
   

4. Guarde y cierre el archivo.

5. En el Explorador de soluciones, abra el archivo elements.xml de la página en el nodo Páginas.

6. Si el elemento File es de autocierre, quite el carácter “/” y agregue la etiqueta de cierre </File>.

7. En el elemento File, agregue un elemento AllUsersWebPart secundario y establezca su WebPartZoneID con el id. de la zona de elementos web que creó en la página. Ahora el contenido del archivo debería ser similar al siguiente. Este marcado indica a SharePoint que debe insertar un elemento AllUsersWebPart en la zona del elemento web que se denomina "HomePage1".

   <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
     <Module Name="Pages">
       <File Path="Pages\Default.aspx" Url="Pages/Default.aspx" ReplaceContent="TRUE" >
         <AllUsersWebPart WebPartZoneID="HomePage1" WebPartOrder="1">
   
         </AllUsersWebPart>
       </File>
     </Module>
   </Elements>
   
   

8. Agregue un elemento CDATA como elemento secundario de AllUsersWebPart y luego agregue un elemento webParts como elemento secundario de CDATA, como se muestra en el siguiente código de marcado.

   <AllUsersWebPart WebPartZoneID="HomePage1" WebPartOrder="1">
     <![CDATA[
       <webParts>
   
       </webParts>
     ]]>
   </AllUsersWebPart>
   

9. Agregue el siguiente marcado webPart como elemento secundario del elemento webParts. Este marcado agrega un elemento XsltListViewWebPart e indica al elemento web que muestre la lista Nuevos empleados de Seattle. Tenga en cuenta que el valor de propiedad ViewContentTypeId es solamente 0x, no el identificador real del tipo de contenido NewEmployee.

   <webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
     <metaData>
       <type name="Microsoft.SharePoint.WebPartPages.XsltListViewWebPart,
                     Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral,
                     PublicKeyToken=71e9bce111e9429c" />
     </metaData>
     <data>
       <properties>
         <property name="ListUrl">Lists/NewEmployeesInSeattle</property>
         <property name="IsIncluded">True</property>
         <property name="NoDefaultStyle">True</property>
         <property name="Title">New Employees in Seattle</property>
         <property name="PageType">PAGE_NORMALVIEW</property>
         <property name="Default">False</property>
         <property name="ViewContentTypeId">0x</property>
       </properties>
     </data>
   </webPart>
   

Ejecutar y probar el complemento

1. Use la tecla F5 para implementar y ejecutar el complemento. Visual Studio instala temporalmente el complemento en el sitio de SharePoint de prueba y ejecuta el complemento inmediatamente.

2. Cuando se abra la página predeterminada del complemento, se mostrará el elemento web de la vista de lista y la lista.

   Figura 1. Página predeterminada con elemento web de vista de lista

   

3. Pruebe a agregar nuevos elementos a la lista y a editar los existentes.

4. Para terminar la sesión de depuración, cierre la ventana del explorador o detenga la depuración en Visual Studio. Cada vez que presione F5, Visual Studio retirará la versión anterior del complemento e instalará la más reciente.

5. Trabajará con este complemento y con la solución de Visual Studio en otros artículos. Es recomendable que vuelva a retirar el complemento cuando deje de trabajar con él por un tiempo. Haga clic con el botón derecho en el proyecto en el Explorador de soluciones y seleccione Retirar.

Pasos siguientes

En el siguiente artículo de esta serie, agregará un flujo de trabajo a un complemento de SharePoint hospedado en SharePoint.