Как построить объект в форме в виде бритвы

Question

public class MyModel
{
    public int Id { get; set; }
    public string Name { get; set; }
    public MyType MyType { get; set; }
    public IMyConfig MyConfig { get; set; }
}

public enum MyType 
{
    FirstConfig,
    SecondConfig,
    ThirdConfig
}

public interface IMyConfig
{
    string BuildFirstJson();
    string BuildSecondJson();
}

public class FirstConfig : IMyConfig
{
    public string cat { get; set; }
    public string dog { get; set; }
    public string lion { get; set; }

    public string BuildFirstJson()
    {
        ...
    }
    public string BuildSecondJson()
    {
        ...
    }
}

public class SecondConfig : IMyConfig
{
    public string bear { get; set; }
    public int pig { get; set; }
    public string fish { get; set; }
    public string shark { get; set; }
    public string dolphin { get; set; }

    public string BuildFirstJson()
    {
        ...
    }
    public string BuildSecondJson()
    {
        ...
    }
}

//ThirdConfig built similarly 

Итак, я пытаюсь создать форму в виде бритвы, которая может обрабатывать класс MyModel и переключать отображаемые привязки IMyConfig на основе выбранного MyType, например, если FirstConfig выбирается из списка перечислений, затем отображаются текстовые поля FirstProp, SecondProp, ThirdProp, и при отправке формы эти свойства правильно встраиваются в объект FirstConfig и передаются в MyModel как интерфейс IMyConfig.Я понятия не имею, как выполнить эту часть, я планирую использовать jquery .change() для прослушивания переключения в выпадающем списке MyType.Но я не уверен, как справиться с отдельным отображением и автоматическим построением модели (если это имеет смысл).

Если это не имеет смысла, быстрая версия - я пытаюсь создать форму просмотра бритвы дляMyModel и не как приблизиться к свойству MyConfig, которое основано на свойстве MyType.

<form asp-action="ActivityCreateSubmit">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
    <label asp-for="Id" class="control-label"></label>
    <input asp-for="Id" class="form-control" />
    <span asp-validation-for="Id" class="text-danger"></span>
</div>
<div class="form-group" style="display: none;">
    <label asp-for="Name" class="control-label"></label>
    <input asp-for="Name" class="form-control" value="@ViewBag.AppId" />
    <span asp-validation-for="Name" class="text-danger"></span>
</div>
<div class="form-group">
    <label asp-for="MyType" class="control-label"></label>
    <select id="selection" asp-for="MyType" asp-items="Html.GetEnumSelectList<MyType>()">
        <option value="">Select...</option>
    </select>
    <span asp-validation-for="MyType" class="text-danger"></span>
</div>
@switch(Model.MyType)
{
    case FirstConfig:
            <input name="first-input" />
            <input name="second-input" />
            <input name="third-input" />
        break;
    case SecondConfig:
           ... Do something ...
        break;
}
<div class="form-group">
    <input type="submit" value="Create" class="btn btn-default" />
</div>
</form>

Контроллер -

//Ignore ActivityTable, it is a dependency injection.
public ActionResult ActivityCreateSubmit(ActivityTable at, MyModel a)
{
at.AddActivity(a)
return View("../Home/Index");
}
//This is the page I am working on creating
public ActionResult ActivityCreate()
{
    return (View());
}

Answer 1

Я не могу точно понять, в чем ваша проблема, но я думаю, вам нужно следующее (я рад отредактировать ответ, если это не то, что вам нужно).

вы можете проверить выбранное значение вэто перечисление внутри вашей страницы Razor:

<form>
    @switch(Model.MyType)
    {
        case FirstConfig:
                <input name="cat"/>
                <input name="dog" />
                <input name="lion" />
            break;
        case SecondConfig:
               ... Do something ...
            break;
    }
</form>

ОБНОВЛЕНИЕ:

Действие ActivityCreateSubmit должно иметь параметр некоторого типа класса, который вам необходим (FirstConfig).Имя, которое вы дали каждому входу, ДОЛЖНО быть идентичным свойствам в вашем классе FirstConfig, то есть примерно так:

<input name="cat"/>
<input name="dog"/>
<input name="lion"/>

Теперь попробуйте отправить, оно должно работать.