[Solved] Problem with Grid Popup Editor and Combo Boxes while in Add Mode.

[L]

I have a Grid with a popup editor that contains combo boxes.  Each of the boxes works fine when in Edit mode.  However, when I click Add New, and then "Update" button on the template....the values from the Combo Boxes are not being returned from the form.  The fields remain NULL.   I throw an alert up to verify that the selection was made...which it is.  But the record does not get sent to the controller with the value that is selected.  


Here is the Popup Editor Template

@model sgrc.vpd.home.Models.vwInventory


<script>

    function onSelect(e) {
            var combobox = $("#ItemType").data("kendoComboBox");
            var dataItem = this.dataItem(e.item.index());
            alert(dataItem.ItemType + " " + dataItem.TypeID);
     };

</script>


@{
    ViewBag.Title = "Edit Inventory Item";
}

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

        @Html.HiddenFor(model => model.ItemID)
        @Html.HiddenFor(model => model.VehicleID)
        @Html.HiddenFor(model => model.memorycard)

        @Html.HiddenFor(model => model.remarks)
        @Html.HiddenFor(model => model.signon)
        @Html.HiddenFor(model => model.signoff)
        @Html.HiddenFor(model => model.AssignedName)

        @Html.HiddenFor(model => model.caliber)




   <div id="tabstrip">

        <ul>
                <li class="k-state-active" >
                    Item Information
                </li>
                <li  >
                    Assignment Information
                </li>
                <li  >
                    Vehicle Information
                </li>
            </ul>

        <div id="Item Information">


                <div class="edit-field">
                <br />

                <label for="ItemType" style="color:#212a33">Select Type:</label>
                    @(Html.Kendo().ComboBox()
                            .Name("ItemType")
                            .Placeholder("Select Item Type...")
                            .DataTextField("ItemType")
                            .DataValueField("TypeID")
                            .Filter("contains")
                            .Events(e => e.Select("onSelect"))
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("GetItems", "Inventory");
                                })
                                .ServerFiltering(false);
                            })
                    )


                <label for="Status" style="color:#212a33">Select Status:</label>
                    @(Html.Kendo().ComboBox()
                            .Name("StatusID")
                            .Placeholder("Select Status...")
                            .DataTextField("Status")
                            .DataValueField("StatusID")
                            .Filter("contains")
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("GetStatus", "Inventory");
                                })
                                .ServerFiltering(false);
                            })
                    )
                </div>

                <div class="edit-field">
                    @Html.LabelFor(model => model.serialnumber, "Serial Number/VIN")
                    @Html.TextBoxFor(model => model.serialnumber, new { style = "width: 80%; float:right" })
                    @Html.ValidationMessageFor(model => model.serialnumber)
                </div>

                <div class="edit-field">
                    @Html.LabelFor(model => model.Description, "Description")
                    @Html.TextAreaFor(model => model.Description, new { cols = 83, rows = 5 })
                    @Html.ValidationMessageFor(model => model.Description)
                </div>

                <div class="edit-field">
                    @Html.LabelFor(model => model.PurchaseDate, "Date Purchased")
                    @Html.EditorFor(model => model.PurchaseDate, new { style = "width: 80%; font-size:18px; font-family:inherit" })
                    @Html.ValidationMessageFor(model => model.PurchaseDate)

                    @Html.LabelFor(model => model.InServiceDate, "In Service Date", new { style = "color:#212a33" })
                    @Html.EditorFor(model => model.InServiceDate, new { style = "width: 80%; font-size:18px; font-family:inherit" })
                    @Html.ValidationMessageFor(model => model.InServiceDate)
                </div>

        </div>

        <div id="Assignment Information">

                <div class="edit-field">
                <br />
                <label for="AssignedID" style="color:#212a33 "width: 80%" >Assigned Officer:</label>

                @(Html.Kendo().ComboBox()
                        .Name("AssignedID")
                        .DataTextField("FullName")
                        .DataValueField("PersonID")
                        .Placeholder("Select Officer")
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("GetOfficers", "Inventory");
                            })
                            .ServerFiltering(false);

                        })

                 )


                    @Html.LabelFor(model => model.AssignedDate, "Date Assigned", new { style = "color:#212a33" })
                    @Html.EditorFor(model => model.AssignedDate, new { style = "width: 80%; font-size:18px; font-family:inherit" })
                    @Html.ValidationMessageFor(model => model.AssignedDate)

                </div>



                <div class="edit-field" style="width:40%">
                    <label for="AssignedBy" style="color:#212a33" >Assigned By</label>
                    @(Html.Kendo().ComboBox()
                            .Name("AssignedBy")
                            .DataTextField("FullName")
                            .DataValueField("PersonID")
                            .Placeholder("Select Officer")
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("GetOfficers", "Inventory");
                                })
                                .ServerFiltering(false);

                            })

                     )
                </div>


                <div class="edit-field">

                    @Html.LabelFor(model => model.lastupdated, "Last Updated", new { style = "color:#212a33" })
                    @Html.EditorFor(model => model.lastupdated)
                    @Html.ValidationMessageFor(model => model.lastupdated)


                    @Html.LabelFor(model => model.lastupdatedby, "Last Updated By")
                    @Html.TextBoxFor(model => model.lastupdatedby, new { disabled = "disabled", style = "width: 30%; float:right" })
                </div>





        </div>

        <div id="Vehicle Information">

            <div class="edit-field">
            <br />
                @Html.LabelFor(model => model.make, "Make", new { style = "color:#212a33" })
                @Html.TextBoxFor(model => model.make, new { style = "width: 80%; font-size:18px; font-family:inherit; float:right" })
                @Html.ValidationMessageFor(model => model.make)
            </div>

            <div class="edit-field">
                @Html.LabelFor(model => model.model, "Model", new { style = "color:#212a33" })
                @Html.TextBoxFor(model => model.model, new { style = "width: 80%; font-size:18px; font-family:inherit; float:right" })
                @Html.ValidationMessageFor(model => model.model)
            </div>

            <div class="edit-field">
                @Html.LabelFor(model => model.year, "Year", new { style = "color:#212a33" })
                @Html.TextBoxFor(model => model.year, new { style = "width: 80%; font-size:18px; font-family:inherit; float:right" })
                @Html.ValidationMessageFor(model => model.year)
            </div>

            <div class="edit-field">
                @Html.LabelFor(model => model.color, "Color", new { style = "color:#212a33" })
                @Html.TextBoxFor(model => model.color, new { style = "width: 80%; font-size:18px; font-family:inherit; float:right" })
                @Html.ValidationMessageFor(model => model.color)
            </div>

            <div class="edit-field">
                @Html.LabelFor(model => model.tag, "Tag", new { style = "color:#212a33" })
                @Html.TextBoxFor(model => model.tag, new { style = "width: 80%; font-size:18px; font-family:inherit; float:right" })
                @Html.ValidationMessageFor(model => model.tag)
            </div>

        </div>

</div>

}

<script>
    $(document).ready(function () {
        $("#tabstrip").kendoTabStrip({
            animation: {
                open: {
                    effects: "fadeIn"
                }
            }
        });
    });
</script>


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Here is the grid. 

@(Html.Kendo().Grid<sgrc.vpd.home.Models.vwInventory>()
    .Name("grid")
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
    .Columns(columns =>
    {

        columns.Bound(dataInventory => dataInventory.serialnumber).Title("Serial#").Width(200);
        columns.ForeignKey(dataInventory => dataInventory.ItemType, (System.Collections.IEnumerable)ViewData["itemtypes"], "TypeID", "ItemType")
.Title("Type").Width(250);

        columns.ForeignKey(dataInventory => dataInventory.StatusID, (System.Collections.IEnumerable)ViewData["status"], "StatusID", "status")
.Title("Status").Width(250);

        columns.ForeignKey(dataInventory => dataInventory.AssignedID, (System.Collections.IEnumerable)ViewData["officers"], "PersonID", "FullName")
        .Title("Assigned To").Width(250);
        columns.Bound(dataInventory => dataInventory.Description).Title("Description").Hidden(true);
        //columns.Bound(dataInventory => dataInventory.StatusID).Title("status").Hidden(true);
        columns.ForeignKey(dataInventory => dataInventory.AssignedBy, (System.Collections.IEnumerable)ViewData["officers"], "PersonID", "FullName")
        .Title("Assigned By").Width(250);
        columns.Bound(dataInventory => dataInventory.AssignedDate).Title("Date Assigned").Format("{0:g}");


        columns.Bound(dataInventory => dataInventory.ItemID).Hidden(true);
        columns.Bound(dataInventory => dataInventory.VehicleID).Title("VehicleID").Width(150).Hidden(true);
        columns.Bound(dataInventory => dataInventory.memorycard).Title("memorycard").Hidden(true);
        columns.Bound(dataInventory => dataInventory.year).Title("year").Hidden(true);
        //columns.Bound(dataInventory => dataInventory.status).Title("status").Hidden(true);
        columns.Bound(dataInventory => dataInventory.make).Title("Make").Hidden(true);
        columns.Bound(dataInventory => dataInventory.model).Title("Model").Hidden(true);
        columns.Bound(dataInventory => dataInventory.color).Title("Color").Hidden(true);
        columns.Bound(dataInventory => dataInventory.tag).Title("Tag").Hidden(true);
        columns.Bound(dataInventory => dataInventory.signon).Title("Signon").Hidden(true);
        columns.Bound(dataInventory => dataInventory.signoff).Title("Signoff").Hidden(true);
        columns.Bound(dataInventory => dataInventory.Ten84).Title("10-84").Format("{0:g}").Hidden(true);
        columns.Bound(dataInventory => dataInventory.lastupdated).Hidden(true);
        columns.Bound(dataInventory => dataInventory.lastupdatedby).Title("Updated By:").Hidden(true);
        //columns.Bound(dataInventory => dataInventory.AssignedID).Title("OfficerID").Hidden(true);
        columns.Bound(dataInventory => dataInventory.remarks).Title("Remarks").Hidden(true);
        columns.Bound(dataInventory => dataInventory.PurchaseDate).Title("Purchase Date").Format("{0:MM/dd/yyyy}").Hidden(true);
        columns.Bound(dataInventory => dataInventory.InServiceDate).Title("In Service Date").Format("{0:MM/dd/yyyy}").Hidden(true);
        columns.Bound(dataInventory => dataInventory.caliber).Hidden(true);

        columns.Command(commands =>
              {
                  commands.Edit();
                  commands.Destroy();
              }).Title("Commands").Width(180);
    })
    .ToolBar(toolbar =>
        {
            toolbar.Create();
           // toolbar.Save();
        })

    .Events(e => e.SaveChanges("onSaveChanges"))

    //.Events(events => events.Save("onSave"))
    //.Events(events => events.Edit("onEdit"))


    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditInventory"))
    .DataSource(dataSource => dataSource
    .Ajax()
    .Events(e => e.Error("onError")) // Handle the "error" event (errors set in controller)
    .Batch(false)
    .ServerOperation(false)  // Paging, sorting, filtering and grouping will be done client-side


        .Model(model =>
            {
                model.Id(dataInventory => dataInventory.ItemID);
                //model.Field(dataDestruction => dataDestruction.CaseID).Editable(false);
            })

        .Create(create => create.Action("Single_Create", "Inventory"))
        .Read(read => read.Action("Item_Read", "Inventory"))
        .Update(update => update.Action("Single_Update", "Inventory"))
        .Destroy(destroy => destroy.Action("Item_Destroy", "Inventory"))
        )

        .AutoBind(true)
        .Pageable(page => page.Enabled(true).PageSizes(new[] { 10, 20, 30, 40 }))
        .Sortable()
        .Navigatable()
        //.Scrollable(scrolling => scrolling.Enabled(false))
        .Events(e => e.Change("onChange"))
        //.Filterable()
        //.Scrollable(scrolling => scrolling.Enabled(true))
        //.Scrollable(s => s.Height("auto"))
        .HtmlAttributes(new {style = "width:960px;"})
     .Filterable()

)

[Vladimir Iliev]

Hi David,

I already answered to this query in duplicated support ticket created by you - #861057. Please keep in mind that it is highly recommended that you keep related questions in one support thread or a forum post, so that we can easily keep track of your support history and provide better answers in a shorter time.

Regards,
Vladimir Iliev
Telerik

 

 

[L]

Vladimir, 

OK.  I was going on the chance that another member of the forum that isn't an admin may have experienced this and had a solution.   

Are these forums just for Admins to respond to?

David

[Vladimir Iliev]

Hi David,

These forums are premium ones - the other members of the community can review/answer the questions posted here, however there is 48h guaranteed response time which means that if the question is not yet answered we will answer it.

Regards,
Vladimir Iliev
Telerik