いくつかの外部キー ドロップダウンや日付などのフィールドを出力する KendoUI グリッドがあり、何らかの理由で、コントロールがレンダリングされる前後にランダムなテキスト/文字が追加されています。以下のこのブロックで<$Bw$> <$Bx$>は、選択リストがレンダリングされる前に がテキストとしてブラウザに出力され、その後に が続きます<$By$>。
<td role="gridcell" data-container-for="StateProvinceId"><$Bw$>
<!--$Bw$--><$Bx$><span style="" class="k-widget k-dropdown k-header" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-owns="StateProvinceId_listbox" aria-disabled="false" aria-readonly="false" aria-busy="false"><span unselectable="on" class="k-dropdown-wrap k-state-default"><span unselectable="on" class="k-input"> </span><span unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s">select</span></span></span><input data-val="true" data-val-number="The field StateProvinceId must be a number." data-val-required="The StateProvinceId field is required." id="StateProvinceId" name="StateProvinceId" type="text" value="0" data-role="dropdownlist" style="display: none;" data-bind="value:StateProvinceId" class="valid"></span><script>
jQuery(function(){jQuery("#StateProvinceId").kendoDropDownList({"dataSource":[],"dataTextField":"Text","dataValueField":"Value"});});
</script><!--$Bx$--><$By$>
<!--$By$--><span class="field-validation-valid" data-valmsg-for="StateProvinceId" data-valmsg-replace="true"></span></td>
FK エディター テンプレートは単にデフォルトです。
@using Kendo.Mvc.UI
@model object
@(
Html.Kendo().DropDownListFor(m => m)
.BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])
)
これは、KendoUI エディター テンプレートを含むすべてのフィールドがレンダリングされている場合に発生します。
グリッドのコード
@using Kendo.Mvc.UI
@model Data.DataModels.Person
@(Html.Kendo().Grid<Data.ViewModels.LicenseVM>()
.Name("LicensesGrid")
.Columns(columns =>
{
columns.ForeignKey(p => p.StateProvinceId, (System.Collections.IEnumerable)ViewData["StateProvinces"], "StateProvinceId", "Name")
.Title("State");
columns.ForeignKey(p => p.LicenseTypeId, (System.Collections.IEnumerable)ViewData["LicenseTypes"], "LicenseTypeId", "Name")
.Title("Type");
columns.Bound(p => p.LicenseNumber).Width(150);
columns.Bound(p => p.ExpirationDate).Width(150);
columns.Command(commands =>
{
commands.Edit(); // The "edit" command will edit and update data items
commands.Destroy(); // The "destroy" command removes data items
}).Title("").Width(200);
})
.ToolBar(toolBar =>
{
toolBar.Create().Text("Add License");
})
.DataSource(dataSource => dataSource
.Ajax()
.Events(events => events.Error("error_handler"))
.Model(model =>
{
model.Id(p => p.PersonLicenseId);
model.Field(p => p.PersonId).Editable(false).DefaultValue(@Model.PersonId);
})
.Read(read => read.Action("_GetLicenses", "Person", new { PersonId = Model.PersonId }))
.Create(create => create.Action("_AddLicense", "Person"))
.Update(update => update.Action("_EditLicense", "Person"))
.Destroy(destroy => destroy.Action("_DeleteLicense", "Person"))
)
)
<script type="text/javascript">
function errorHandler(e) {
if (e.errors) {
var message = "Errors:\n";
$.each(e.errors, function (key, value) {
if ('errors' in value) {
$.each(value.errors, function () {
message += this + "\n";
});
}
});
alert(message);
}
}
</script>