CODEWITHSUNDEEP
c#htmlasp.net-mvcforms
wholol
wholol

Reputation: 928

Adding <form> tags around form disables Razor code from filling in input elements

I am creating an edit form for an Event data model in which the input elements are populated with the Event properties for editing. After I finished populating the fields and formatting the page, I realised I had forgotten the form tags. After adding them in, my Razor code completely stops working, leaving all of the input elements empty. I have tried disabling various parts of the code, including all javascript and css and nothing seems to re-populate the fields except removing the form tags.

Here is the code: 

@model Objects.Models.Event.Event

@using EventSignup.Extensions

@{
    ViewBag.Title = "Edit";
}

<script src="@Url.Content("~/Scripts/jquery-ui-1.8.22.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Javascript/jquery-ui-timepicker-addon.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Javascript/Edit.js")" type="text/javascript" ></script>

<h2>Edit</h2>

<div class="hero-unit">
<form action="" id="event_form" method="post">
    <label for="name">Event Name:</label>
    <input type="text" name="name" id="name" value="@Model.EventName" /><br />

    <label for="tickets"># of Tickets:</label>
    <input type="text" name="tickets" id="tickets" value="@Model.Tickets" /><br />

    <label for="location">Location:</label>
    <select name="location" id="location">        
        @foreach (var Element in ViewBag.Buildings as List<EventSignup.ViewModels.SelectElement>)
        {
            <option value="@Element.ID" @((Model.TicketsLocation.ID == @Element.ID) ? "selected='selected'" : "")>@Element.DisplayName</option>
        }
    </select><br />

    <label for="dates">Dates/Times:</label>
    @foreach (var EventInfo in Model.Dates)
    {
        <input type="text" class="date" name="dates" id="dates@(Model.Dates.IndexOf(EventInfo)+1)" value="@EventInfo.DateTime.ToDateTimePickerString()"/><br />
        if (EventInfo != Model.Dates.Last())
        {
            <label></label>
        }
    }
    <div id="date_inputs">
    </div>
    <label></label>
    <span id="new_date" class="fauxlink" onclick="newDate()">New Date/Time</span><br /><br />
    <input type="hidden" id="num_dates" value="@Model.Dates.Count" />

    <input type="submit" id="submit" value="Submit" /><br />
</form>
</div>

Upvotes: 0

Views: 971

Answers (2)

Oded
Oded

Reputation: 499392

Don't use form elements directly - use the BeginForm HTML helper:

@using (Html.BeginForm())
{

}

You should also be using the template editors for the different model properties:

@Html.EditorFor(model => model.EventName)

Update:

I normally find that Visual Studio/Razor will stop working (no intellisense for instance) if the markup is not valid (missing " at the end of an attribute, elements that are not properly closed etc...). Check your markup carefully to see where your have such an error.

Upvotes: 9

bobek
bobek

Reputation: 8020

You should consider using Asp.net mvc 3 helpers to build your forms instead of regular html tags, and build your form based on the Model. This also encodes your form input and allows you to verify AntiFrogery token: 

@using (Html.BeginForm("actionhere", ..other arguments))
{
    @Html.DropDownFor(x => x.ModelProperty, Model.List);
}

Upvotes: 1

Related Questions