[Solved] MVC Grid Problem

[Jason]

I'm encountering a str

public static List<OrderDetail > GetOrderDetails()
{
var orderdetail = (List<OrderDetail>)HttpContext

.Current.Session[sessionKeyName];
if (orderdetail == null
)
{
return new List<OrderDetail >();
}

return orderdetail;
}

ange issue and I can't put my finger on the root cause.

I am using the MVC Grid in order to show Order Details for an Order.  When I create a new Order everything works as expected however when I am editing an order (which I created a seperate view) for the following happens:

1. Firstly - the layout doesn't look the same despite the fact that I am using the same HTML in the create and edit views
2. When I refresh the grid (using the refresh button on the client) records are duplicated in a seeminly random pattern.  It works fine in the create view and the create and edit views are sharing Ajax methods in the OrderManagerController

I'm storing the OrderDetails in a session variable and I get a list of the Ordetails (which always returns the right amount) using this method:

 

 

In the method I use to bind the grid I return an anonymous type to get around a circular reference caused by the EF.  Whether I use return an anonymous type or use a View Model - the result is the samel.  What I do notice is that when I step through the code it goes to var results line, then to the return View(new GridModel(results)) line.  At this point the code goes back to the var results section and loops through there more times than there are Order Details - I'm not sure where this is coming from.

[GridAction]
public ActionResult _AjaxBinding()
{
    var results = from orderdetails in OrderDetailRepository.GetOrderDetails()
                  select new
                  {
                      UpdatedQuantity = orderdetails.UpdatedQuantity,
                      OriginalQuantity = orderdetails.OriginalQuantity,
                      OrderDetailSessionID = orderdetails.OrderDetailSessionID,
                      Pamphlet = orderdetails.Pamphlet.Name
                  };
    return View(new GridModel(results));
}

 

 

I'm just going to attach all the code from the view so you can take a look.  I have also included some screen shots in the attached zip folder.  I feel like I'm missing something really obvious and love the Grid functionality so any help is appreciated.

 

@model PublicHealth.PamphletOrdering.Admin.ViewModels.OrderViewModel
@using Telerik.Web.Mvc.UI

@{
    ViewBag.Title = "Create";
}

<h2>Enter a New Order</h2>

<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>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>

          <div class="buttons">
       <button type="submit" class="positive" value="Save">
           <img src="../../Content/Images/apply2.png" />
        Save
    </button>
</div>
<br />

    <legend>Requestor</legend>

    @{ Html.Telerik().TabStrip()
    .Name("TabStrip")
    .Effects(fx => fx.Expand().Opacity().OpenDuration(200).CloseDuration(300))
    .Items(tabstrip =>
    {
        tabstrip.Add()
            .Text("Requestor")
            .ImageUrl("~/Content/Common/Icons/Suites/mvc.png")
            .Content(@<text>          <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.FirstName)
            @Html.ValidationMessageFor(model => model.Requestor.FirstName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.LastName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.LastName)
            @Html.ValidationMessageFor(model => model.Requestor.LastName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.Individual)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.Individual)
            @Html.ValidationMessageFor(model => model.Requestor.Individual)
        </div>
                <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.Organization)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.Organization)
            @Html.ValidationMessageFor(model => model.Requestor.Organization)
        </div>
                <div class="editor-label">
            Street Number
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.AddressNumber)
            @Html.ValidationMessageFor(model => model.Requestor.AddressNumber)
        </div>
        <div class="editor-label">
            Street Address
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.AddressStreet)
            @Html.ValidationMessageFor(model => model.Requestor.AddressStreet)
        </div>

        <div class="editor-label">
            City
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.AddressCity)
            @Html.ValidationMessageFor(model => model.Requestor.AddressCity)
        </div>
        <div class="editor-label">
           Province
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.AddressProvince)
            @Html.ValidationMessageFor(model => model.Requestor.AddressProvince)
        </div>
        <div class="editor-label">
           Postal Code
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.AddressPostalCode)
            @Html.ValidationMessageFor(model => model.Requestor.AddressPostalCode)
        </div>
                <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.PhoneNumber)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.PhoneNumber)
            @Html.ValidationMessageFor(model => model.Requestor.PhoneNumber)
        </div>
                <div class="editor-label">
            @Html.LabelFor(model => model.Requestor.Email)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Requestor.Email)
            @Html.ValidationMessageFor(model => model.Requestor.Email)
        </div>  </text>);

        tabstrip.Add()
        .Text("Order Details")
        .ImageUrl("~/Content/Common/Icons/Sl/GridView.gif")
        .Content(@<text> <br />

           <span class="editor-label">
            @Html.LabelFor(model => model.OrderDate)
        </span>
        <span class="editor-field">
           @(Html.Telerik().DatePickerFor(model => model.OrderDate).Name("OrderDate").MinDate(new DateTime(2010, 1, 1)))
            @Html.ValidationMessageFor(model => model.OrderDate)
        </span>

     <span class="editor-label">
            @Html.LabelFor(model => model.DateRequired)
        </span>
        <span class="editor-field">
           @(Html.Telerik().DatePickerFor(model => model.DateRequired).Name("dtDateRequired").MinDate(new DateTime(2010, 1, 1)))

        </span>

               <span class="editor-label">
         Delivery Method
        </span>
        <span class="editor-field">
             @Html.DropDownList("DeliveryMethodID", new SelectList(ViewBag.DeliveryMethods as System.Collections.IEnumerable, "DeliveryMethodID", "Description", Model.DeliveryMethodID))
            @Html.ValidationMessageFor(model => model.DeliveryMethodID)
        </span>
        <hr />
        <br />

                <span class="editor-label">
           Order Completed
        </span>
        <span class="editor-field">
           @Html.EditorFor(model => model.OrderCompleted)
            @Html.ValidationMessageFor(model => model.OrderCompleted)
        </span>

            <span id="spnOrderCompleted" style="display:none">
       <span class="editor-label">
           Order Completion Date
        </span>
        <span class="editor-field">
            @(Html.Telerik().DatePickerFor(model => model.OrderCompletionDate).Name("dtOrderCompleted").MinDate(new DateTime(2010, 1, 1)))
        </span>
</span>
        <br /><br />



            @(

            Html.Telerik().Grid(Model.OrderDetails)
            .Name("Grid")
            .DataKeys(keys =>
            {
                keys.Add(od => od.OrderDetailSessionID);
            })
            .Columns(c => {
                c.Bound(od => od.OriginalQuantity).Width(200);
                c.Bound(od => od.UpdatedQuantity).Width(200);
                c.Bound(od => od.Pamphlet).Width(200);
                c.Command(commands => { commands.Edit(); commands.Delete(); }).Width(200);
               })

               .ClientEvents(events=>events.OnEdit("onEdit"))
               .DataBinding(binding => binding.Ajax()
                   .Select("AjaxGridSelect", "OrderManager")
                   .Update("UpdateOrderDetail", "OrderManager")
                   .Delete("DeleteOrderDetail", "OrderManager")
                   .Insert("InsertOrderDetail", "OrderManager")
                   )
                .ToolBar(t => {
                    t.Insert();

                })
               )    <br />

        </text>);
    })
    .SelectedIndex(0)
    .Render()
    ;}
    </fieldset>
}
<div>
    @Html.ActionLink("Back to List", "Index")
</div>

<script type="text/javascript">

    $(document).ready(function () {

        $('#OrderCompleted').click(function () {
            if (this.checked) {
                $('#spnOrderCompleted').css('display', 'block');
            }
            else {
                $('#spnOrderCompleted').css('display', 'none');
                $('#dtOrderCompleted-input').val = "";
            }
        });

    });

    function onEdit(e) {


        //alert($(e.form).find('#Pamphlet').data('tDropDownList'));
        // $(e.form).find('#Pamphlet').data('tDropDownList').select(function (dataItem) {
        //   return dataItem.Text == e.dataItem['Pamphlet.Name'];
        // });
    }
</script>