Crear plantillas para el control FormView de servidor Web

Artículo
10/22/2014

Actualización: noviembre 2007

Puede personalizar el control FormView agregando plantillas que permitan al usuario consultar o modificar los datos mostrados por el control. El contenido de cada plantilla se compone de marcado, de controles con expresiones de enlace de datos y de botones de comando que cambian el modo del control FormView.

Nota:
Para obtener más información sobre las expresiones de enlace de datos, vea Información general sobre las expresiones de enlace de datos.

Plantillas de presentación

La plantilla de presentación principal del control FormView es la plantilla ItemTemplate. La plantilla ItemTemplate muestra los datos enlazados en modo de sólo lectura. Los controles incluidos en una plantilla ItemTemplate son controles que sólo muestran datos, como un control Label. La plantilla también puede contener botones de comando para cambiar el modo del control FormView a inserción o edición, o para eliminar el registro actual. Puede enlazar los controles de la plantilla a los datos mediante una expresión de enlace de datos que incluya el método Eval de enlace de datos unidireccional, como se muestra en el ejemplo siguiente.

<asp:FormView ID="FormView1"
  DataSourceID="SqlDataSource1"
  DataKeyNames="ProductID"     
  RunAt="server">

  <ItemTemplate>
    <table>
      <tr><td align="right"><b>Product ID:</b></td>       <td><%# Eval("ProductID") %></td></tr>
      <tr><td align="right"><b>Product Name:</b></td>     <td><%# Eval("ProductName") %></td></tr>
      <tr><td align="right"><b>Category ID:</b></td>      <td><%# Eval("CategoryID") %></td></tr>
      <tr><td align="right"><b>Quantity Per Unit:</b></td><td><%# Eval("QuantityPerUnit") %></td></tr>
      <tr><td align="right"><b>Unit Price:</b></td>       <td><%# Eval("UnitPrice") %></td></tr>
    </table>                 
  </ItemTemplate>                   
</asp:FormView>

<asp:FormView ID="FormView1"
  DataSourceID="SqlDataSource1"
  DataKeyNames="ProductID"     
  RunAt="server">

  <ItemTemplate>
    <table>
      <tr><td align="right"><b>Product ID:</b></td>       <td><%# Eval("ProductID") %></td></tr>
      <tr><td align="right"><b>Product Name:</b></td>     <td><%# Eval("ProductName") %></td></tr>
      <tr><td align="right"><b>Category ID:</b></td>      <td><%# Eval("CategoryID") %></td></tr>
      <tr><td align="right"><b>Quantity Per Unit:</b></td><td><%# Eval("QuantityPerUnit") %></td></tr>
      <tr><td align="right"><b>Unit Price:</b></td>       <td><%# Eval("UnitPrice") %></td></tr>
    </table>                 
  </ItemTemplate>                 
</asp:FormView>

La plantilla ItemTemplate puede incluir controles LinkButton que cambien el modo del control FormView en función del valor de CommandName. El valor New de CommandName sitúa el registro en el modo de inserción y carga la plantilla InsertItemTemplate, lo que permite al usuario especificar los valores de un nuevo registro. Puede agregar un botón con el valor Edit en CommandName a la plantilla ItemTemplate para situar el control FormView en el modo de edición. Se puede agregar un botón con el valor Delete en CommandName a la plantilla ItemTemplate para que los usuarios puedan eliminar el registro actual del origen de datos.

Las demás plantillas de presentación que se pueden utilizar con el control FormView son la plantilla EmptyDataTemplate, que se muestra cuando no hay ningún registro actual para enlazarse, y las plantillas HeaderTemplate y FooterTemplate, que definen el contenido del encabezado y del pie de página, respectivamente.

Plantillas de edición e inserción

Puede utilizar la plantilla EditItemTemplate para permitir a los usuarios modificar un registro existente, y la plantilla InsertItemTemplate para recopilar los valores de un nuevo registro que se va a insertar en el origen de datos. En las plantillas EditItemTemplate e InsertItemTemplate normalmente están incluidos controles que toman los datos proporcionados por el usuario, como los controles TextBox, CheckBox o DropDownList. También puede agregar controles para mostrar los datos de sólo lectura y botones de comando para permitir a los usuarios editar el registro actual, insertar un nuevo registro o cancelar la acción actual. Puede enlazar los controles de las plantillas EditItemTemplate e InsertItemTemplate a los datos utilizando una expresión de enlace de datos que incluya el método Bind de enlace de datos bidireccional, como se muestra en el ejemplo siguiente.

<asp:sqlDataSource ID="EmployeeDetailsSqlDataSource" 
  SelectCommand="SELECT EmployeeID, LastName, FirstName FROM Employees WHERE EmployeeID = @EmpID"

  InsertCommand="INSERT INTO Employees(LastName, FirstName) VALUES (@LastName, @FirstName); 
                 SELECT @EmpID = SCOPE_IDENTITY()"
  UpdateCommand="UPDATE Employees SET LastName=@LastName, FirstName=@FirstName 
                   WHERE EmployeeID=@EmployeeID"
  DeleteCommand="DELETE Employees WHERE EmployeeID=@EmployeeID"

  ConnectionString="<%$ ConnectionStrings:NorthwindConnection %>"
  OnInserted="EmployeeDetailsSqlDataSource_OnInserted"
  RunAt="server">

  <SelectParameters>
    <asp:Parameter Name="EmpID" Type="Int32" DefaultValue="0" />
  </SelectParameters>

  <InsertParameters>
    <asp:Parameter Name="EmpID" Direction="Output" Type="Int32" DefaultValue="0" />
  </InsertParameters>

</asp:sqlDataSource>

<asp:sqlDataSource ID="EmployeeDetailsSqlDataSource" 
  SelectCommand="SELECT EmployeeID, LastName, FirstName FROM Employees WHERE EmployeeID = @EmpID"

  InsertCommand="INSERT INTO Employees(LastName, FirstName) VALUES (@LastName, @FirstName); 
                 SELECT @EmpID = SCOPE_IDENTITY()"
  UpdateCommand="UPDATE Employees SET LastName=@LastName, FirstName=@FirstName 
                   WHERE EmployeeID=@EmployeeID"
  DeleteCommand="DELETE Employees WHERE EmployeeID=@EmployeeID"

  ConnectionString="<%$ ConnectionStrings:NorthwindConnection %>"
  OnInserted="EmployeeDetailsSqlDataSource_OnInserted"
  RunAt="server">

  <SelectParameters>
    <asp:Parameter Name="EmpID" Type="Int32" DefaultValue="0" />
  </SelectParameters>

  <InsertParameters>
    <asp:Parameter Name="EmpID" Direction="Output" Type="Int32" DefaultValue="0" />
  </InsertParameters>

</asp:sqlDataSource>

Nota:
Al utilizar un control ListControl, como un control DropDownList, quizás desee enlazar el valor del control DropDownList a un campo del actual registro enlazado mientras que los valores de lista del control DropDownList están enlazados a otra lista de posibles valores. En ese caso, utilice la expresión Bind para enlazar la propiedad SelectedValue del control DropDownList al registro enlazado actual y establezca el origen de datos, la propiedad DataTextField y la propiedad DataValueField del control DropDownList en la lista de valores posibles.

Al utilizar un control ListControl, como un control DropDownList, quizás desee enlazar el valor del control DropDownList a un campo del actual registro enlazado mientras que los valores de lista del control DropDownList están enlazados a otra lista de posibles valores. En ese caso, utilice la expresión Bind para enlazar la propiedad SelectedValue del control DropDownList al registro enlazado actual y establezca el origen de datos, la propiedad DataTextField y la propiedad DataValueField del control DropDownList en la lista de valores posibles.

La plantilla EditItemTemplate se carga cuando los usuarios hacen clic en un botón de comando con el valor Edit en CommandName. Puede agregar un botón de comando LinkButton con el valor Update en CommandName para tomar los valores enlazados actuales y enviarlos al control del origen de datos para su actualización. Puede agregar un botón de comando LinkButton con el valor Cancel en CommandName para descartar los valores enlazados actuales, devolver el control FormView al modo de sólo lectura y cargar la plantilla ItemTemplate.

La plantilla InsertItemTemplate se carga cuando los usuarios hacen clic en un botón de comando con el valor New en CommandName. Puede agregar un botón de comando LinkButton con el valor Insert en CommandName para enviar los valores de un nuevo registro al control del origen de datos. Puede agregar un botón de comando LinkButton con el valor Cancel en CommandName para descartar los valores nuevos, devolver el control FormView al modo de sólo lectura y cargar la plantilla ItemTemplate.

Para obtener un ejemplo de cómo se utiliza el control FormView para editar datos, vea Modificar datos mediante un control FormView de servidor Web.

Plantilla de paginación de datos

En el control FormView, una página de datos es un registro enlazado único. Si establece la propiedad AllowPaging del control FormView en true, el control FormView agrega automáticamente controles de interfaz de usuario para la función de paginación. Puede personalizar la interfaz de usuario para la función de paginación agregando una plantilla PagerTemplate. Para obtener información detallada, vea Paginación en un control de servidor Web FormView.

Para obtener un ejemplo de una plantilla PagerTemplate de un control FormView, vea Paginación en un control de servidor Web FormView.

Vea también

Conceptos

Información general sobre FormView (Control de servidor Web)

Share via