I have create a custom popup template (First time doing this) And I have 6 fields first three are drop down list and the other two are a text box and two date pickers.
The Text box and date pickers record the data back to the model. But the drop down list data is coming back as null.
So when the Data source calls the Create action, the model that is passed has null values for the drop down list but has the values of the other fields
Here is my View
@(Html.Kendo().Grid<
Portal.Model.DAX.PurchaseShipment
>()
.Name("Shipment")
.Columns(columns =>
{
columns.Bound(c => c.CompanyId).Width(120);
columns.Bound(c => c.VendAccount).Width(120);
columns.Bound(c => c.VendShipId).Width(120);
columns.Bound(c => c.DeliveryMode).Width(120);
columns.Bound(c => c.ShipmentDate).Width(140).Format("{0:MM/dd/yy}");
columns.Bound(c => c.EstimateShipmentDate).Width(140).Format("{0:MM/dd/yy}");
columns.Bound(c => c.SourceOfData).Hidden(true).IncludeInMenu(false);
columns.Bound(c => c.RecVersion).Title("Rec Version").Hidden(true).IncludeInMenu(false);
columns.Bound(c => c.RecId).Title("RecId").Hidden(true).IncludeInMenu(false);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Excel();
})
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ShipmentEditor"))
.Pageable(p => p.PageSizes(true).PageSizes(new int[] { 20, 50, 100, 1000 }))
.Sortable(sortable =>
{
sortable.SortMode(GridSortMode.MultipleColumn);
})
.Filterable()
.Scrollable(scrollable =>
{
scrollable.Enabled(true);
scrollable.Height(450);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(model => model.Id(p => p.CompanyId))
.Read(read => read.Action("PurchaseShipments_Read", "Shipment"))
.Create(create => create.Action("PurchaseShipments_Create", "Shipment"))
.Update(update => update.Action("PurchaseShipments_Update", "Shipment"))
.Destroy(destroy => destroy.Action("PurchaseShipments_Destroy", "Shipment"))
)
)
And Here is my Shipment Editor:
@model Portal.Model.DAX.PurchaseShipment
<
style
>
.cont {
padding-right: 5%;
padding-left: 5%;
margin-right: auto;
margin-left: auto;
padding-bottom: 5px;
}
.editor label {
float: left;
width: 100px;
text-align: right;
}
.editor input[type=text] {
width: 300px;
margin: 0 0 0 10px;
}
</
style
>
<
script
>
function filterByCompany() {
return {
companies: $("#companyDropDownList").val()
};
}
</
script
>
<
div
class
=
"cont"
>
@Html.AntiForgeryToken()
<
div
class
=
"form-horizontal"
>
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.ShipId)
@Html.HiddenFor(model => model.RecVersion)
@Html.HiddenFor(model => model.RecId)
@Html.HiddenFor(model => model.SourceOfData)
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.CompanyId, htmlAttributes: new { @class = "control-label col-md-2" })
@( Html.Kendo().DropDownListFor(model => model.CompanyId)
.Name("companyDropDownList")
.DataTextField("Name")
.DataValueField("Id")
.OptionLabel("Select ship to company...")
.DataSource(s =>
{
s.Read(read =>
{
read.Action("Companies_Read", "Shipment");
});
})
.HtmlAttributes(new { style = "width: 240px"})
)
@Html.ValidationMessageFor(model => model.CompanyId, "", new { @class = "text-danger" })
</
div
>
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.VendAccount, htmlAttributes: new { @class = "control-label col-md-2" })
@( Html.Kendo().DropDownListFor(model => model.VendAccount)
.OptionLabel("Select ship from company...")
.Name("Vendor")
.DataTextField("Name")
.DataValueField("VendId")
.DataSource(s =>
{
s.Read(read =>
{
read.Action("Vendors_Read", "Shipment")
.Data("filterByCompany");
});
})
.Enable(false)
.AutoBind(false)
.CascadeFrom("companyDropDownList")
.HtmlAttributes(new { style = "width: 240px"})
)
@Html.ValidationMessageFor(model => model.VendAccount, "", new { @class = "text-danger" })
</
div
>
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.DeliveryMode, htmlAttributes: new { @class = "control-label col-md-2" })
@(Html.Kendo().DropDownListFor(model => model.DeliveryMode)
.Name("deliveryMode")
.HtmlAttributes(new { style = "width:240px" })
.OptionLabel("Select Carrier...")
.DataTextField("Name")
.DataValueField("Id")
.DataSource(source => {
source.Read(read =>
{
read.Action("DeliveryMode_Read", "Shipment")
.Data("filterByCompany");
});
})
.Enable(false)
.AutoBind(false)
.CascadeFrom("companyDropDownList")
)
@Html.ValidationMessageFor(model => model.DeliveryMode, "", new { @class = "text-danger" })
</
div
>
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.VendShipId, htmlAttributes: new { @class = "control-label col-md-2" })
@(Html.Kendo().TextBoxFor(model => model.VendShipId)
.Name("VendShipId")
.HtmlAttributes(new { style = "width: 240px" })
)
@Html.ValidationMessageFor(model => model.VendShipId, "", new { @class = "text-danger" })
</
div
>
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.ShipmentDate, htmlAttributes: new { @class = "control-label col-md-2" })
@(Html.Kendo().DatePickerFor(model => model.ShipmentDate)
.Name("ShipmentDate")
.HtmlAttributes(new { style = "width:240px" })
)
@Html.ValidationMessageFor(model => model.ShipmentDate, "", new { @class = "text-danger" })
</
div
>
<
div
class
=
"editor form-group"
>
@Html.LabelFor(model => model.EstimateShipmentDate, htmlAttributes: new { @class = "control-label col-md-2" })
@(Html.Kendo().DatePickerFor(model => model.EstimateShipmentDate)
.Name("EstimateShipmentDate")
.HtmlAttributes(new { style = "width:240px" })
)
@Html.ValidationMessageFor(model => model.EstimateShipmentDate, "", new { @class = "text-danger" })
</
div
>
</
div
>
</
div
>