Simple CRUD Using Backbone.js in ASP.NET MVC Razor

@model RazorApp.Models.Order

@{
    ViewBag.Title = "Address And Payment";
}


<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('input[type=text], textarea, input[type=password]').width(200);
        $('#valSum').hide();

        $('form').bind('invalid-form.validate', function (error, element) {
            $('#valSum').show("slow");
            return false;
        });
    });
</script>
@if (!ViewData.ModelState.IsValid) {
<script type="text/javascript">
    $(function () {
        $('#valSum').show("slow");
    });
</script>
}

@using (Html.BeginForm()) {
    
<div class = "styler">
    <div id = "valSum" class="ui-state-error ui-corner-all" style="padding: 0 .7em;width:500px"> 
		<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span> 
		<strong>Please correct these Errors</strong> @Html.ValidationSummary(false, "")</p>
	</div>
    <fieldset class="ui-widget">
        <legend class="ui-state-legend-default ui-corner-top ui-corner-bottom">Shipping Information</legend>
        @Html.EditorForModel()
    </fieldset>
    <fieldset class="ui-widget">
        <legend class="ui-state-legend-default ui-corner-top ui-corner-bottom">Payment</legend>
        <p>We're running a promotion: all music is free 
            with the promo code: "FREE"</p>
        <div class="editor-label">
            @Html.Label("Promo Code")
        </div>
        <div class="editor-field">
            @Html.TextBox("PromoCode")
        </div>
    </fieldset>
    
    <input type="submit" value="Submit Order" />
    </div>
}