Compartir a través de

Configurar el formulario de lista

Puede configurar el formulario de lista en una lista o biblioteca con un encabezado, un pie de página y el cuerpo de formulario personalizados con campos en cada una de las secciones. La configuración del formulario no cambia los datos en el elemento o archivo de la lista, solo cambia cómo se muestra el formulario a los usuarios que exploran la lista o biblioteca. Cualquier persona que pueda crear y administrar vistas en una lista puede usar la configuración del formulario para configurar el formulario con encabezado, pie de página y cuerpo con secciones.

Para configurar un formulario, deberá usar formateadores JSON que ya conoce al dar formato a una columna o una vista en una lista o biblioteca. La configuración del formulario permite que determinados elementos y atributos predefinidos compilen el encabezado, pie de página y cuerpo personalizados con una o varias secciones.

Introducción

Para configurar el formulario en una lista o biblioteca:

  1. Vaya a la lista o biblioteca para la que quiere configurar el formulario.

  2. Si se encuentra en una lista:

    • Abra un elemento para ver los detalles en el formulario de presentación.

  3. Si está en una biblioteca de documentos:

    • Seleccione un archivo.
    • Seleccionar...
    • Seleccione Más
    • Seleccione propiedades

  4. En la parte superior del formulario, expanda el icono Editar formulario y, después, seleccione Configurar diseño

    Configurar formulario de lista

  5. En el panel Formato, puede elegir aplicar formato a las secciones siguientes del formulario:

    • Encabezado
    • Cuerpo
    • Pie de página

Configurar encabezado personalizado

  1. Para aplicar formato al encabezado, seleccione Encabezado en el menú desplegable Aplicar formato a.

  2. Pegue el formateador de encabezado personalizado en el área de entrada de texto JSON.

    Nota:

    La configuración de formularios permite ciertos elementos y atributos predefinidos para crear el encabezado personalizado.

  3. A continuación, encontrará un ejemplo personalizado de JSON y encabezado:

    Encabezado de formulario de lista personalizado 

    {
  "elmType": "div",
  "attributes": {
    "class": "ms-borderColor-neutralTertiary"
  },
  "style": {
    "width": "99%",
    "border-top-width": "0px",
    "border-bottom-width": "1px",
    "border-left-width": "0px",
    "border-right-width": "0px",
    "border-style": "solid",
    "margin-bottom": "16px"
  },
  "children": [
    {
      "elmType": "div",
      "style": {
        "display": "flex",
        "box-sizing": "border-box",
        "align-items": "center"
      },
      "children": [
        {
          "elmType": "div",
          "attributes": {
            "iconName": "Group",
            "class": "ms-fontSize-42 ms-fontWeight-regular ms-fontColor-themePrimary",
            "title": "Details"
          },
          "style": {
            "flex": "none",
            "padding": "0px",
            "padding-left": "0px",
            "height": "36px"
          }
        }
      ]
    },
    {
      "elmType": "div",
      "attributes": {
        "class": "ms-fontColor-neutralSecondary ms-fontWeight-bold ms-fontSize-24"
      },
      "style": {
        "box-sizing": "border-box",
        "width": "100%",
        "text-align": "left",
        "padding": "21px 12px",
        "overflow": "hidden"
      },
      "children": [
        {
          "elmType": "div",
          "txtContent": "='Contact details for ' + [$Title]"
        }
      ]
    }
  ]
}

  4. Para obtener una vista previa de los cambios, haga clic en el botón Vista previa.

  5. Haga clic en el botón Guardar para guardar los cambios.

  6. Cierre y vuelva a abrir el formulario para ver el encabezado personalizado.

  1. Para aplicar formato al pie de página, en el panel Formato, seleccione Pie de página en la lista desplegable Aplicar formato a.

  2. Pegue el formateador de pie de página personalizado en el área de entrada de texto JSON.

    Nota:

    La configuración de formularios permite ciertos elementos y atributos predefinidos para crear el pie de página personalizado.

  3. A continuación, encontrará un ejemplo personalizado de JSON y pie de página:

    Pie de página de formulario de lista personalizado 

    {
    "elmType": "div",
    "style": {
        "width": "100%",
        "text-align": "left",
        "overflow": "hidden",
        "border-top-width": "1px"
    },
    "children": [
        {
            "elmType": "div",
            "style": {
                "width": "100%",
                "padding-top": "10px",
                "height": "24px"
            },
            "children": [
                {
                    "elmType": "a",
                    "txtContent": "='Contact Details for ' + [$Title]",
                    "attributes": {
                        "target": "_blank",
                        "href": "='https://aka.ms/contacts?email=' + [$Email]",
                        "class": "ms-fontColor-themePrimary ms-borderColor-themePrimary ms-fontWeight-semibold ms-fontSize-m ms-fontColor-neutralSecondary–hover ms-bgColor-themeLight–hover"
                    }
                }
            ]
        }
    ]
}

  4. Para obtener una vista previa de los cambios, haga clic en el botón Vista previa.

  5. Haga clic en el botón Guardar para guardar los cambios.

  6. Cierre el formulario y vuelva a abrirlo para ver el pie de página aplicado.

Configurar un cuerpo personalizado con una o varias secciones

  1. Para aplicar formato al cuerpo, en el panel Formato, seleccione Cuerpo en la lista desplegable Aplicar formato a.

  2. Pegue el formateador de cuerpo personalizado en el área de entrada de texto JSON.

  3. A diferencia de los encabezados y pies de página, la configuración del cuerpo solo permite definir una o más secciones y agregar una o más columnas en cada una de estas secciones.

    • Se pueden definir una o varias secciones para un cuerpo.
    • Cada sección puede hacer referencia a una o más columnas en la lista o biblioteca.
    • Solo se puede hacer referencia a una columna en una sección.
    • Si se hace referencia a una columna en varias secciones, la primera sección a la que se hace referencia tendrá prioridad.
    • Si hay una columna a la que no se hace referencia en ninguna de las secciones, se hace referencia a ella automáticamente en la última sección.
    • En la última sección se hace referencia automáticamente a las nuevas columnas agregadas.

  4. A continuación, se muestra la estructura JSON para empezar a definir secciones y hacer referencia a columnas en las secciones:

    {
  "sections": [
    {
      //give a display name for the section
      "displayname": "",
      "fields": [
        //reference your fields here using their display name
        "Title"
      ]
    },
    {
      //give a display name for the section
      "displayname": "",
      "fields": [
        //reference your fields here using their display name
      ]
    }
  ]
}

  5. Este es un ejemplo de un JSON de cuerpo personalizado con secciones:

    {
  "sections": [
    {
      "displayname": "",
      "fields": [
        "Title"
      ]
    },
    {
      "displayname": "Details",
      "fields": [
        "Department",
        "Email",
        "Country"
      ]
    },
    {
      "displayname": "Application",
      "fields": [
        "Application Id",
        "Approver",
        "Reviewer"
      ]
    }
  ]
}

  6. Una vez que el cuerpo se haya personalizado con una o más secciones, el formulario de lista o biblioteca cambiará a un diseño de varias columnas.

    Nota:

    La configuración del cuerpo del formulario cambiará su diseño de formulario de lista o biblioteca de una sola columna a un diseño de varias columnas. Agregaremos soporte para configurar el cuerpo con diseño de una sola columna en una actualización posterior.

    Cuerpo de formulario de lista personalizado con secciones

  7. Para obtener una vista previa de los cambios, haga clic en el botón Vista previa.

  8. Haga clic en el botón Guardar para guardar los cambios.

  9. Cierre el formulario y vuelva a abrir el formulario para ver el cuerpo aplicado.

Formateador personalizado para campos de Read-Only

Introducción

Listas Microsoft ofrece una forma eficaz de organizar la información y colaborar con su equipo. Con el aumento de la creación de elementos de lista basados en inteligencia artificial, los usuarios suelen tener que ver pero no editar determinados campos, como los datos generados por el sistema o los detalles agregados por el bot. Para satisfacer esta necesidad, se propone una nueva característica de formateador personalizado para permitir que los campos aparezcan como de solo lectura en formularios de lista.

¿Por qué Read-Only los campos son importantes?

Actualmente, los campos de solo lectura están ocultos en los formularios Nuevo elemento y Editar. Esto crea desafíos cuando los bots de inteligencia artificial o los procesos automatizados crean elementos que contienen datos críticos que los usuarios necesitan ver pero no modificar. Por ejemplo:

  • Un bot crea un vale de servicio al cliente con detalles del problema Título del problema, Descripción del problema.
  • Los usuarios deben ver esta información para realizar acciones (por ejemplo, enviar un correo electrónico), pero no poder cambiarla.

El nuevo formateador personalizado resuelve esto al permitir que estos campos se muestren como de solo lectura.

Funcionamiento del formateador personalizado

El formateador personalizado presenta una nueva configuración JSON para marcar los campos como de solo lectura en las vistas de formulario.

Estructura JSON

{
    "sections": [{}],
    "fieldsettings": [
        {
            "name": "fieldName",
            "readonly": true
        }
    ]
}
  • name: nombre interno del campo.
  • readonly: cuando se establece en true, el campo se muestra como de solo lectura.

Comportamiento en diferentes vistas de formulario

El formateador personalizado garantiza una experiencia de usuario coherente:

  • Formulario nuevo elemento: no se mostrará el campo de solo lectura.
  • Editar formulario: el campo se muestra sin un cuadro de texto editable, similar a una columna calculada.
  • Editar todo el modo: el campo permanece visible y no se puede editar.

El botón Guardar funciona según lo esperado: no hay modificaciones accidentales en los campos de solo lectura.

Ejemplo de caso de uso

Imagine que un bot de CRM crea vales con detalles de problema rellenados previamente. Con este formato:

  • Título del problema (solo lectura): los usuarios pueden ver y copiar el título del problema, pero no pueden modificarlo.
  • Descripción del problema (solo lectura): los usuarios pueden ver y copiar la descripción del problema, pero no pueden modificarla.
  • Origen del problema (solo lectura): los usuarios pueden hacer clic en el vínculo Origen del problema, pero no pueden modificarlo.

imagen

  • Last updated on