Tener campos de solo lectura en la vista de editar items en SharePoint


En un tutorial anterior mostré como crear un formulario personalizado para la creación de ítems de listas en SharePoint, usando SharePoint Designer 2010.

Ahora voy mostrarles como tener campos de sólo lectura y campos editables en un nuevo formulario de Edición. Vamos a pasar de este formulario:

image

Al formulario que vamos a crear en este tutorial:

image

 

En mi sitio de SharePoint tengo una lista personalizada para la solicitud de requerimientos. En la siguiente imagen pueden ver encerrados en el cuadro verde los campos que deseo tener de solo lectura (Read-Only) y encerrados con azul los campos que voy a permitir modificar.

image

 

Paso a paso:

1. Nos conectamos al sitio con SharePoint Designer 2010 y hacemos clic en la parte de Lists and Libraries, buscamos la lista que deseamos modificar y hacemos clic en ella.

image_thumb[57]

2. En la sección de Forms hagan clic en el botón New.

Nota: Es preferible trabajar siempre creado nuevas vistas y no modificar las vistas predeterminadas, por si alguna de nuestras modificaciones daña el formulario

image_thumb[55]

3. Escriba el nombre del archivo, seleccione el tipo Edit item form y seleccione la casilla que lo predetermina (Set as default form for the selected type). Presione el botón OK.

image

4. Hacemos clic en el nombre del formulario para abrirlo.

image

5. Vamos a utilizar la vista de código (encerrada por el cuadro rojo) para modificar esta vista, porque utiliza XSLT, aunque para este ejemplo solo ocupamos conocimientos de HTML.

foto1

6. A continuación buscan la plantilla dvt_1.rowedit para modificarla.

image

7. Insertamos un reglón antes del campo que muestra el Detalle corto del requerimiento para poner un título.

image

8. Insertamos otro título antes del campo Solicitante.

image

9. Insertamos el título final antes del campo numero de contratacion asignado.

image

10. A todos los campos que deseamos mostrar como de solo lectura se les debe cambiar el atributo ControlMode. A continuación les muestro el código original:

<td width="400px" valign="top" class="ms-formbody">
       <SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="Edit" FieldName="Title" __designer:bind="{ddwrt:DataBind('u',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}"/>
       <SharePoint:FieldDescription runat="server" id="ff1description{$Pos}" FieldName="Title" ControlMode="Edit"/>
</td>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

 

Y como debe quedar el código:

<td width="400px" valign="top" class="ms-formbody">
       <SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="Display" FieldName="Title" __designer:bind="{ddwrt:DataBind('u',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}"/>
       <SharePoint:FieldDescription runat="server" id="ff1description{$Pos}" FieldName="Title" ControlMode="Display"/>
</td>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

11. Guardamos los cambios y probamos nuestro formulario.

image

Anuncios

20 comentarios (+¿añadir los tuyos?)

  1. Trackback: Agenda de la Comunidad « MSExpertos
  2. Jaime Cepeda
    May 16, 2013 @ 16:21:02

    Estimada Vielka queria preguntarle si me puede ayudar con algunas dudas que tengo acerca de los tipos de contenidos en sharepoint. Lo que pasa es que necesito ocultar campos dentro de un formulario (lista de sharepoint) e ir habilitandolos por medio de un workflow a medida que este avanza y cambia de estado.

    Las consultas son las siguientes.

    De que forma relaciono el tipo de contenido creado al formulario (Lista de sharepoint).
    De que forma controlo el tipo de contenido, dentro del workflow, para ir habilitandolo al usuario que corresponda a medida que este avanza (cambia de estado).

    Esas son las dudas que tengo actualmente, si me puedes ayudar

    Responder

    • Vielka R.
      Jun 10, 2013 @ 15:55:38

      Hola Jaime, en este caso te recomiendo crear varios formularios ASPX con SharePoint Designer ya habilitarles los campos que ocupas, y dentro del workflow, enviarle a los usuarios los vínculos a los diferntes formularios.

      Responder

  3. José Ramón Batres
    Jul 17, 2013 @ 10:05:02

    Estimada Vielka,
    Es muy bueno el artículo de “Tener campos de solo lectura en la vista de editar items en SharePoint”, pero me gustaría saber como puede hacer para que solo un grupo de usuarios vean esos campos como lectura y que otro grupo de usuarios los puedan editar. De antemano agradezco tu valiosa ayuda.

    Responder

    • Vielka R.
      Jul 17, 2013 @ 11:49:27

      Para esto debes usar algún tipo de script

      Responder

      • José Ramón Batres
        Jul 17, 2013 @ 13:48:06

        Estimada Vielka,
        Pues la verdad soy nuevo en este tipo de desarrollos y a través de estar investigando en la red he avanzado mucho, por lo que quisiera saber si tendrás algún script de ejemplo en el que me pueda basar. Muchas gracias !!!!

  4. Federico
    Dic 27, 2013 @ 08:17:36

    Hola una pregunta, y si quiero crear un nuevo item? los campos estan de solo lectura? y si los quiero modificar?
    Saludos desde ARgentina!

    Responder

    • Vielka R.
      Dic 27, 2013 @ 08:54:16

      Hola Federico, el campo para creación es el newform.aspx, en ese caso no debes modificarlo.

      Responder

      • Anónimo
        Dic 30, 2013 @ 07:30:07

        Gracias, si por ejemplo quiero que un usuario en particular tenga otro tipo de formulario, puedo editarlo a mi manera? es decir que se vea el default y para usuarios particulares, otro form con mas opciones? saludos

      • Vielka R.
        Ene 01, 2014 @ 22:34:35

        Hola y feliz año nuevo. En ese caso debes recurrir a los roles de SharePoint y jquery o JavaScript

  5. Anónimo
    Jul 17, 2014 @ 10:35:48

    Excelente tutorial!

    Responder

  6. Anónimo
    Sep 18, 2014 @ 10:56:17

    hola!!!

    he estado leyendo la información y me parece muy interesante soy nueva en esto
    pero veo que tiene un codigo css he seguido los pasos como están pero me detuve por que no se donde poner ese codigo me podrias ayudar estoy utilizando sharepoint 2013 y designer 2013 ojala y puedas ayudarme

    Responder

  7. krmn
    Sep 18, 2014 @ 17:02:48

    gracias por responder a mi duda…

    en caso de que tuviera que recurrir a javascript lo que estoy haciendo es un proyecto de residencias no solo tengo esa problemática sino son varias:

    1. tener varios campos no editables
    2. tener campos que pongan numero consecutivos y no editables
    3. cuando la persona este logueada el formulario que esta llenando se llene un campo con su nombre.
    4. que la fecha sea por default y no editable
    5. tener 2 formularios en una sola lista personalizada, pero cuando el usuario solo
    pueda llenar solo unos campos y cuando haya llenado esos campos que en el
    siguiente formulario que ese encuentra en esa misma lista se cargue la información
    que anteriormente lleno el usuario…

    no se si eso sea posible de hacer espero y me puedas ayudar ya que como ves son
    varios detalles que debo de resolver

    agradecería tu ayuda!!!

    Responder

  8. christian2714
    Sep 19, 2014 @ 11:27:02

    Hola que tal Vielka excelente post!, aprovecho para preguntarte como se puede agregar en el formulario campos expandibles con la leyenda “Mostrar más” como en la tabla de tareas. Para que en primer instancia solo se muestren grupos de 1,2 ,3 o mas campos y al apretar “Mostrar más” podamos rellenar mas valores.

    Saludos y muchas gracias

    Responder

  9. Dany
    Ene 13, 2015 @ 10:51:51

    Hola, que tal, quisiera saber como obtienes al solicitante sin tener que meterlo a mano, es decir, desde que nos loggeamos en sharepoint que ahí obtenga quien está haciendo la petición.

    Responder

    • José Mendoza
      Jun 02, 2015 @ 12:29:54

      Hola, Dany. sugiero que utilices el web service GetUserProfileByName, en lo personal me ha funcionado. Saludos.

      Responder

  10. Alex
    May 26, 2016 @ 11:32:41

    Hola que tal, un consulta modifique mi formulario tal como lo indicas en tu guia, pero cuando quiero editar para ver los resultados de los campos de solo lectura en la vista previa de explorador en sharepoint Designer lo veo correcto y esta abriendo la pagina edicion.aspx, pero cuando lo abro en Internet Explorer abre el archivo AllItems.aspx y aqui no se ven los cambios como hago para abrir la ruta correcta

    Responder

    • Vielka R.
      May 26, 2016 @ 12:47:26

      Hola Alex, el formulario AllItems.aspx es el de la vista de todos los elementos, para que veas los cambios que has hecho, debes presionar el botón Editar en la Cinta de comandos superior o Ribbon.

      Responder

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: