.NET 4.5 WebForms: do I (still) really have to specify all 3 templates in a FormView?

Question

Investigating the new strongly-typed, model-binding approach within ASP.NET 4.5 WebForms:

In Scott Hanselman's example of WebForms model binding (amongst others) I've seen the use of a FormView that opens in "Edit" mode, containing a number of DynamicControls e.g.

<asp:FormView runat="server" ID="MyForm" ... DefaultMode="Edit">
  <EditItemTemplate>
    <asp:DynamicControl runat="server" ID="Field1" DataField="Field1" Mode="Edit" />
    <asp:DynamicControl runat="server" ID="Field2" DataField="Field2" Mode="Edit" />
  </EditItemTemplate>
</asp:FormView> 

In my situation, my FormView's ItemTemplate, EditItemTemplate and InsertItemTemplate will be identical, except the ItemTemplate's controls will be in "ReadOnly" mode.

Do I (still) really need to provide three near-identical copies of the template within the FormView?

I'm happy to use DynamicControls, but the team here will never go for the "3x copy-paste" approach seemingly required for the FormView, especially for our large templates.

I had thought that maybe:

• the DynamicControls could get their "Mode" from the containing FormView?
• I could use something other than a FormView to contain my DynamicControls?
• Should I manage the DynamicControls' mode in code-behind to avoid template duplication?

Any examples/ideas?

Barbarossa

Answer 1

No, you don't have to specify all 3 templates. I've had the same scenario and this is my solution:

• Set the default mode to the most often used mode
• Then in code behind of the form manage the form mode

• In code behind copy the template e.g. EditTemplate you handcoded to the other one you need

  protected void Page_Init()
  {
      var action = RouteData.Values["action"].ToString();
  
      switch (action)
      {
          case "add":
              personForm.ChangeMode(FormViewMode.Insert);
              this.Page.Title += " Add";
              break;
          case "edit":
              personForm.ChangeMode(FormViewMode.Edit);
              this.Page.Title += " Change";
              break;
          default:
              personForm.ChangeMode(FormViewMode.ReadOnly);
              break;
      }
  
      // Reuse inserttemplate for editing
      if (personForm.CurrentMode == FormViewMode.Edit)
      {
          personForm.EditItemTemplate = personForm.InsertItemTemplate;
      }
  
  }
  

Triviality

Answer 2

Contrary to what many believe, you need only one template in a FormView, the EditItemTemplate.

Below is a simple example showing how to do it (notice that this is not connected to the idea of "Dynamic Data".).

In this way of doing it, the ReadOnly mode is never used, and thus an ItemTemplate is not needed. And the FormView will use the EditItemTemplate for both editing and inserting.

This way to do it simplifies the markup a lot, and when you make adjustments to the layout, you only have to do it in the one single template.

Notice that the save-button has no CommandName. The command is instead determined in the FormView1_ItemCommand event (see code).

Also notice that the mode of the FormView is determined in the event SqlDataSource1_Selected (see that code, with comments).

I have not included the markup for the SqlDataSource1, because there is nothing special you need to think about for that one. Just make it as usual.

    <asp:FormView ID="FormView1" runat="server" DataSourceID="SqlDataSource1"
      DataKeyNames="ApplicationId,UserId"
    >
      <EditItemTemplate>
        <asp:TextBox ID="txtFirstName" runat="server" Text='<%# Bind("firstName") %>'></asp:TextBox><br />
        <asp:TextBox ID="txtAge" runat="server" Text='<%# Bind("age") %>'></asp:TextBox><br />
        <asp:Button ID="btnSave" runat="server" Text="Save" />  
      </EditItemTemplate>
    </asp:FormView>

  Private Sub FormView1_ItemCommand(sender As Object, e As FormViewCommandEventArgs) Handles FormView1.ItemCommand
    Select Case FormView1.CurrentMode
      Case FormViewMode.Edit
        FormView1.UpdateItem(True)
      Case FormViewMode.Insert
        FormView1.InsertItem(True)
    End Select
  End Sub

  Private Sub SqlDataSource1_Selected(sender As Object, e As SqlDataSourceStatusEventArgs) Handles SqlDataSource1.Selected
    If e.AffectedRows = 0 Then
      ' nothing exists yet, so make formview ready to insert
      FormView1.ChangeMode(FormViewMode.Insert)
    Else
      ' something exists already, so make formview ready to edit
      FormView1.ChangeMode(FormViewMode.Edit)
    End If
  End Sub

Reede

Answer 3

Just set AutoGenerateEditButton="true". All input types in your item template will then be editable. You might have to show/hide border of the textboxes and the other input type using jQuery.

Irk