Я думаю, что режим редактирования всплывающего окна — самый приятный из режимов редактирования, но с более крупной моделью всплывающее окно становится очень длинным, что выглядит не очень хорошо.
Я нашел решение для этого, и мне любопытны ваши идеи/отзывы/улучшения для этого решения.
Я создал два пользовательских атрибута:
public class NumberOfColumnsAttribute : Attribute, IMetadataAware
{
private readonly int _numberOfColumns;
public NumberOfColumnsAttribute(int numberOfColumns)
{
_numberOfColumns = numberOfColumns;
}
public void OnMetadataCreated(ModelMetadata metadata)
{
if (!metadata.AdditionalValues.ContainsKey("NumberOfColumns"))
{
metadata.AdditionalValues.Add("NumberOfColumns", _numberOfColumns);
}
}
}
public class ShowInColumnAttribute : Attribute, IMetadataAware
{
private readonly int _column;
public ShowInColumnAttribute(int column)
{
_column = column;
}
public void OnMetadataCreated(ModelMetadata metadata)
{
if (!metadata.AdditionalValues.ContainsKey("ShowInColumn"))
{
metadata.AdditionalValues.Add("ShowInColumn", _column);
}
}
}
Затем используйте атрибут [NumberOfColumns(m)] над моделью редактирования и атрибут [ShowInColumn(n)] над свойством (при отсутствии атрибута предполагается n=1). применяется).
Я создал файл Object.cshtml в Views/Shared/EditorModels/ следующим образом.
@if (ViewData.TemplateInfo.TemplateDepth > 1)
{
@ViewData.ModelMetadata.SimpleDisplayText
} else {
for (var i = 1; i <= (int)(!ViewData.ModelMetadata.AdditionalValues.ContainsKey("NumberOfColumns") ? 1 : ViewData.ModelMetadata.AdditionalValues["NumberOfColumns"]);i++)
{
<div class="editor-column">
@foreach (var prop in ViewData.ModelMetadata.Properties.Where(pm => pm.ShowForEdit && !ViewData.TemplateInfo.Visited(pm) && ((int)(!pm.AdditionalValues.ContainsKey("ShowInColumn") ? 1 : pm.AdditionalValues["ShowInColumn"])) == i))
{
if (prop.HideSurroundingHtml) {
@Html.Editor(prop.PropertyName)
} else {
<div class="editor-label">
@Html.Label(prop.PropertyName)
@(prop.IsRequired ? "*" : "")
</div>
<div class="editor-field">
@Html.Editor(prop.PropertyName)
@Html.ValidationMessage(prop.PropertyName, "*")
</div>
}
}
</div>
}
<div class="editor-seperator"></div>
}
И следующие строки CSS:
.k-edit-form-container {
width: auto;
}
.editor-column {
width: 400px;
float: left;
}
.editor-seperator {
clear: both;
}
Как вы думаете?