How to cleanly reuse edit / new views in Asp.NET MVC

Question

I'm trying to avoid code like this when reusing the same ViewUserControl in ASP.NET MVC. Any suggestions?

<% if (ViewContext.ViewData["editMode"].ToString() == "edit"){ %>
    <%= Html.SubmitButton("submit", "Update Brand")%><span class="or">Or</span><a href="#" class="cancel">Cancel</a>
<% } else { %>
    <%= Html.SubmitButton("submit", "Create New Brand")%><span class="or">Or</span><a href="#" class="cancel">Cancel</a>
<%} %>

And ...

<% if (ViewContext.ViewData["editMode"].ToString() == "edit"){ %>
    <h1 class="edit">Edit Brand Details</h1>
<% } else { %>
    <h1 class="create">Create A New Brand</h1>
<%} %>

Answer 1

I've always created separate views for New and Edit otherwise it feels like my application logic is starting to creep into my view. Similarly, I have different controller actions for Create and Update. Perhaps a better way to approach this would be to take the bits that the two view share and move them to a user control and do a RenderPartial. That way you can have clean views with a single mode but only write the common parts once.

Answer 2

<% string submitLabel = (ViewData["editMode"].ToString() == "edit") ? "Update Brand" : "Create New Brand" %>
<%= Html.SubmitButton("submit", submitLabel)%><span class="or">Or</span><a href="#" class="cancel">Cancel</a>

If you have multiple labels like this you can define them at the top of the page.

<% 
  string submitLabel = (ViewData["editMode"].ToString() == "edit") ? "Update Brand" : "Create New Brand";
  string h1Class = (ViewData["editMode"].ToString() == "edit") ? "edit" : "create";
  string h1Label = (ViewData["editMode"].ToString() == "edit") ? "Edit Brand Details" : "Create a New Brand";
%>


<h1 class="<%= h1Class %>"><%= h1Label %></h1>

Answer 3

Create one (or more) partial views for your entity (example using the contact entity) - IdChange.ascx (which shows Id and change information) - PersonalInfo.ascx - Address.ascx

IdChange.ascx will only be needed in edit views

Create two seperate views for edit and create and then use RenderPartial to bring your model data to the view. Create.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<%= Html.ValidationSummary("Create was unsuccessful. Please correct the errors and try again.") %>
<% using (Html.BeginForm())
   { %>
<fieldset>
    <legend>Create a new contact</legend>
    <div id="pagecontent">
        <div id="left">
        </div>
        <div id="center">
            <% Html.RenderPartial("PersonalInfo", Model); %>
        </div>
    </div>

    <p>
        <input type="submit" value="Create" />

Edit.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<%= Html.ValidationSummary("Edit was unsuccessful. Please correct the errors and try again.") %>
<% using (Html.BeginForm())
   { %>
<fieldset>
    <legend>Create a new contact</legend>
    <div id="pagecontent">
        <div id="left">
            <% Html.RenderPartial("IdChange", Model); %>
        </div>
        <div id="center">
            <% Html.RenderPartial("PersonalInfo", Model); %>
        </div>
    </div>

    <p>
        <input type="submit" value="Edit" />