Usar el elemento web de formulario HTML para filtrar y mostrar los datos en otro elemento web

Nota: Nos gustaría proporcionarle el contenido de ayuda actual lo más rápido posible en su idioma. Esta página se ha traducido mediante un sistema automático y es posible que contenga imprecisiones o errores gramaticales. Nuestro objetivo es que este contenido sea útil para usted. ¿Puede informarnos sobre si la información le ha sido útil al final de la página? Aquí tiene el artículo en inglés para que pueda consultarlo fácilmente.

Nota: Este artículo ha hecho su trabajo y se va a jubilar pronto. Para evitar problemas de “Página no encontrada”, se están eliminando los vínculos que dirigen a esta página. Si ha creado vínculos a esta página, quítelos y juntos mantendremos la web conectada.

Puede usar el elemento Web de formulario de HTML para conectarse y pasar datos al otro elemento Web, por ejemplo, el elemento Web vista de lista.

En este artículo:

Usar el elemento Web formulario

Agregar un elemento web a una página

Conectar el elemento Web de formulario de HTML a otro elemento Web

Personalizar el elemento Web de formulario HTML

Personalizar el elemento Web de formulario HTML predeterminado

Usar un cuadro de texto multilínea

Use los botones de opción

Usar una lista desplegable de opciones

Use las casillas de verificación

Configurar las propiedades comunes de un elemento web

Apariencia

Diseño

Avanzado

Usar el elemento Web formulario

Puede usar el elemento Web de formulario de HTML para conectar y pasar datos al otro elemento Web. Por ejemplo, puede usar el elemento Web de formulario HTML de forma predeterminada para escribir un nombre de región, pasar el valor a un elemento Web de vista de lista de datos de clientes y filtrar los datos por región. También puede personalizar el elemento Web de formulario de HTML para habilitar un usuario, por ejemplo, seleccione el nombre de la región de una lista desplegable. Puede usar cuadros de texto, listas desplegables, cuadros de texto de varias líneas, casillas de verificación o botones de opción en el elemento Web de formulario de HTML.

La forma de conectar campos al otro elemento Web depende de cómo se ha definido el otro elemento Web para usar conexiones de elementos Web.

Aunque puede tener más de un elemento (cuadro de texto, botones de opción etc.) en el formulario, se pueden conectar sólo un campo a un elemento Web de vista de lista. Sin embargo, distintos campos se pueden conectar a distintos elementos Web al mismo tiempo. Por ejemplo, puede tener un elemento Web de formulario de HTML con un cuadro de texto y un conjunto de botones de opción. El cuadro de texto se pueden conectar a un elemento Web de vista de lista y los botones de opción a otra. Cuando el usuario hace clic en el botón Ir, ambos elementos Web de vista de lista se filtran según la información introducida en el elemento Web de formulario de HTML.

Puede conectar dos o más campos en el elemento Web de formulario de HTML a otro elemento Web, si ese elemento Web puede aceptar varios parámetros. En este caso, tendrá un programa de diseño Web compatible con SharePoint, como SharePoint Designer 2010 para completar las conexiones.

Principio de página

Agregar un elemento web a una página

Para modificar una página, es necesario contar al menos con los permisos que se obtienen al forma parte del grupo de SharePoint predeterminado Miembros de <nombre del sitio> .

  1. En una página, en la cinta, haga clic en la pestaña Página y, a continuación, haga clic en el comando Editar.

    Comando Editar de la ficha Editar

    Si el comando Editar está deshabilitado, es posible que no tenga los permisos necesarios para editar la página. Póngase en contacto con el administrador .

  2. Haga clic en la página en la que desea agregar un elemento web, haga clic en la pestaña Insertar y, a continuación, haga clic en Elemento web.

    Comando Elemento web

  3. Seleccione una categoría en Categorías, por ejemplo Listas y bibliotecas , seleccione el elemento web que desea agregar a la página, por ejemplo Anuncios y, a continuación, haga clic en Agregar .

    Selector de elementos web

  4. Cuando selecciona un elemento web, la información acerca del elemento web se muestra en Acerca del elemento web .

  5. Cuando haya terminado de editar la página, haga clic en la pestaña Página y, a continuación, haga clic en Guardar y cerrar .

Volver al principio

Conectar el elemento Web de formulario de HTML a otro elemento Web

Para usar el elemento Web de formulario de HTML, se conecta con otro elemento Web que sea capaz de recibir valores a través de una conexión de elemento Web, como el elemento Web de vista de lista. La lista que desea filtrar y la columna en la que desea filtrar, deben estar visibles en un elemento Web en la misma página como el elemento Web de formulario de HTML. Para obtener información sobre cómo agregar un elemento Web de formulario de HTML a una página, vea Agregar un elemento Web a una página.

  1. Vaya a la página que contiene el elemento Web que desea filtrar.

  2. En la cinta de opciones, haga clic en la ficha de página y, a continuación, haga clic en el comando Editar.

    Si el comando Editar está deshabilitado, es posible que no tenga los permisos necesarios para editar la página. Póngase en contacto con el administrador .

  3. Seleccione el elemento Web de formulario de HTML, haga clic en la flecha hacia abajo, haga clic en conexiones, seleccione Proporcionar valor de formulario a y, a continuación, haga clic en el nombre del elemento Web al que desea vincular.

  4. En el cuadro de diálogo Elegir conexión, haga clic en la pestaña Configurar conexión.

  5. En el menú Tipo de conexión, seleccione el campo que coincida con la información del elemento Web de formulario de HTML.

Nota: Los campos no tienen que tengan los mismos nombres ni hacen que deben ser los mismos tipos de datos. Los valores que se envía desde el elemento Web de formulario de HTML son valores de texto.

  1. Haga clic en Finalizar y, a continuación, haga clic en Salir del modo de edición en la parte superior de la página.

De forma predeterminada, puede escribir texto en el cuadro de texto y, a continuación, haga clic en Ir o presione ENTRAR. El otro elemento Web mostrará solo los datos que coincida con el texto que especificó. Para borrar el cuadro de texto para que pueda escribir texto nuevo, seleccione el texto actual y, a continuación, elimínelo.

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Personalizar el elemento Web de formulario HTML

Puede personalizar el elemento Web de formulario de HTML utilizando el Editor de código fuente, que está disponible desde el panel de herramientas del elemento Web de formulario HTML o un programa de diseño Web compatible con SharePoint, como SharePoint Designer 2010. En lugar del cuadro de texto estándar, puede usar los botones de opción, casillas, cuadros de texto multilínea y cuadros de lista. También puede agregar etiquetas y asignar un valor predeterminado.

Si personaliza el elemento Web de formulario de HTML, tenga en cuenta lo siguiente:

  • Solo un botón Ir (que usa el elemento entrada) puede utilizarse para pasar datos al otro elemento Web.

  • El elemento Web de formulario de HTML utiliza el elemento de formulario. No se pueden usar determinados elementos HTML dentro del elemento de formulario, incluidos los elementos HTML, cuerpo y formulario.

  • Todos los nombres de los campos del formulario deben ser únicos. Cada valor de nombre se usa para conectarse a un nombre de columna del elemento web al que se va a conectar.

Para personalizar el elemento Web formulario, use el botón del Editor de código fuente para mostrar el cuadro de diálogo Editor de texto y, a continuación, revisar o agregar el código fuente HTML.

Nota: El elemento Web de formulario de HTML sólo proporciona datos a otro elemento Web conectados, no puede obtener datos de otro elemento Web conectados. Por ejemplo, no puede usar el elemento Web de formulario de HTML como formulario de detalle para mostrar una fila de datos.

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Personalizar el elemento Web de formulario HTML predeterminado

Para personalizar el elemento Web de formulario HTML de forma predeterminada, haga lo siguiente:

  1. En la página que muestra el elemento Web de formulario HTML, en la cinta de opciones, haga clic en el ficha Edición y a continuación, haga clic en el comando Editar.

  2. Seleccione el elemento Web de formulario de HTML, haga clic en la flecha abajo y, a continuación, haga clic en Editar elemento Web.

  3. En el panel de herramientas, haga clic en el botón del Editor de código fuente .

  4. Se abre el cuadro de diálogo de Entrada de texto con el código HTML predeterminado.

Para hacer que sea más fácil de leer y modificar el código, insertar retornos de carro en el texto para dividir las líneas, como se muestra aquí:

<div onkeydown="javascript:if (event.keyCode == 13) _SFSUBMIT_">
<input type="text" name="T1"/>
<input type="button" value="Go" onclick="javascript:_SFSUBMIT_"/>
</div>

Puede cambiar el primer elemento de entrada de varias maneras de cambiar el nombre de un campo, agregue una etiqueta a un campo o agregando un valor predeterminado.

Propiedad

Descripción

Nombre del campo

El nombre del cuadro de texto predeterminado en el elemento Web formulario es T1. Este es el nombre que aparece en el cuadro de diálogo Configuración de conexión . Para asignar el campo un nombre más significativo, escriba un nombre nuevo en lugar de T1. No quite las comillas.

Etiqueta de campo

Puede agregar texto de etiqueta antes o después del campo de formulario. Escriba el texto sin comillas.

valor predeterminado

Puede agregar un valor predeterminado para el campo del área de texto. El usuario puede aceptar el valor haciendo clic en el botón Ir o reemplazarlo escribiendo su propia entrada. Para agregar un valor predeterminado, utilice el atributo valor.

Por ejemplo, si desea proporcionar un nombre más significativo, agregue un valor predeterminado y agregar una etiqueta, puede hacer lo siguiente:

Region: <input type="text" name="Region" value="India"/>

Puede cambiar el segundo elemento entrada cambiando el nombre del botón, como se muestra en el ejemplo siguiente:

<input type="button" value="SUBMIT" onclick="javascript:_SFSUBMIT_"/>

También puede agregar otros elementos HTML antes y después del elemento DIV. Por ejemplo, una forma muy útil y simple para permitir que el usuario rápidamente, actualice la página y restablecer los elementos del formulario es agregar una etiqueta de delimitador de la página actual tras el elemento DIV de cierre. Por ejemplo:

<br/>
<a href="http://contoso/SitePages/CustByRegion.aspx">Refresh</a>

Importante: No cambie el otro código HTML en el cuadro de diálogo Editor de texto. El elemento Web de formulario de HTML crea dinámicamente una rutina de secuencias de comandos en tiempo de ejecución para crear la conexión al otro elemento Web. No modifique el código de evento onkeydown o onclick o involuntariamente podría romper el elemento Web de formulario de HTML.

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Usar un cuadro de texto multilínea

El elemento TEXTAREA define un control de entrada de texto de varias líneas. El atributo de filas especifica el número de líneas que están visibles en el campo de texto. El atributo de columnas especifica el ancho del área de texto en caracteres. En el ejemplo siguiente, el usuario verá un cuadro de texto de 5 líneas y 30 caracteres de ancho. Cuando el usuario escribe texto en el cuadro, el texto se ajustará a 30 caracteres.

<textarea name="Region" rows=5 cols=30></textarea>

Sugerencia: Asegúrese de que no hay ningún espacio en el código fuente inmediatamente después del corchete angular de cierre (>).

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Use los botones de opción

Botones de opción, también denominados botones de opción, proporcionan se excluyen mutuamente a un usuario. En el ejemplo siguiente se muestra los tres botones de opción. Use el mismo nombre para cada botón de opción. Es habitual para agregar las etiquetas después de cada botón. Si desea aplicar formato a cada botón de opción en una línea independiente, use el elemento BR.

<input type="radio" name="Region" value="India"/> India<BR/>
<input type="radio" name="Region" value="USA"/> USA<BR/>
<input type="radio" name="Region" value="Spain"/> Spain<BR/>

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Usar una lista desplegable de opciones

Si hay muchas opciones mutuamente, considere la posibilidad de usar una caída de cuadro de lista desplegable mediante el elemento SELECT. Cada opción aparece como una opción independiente en la lista, pero el usuario solo puede seleccionar una opción. El texto después del corchete angular de cierre del elemento de opción es lo que aparece en la lista desplegable.

<select name="Region">
<option value="India">India</option>
<option value="USA">USA</option>
<option value="Spain"> Spain </option>
</select>

Para proporcionar un valor predeterminado, por ejemplo, España, haga lo siguiente:

<option value="Spain" selected="selected"> Spain </option>

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">Principio de página</link>

Use las casillas de verificación

Si hay varias opciones no excluyen mutuamente, considere la posibilidad de usar las casillas de verificación. Cada opción aparece como una casilla independiente, y el usuario puede seleccionar una o todas las opciones. Con esta opción, requiere un elemento Web que acepte varios parámetros como parte de la conexión de elementos Web.

<input type="checkbox" name="region1" value="India"/> India<BR/>
<input type="checkbox" name="region2" value="USA"/> USA<BR/>
<input type="checkbox" name="region3" value="Spain"/> Spain<BR/>

Para proporcionar un valor predeterminado, por ejemplo, España, haga lo siguiente:

<input type="checkbox" name="region3" value="Spain" checked="checked"/> Spain<BR/> 

Principio de página

Configurar las propiedades comunes de un elemento web

Todos los elementos web comparten un conjunto común de propiedades que controlan su aspecto, diseño y otras características avanzadas. Puede cambiar las propiedades del elemento web en el panel de herramientas.

Nota: Las propiedades comunes de los elementos web que se observan en el panel de herramientas pueden diferir de lo documentado en esta sección por diversos motivos:

  • Para ver la sección Opciones avanzadas en el panel de herramientas, debe tener el permiso adecuado.

  • Para un elemento Web específico, un desarrollador del elemento Web ha elegido no mostrar una o varias de estas propiedades comunes o puede ha decidido crear y mostrar propiedades adicionales que no se muestren en el aspecto, Diseño, y Secciones avanzadas del panel de herramientas.

  • Algunas configuraciones de permisos y propiedades pueden deshabilitar u ocultar propiedades del elemento web.

Apariencia

Propiedad

Descripción

Título

Especifica el título del elemento web que aparece en la barra de título del elemento web.

Alto

Especifica el alto del elemento web.

Ancho

Especifica el ancho del elemento web.

Estado de contenedor visual

Especifica si en la página debe aparecer todo el Elemento web cuando los usuarios abran la página de Elementos web. De forma predeterminada, el estado de contenedor visual está siempre ajustado en Normal y se muestra todo el Elemento web. Cuando el estado está establecido en Minimizado, solo aparece la barra de título.

Tipo de contenedor visual

Especifica si se muestran la barra de título y el borde del marco del elemento web.

Diseño

Propiedad

Descripción

Oculto

Especifica si el elemento web está visible cuando los usuarios abren la página. Si la casilla está activada, el elemento web solo estará visible cuando se esté diseñando la página y tenga el sufijo (Oculto) anexado al título.

Puede ocultar un Elemento web si desea usarlo para proporcionar datos a otro Elemento web a través de una conexión de Elementos web, pero no desea mostrarlo.

Dirección

Especifica la dirección del texto en el contenido del elemento web. Por ejemplo, el árabe es un idioma que se escribe de derecha a izquierda, mientras que el español y la mayoría del resto de idiomas europeos se escriben de izquierda a derecha. Esta configuración puede no estar disponible para todos los tipos de elementos web.

Zona

Especifica la zona de la página en que se encuentra el elemento web.

Nota: Las zonas de la página no aparecen en el cuadro de lista cuando no tiene permisos para modificar la zona.

Índice de zona

Especifica la posición del elemento web en una zona cuando contiene varios elementos web.

Para especificar el orden, escriba un entero positivo en el cuadro de texto.

Si los elementos web de la zona están ordenados de arriba abajo, el valor 1 significa que el elemento web aparece en la parte superior de la zona. Si los elementos web de la zona están ordenados de izquierda a derecha, el valor 1 significa que el elemento web aparecerá en la parte izquierda de la zona.

Por ejemplo, si se agrega un elemento web a una zona vacía que está ordenada de arriba abajo, el Índice de zona será 0. Si se agrega un segundo elemento web en la parte inferior de la zona, su Índice de zona será 1. Para trasladar el segundo elemento web a la parte superior de la zona, escriba 0 y, a continuación, escriba 1 para el primer elemento web.

Nota: Cada elemento web de la zona debe tener un valor de Índice de zona exclusivo. Por consiguiente, si modifica este valor para el elemento web actual, es posible que también cambien los valores de los demás elementos web de la zona.

Avanzadas

Propiedad

Descripción

Permitir minimizar

Especifica si se puede minimizar el elemento web.

Permitir cerrar

Especifica si el elemento web se puede quitar de la página.

Permitir ocultar

Especifica si se puede ocultar el elemento web.

Permitir cambio de zona

Especifica si se puede mover el elemento web a otra zona distinta.

Permitir conexiones

Especifica si el elemento web puede participar en las conexiones con otros elementos web.

Permitir edición en vista personal

Especifica si las propiedades del elemento web pueden modificarse en una vista personal.

Modo de exportación

Especifica el nivel de datos que se puede exportar para este elemento web. En función de la configuración, es posible que este valor no esté disponible.

Dirección URL de título

Especifica la dirección URL de un archivo que contiene información adicional sobre el elemento web. Cuando haga clic en el título del elemento web, el archivo aparecerá en una ventana de explorador independiente.

Descripción

Especifica la información en pantalla que aparecerá cuando mantenga el puntero del mouse sobre el título o el icono del elemento web. El valor de esta propiedad se usa para buscar elementos web con el comando Buscar del menú Buscar elementos web, que se encuentra en el panel de herramientas.

Dirección URL de la Ayuda

Especifica la ubicación de un archivo que contiene información de Ayuda sobre el elemento web. Cuando haga clic en el comando Ayuda del menú de elementos web, esta información aparecerá en una ventana de explorador independiente.

Modo de ayuda

Especifica cómo mostrará un explorador el contenido de la ayuda de un elemento web.

Seleccione una de estas opciones:

Modal Abre otra ventana del explorador, si el explorador cuenta con esta capacidad. El usuario debe cerrar la ventana antes de volver a la página web.

Sin modo Abre otra ventana del explorador, si el explorador cuenta con esta capacidad. El usuario no necesita cerrar la ventana antes de volver a la página web. Este es el valor predeterminado.

Explorar Abre la página web en la ventana actual del explorador.

Nota: Aunque los elementos web personalizados de Microsoft ASP.NET admiten esta propiedad, los temas de Ayuda predeterminados de SharePoint solo se abren en una ventana de explorador diferente.

Dirección URL de imagen de icono de catálogo

Especifica la ubicación de un archivo que contiene una imagen que se usará como icono del elemento web en la lista de elementos web. El tamaño de la imagen debe ser de 16 por 16 píxeles.

Dirección URL de imagen de icono de título

Especifica la ubicación de un archivo que contiene una imagen que se usará en la barra de título del elemento web. El tamaño de la imagen debe ser de 16 por 16 píxeles.

Mensaje de error de importación

Especifica un mensaje que aparece si se produce algún problema al importar el elemento web.

Principio de página

Ampliar sus conocimientos de Office
Explorar los cursos
Obtener nuevas características primero
Únase a los participantes de Office Insider

¿Le ha sido útil esta información?

¡Gracias por sus comentarios!

Gracias por sus comentarios. Quizá le interese ponerse en contacto con uno de nuestros agentes de soporte de Office.

×