具有复杂 ASP.NET Core 模型的 Html 表单

问题描述 投票:0回答:1

我有一个复杂的模型,我想填充它并将其发送到控制器来存储它。问题是,由于模型是递归的,我无法做到这一点,有谁知道如何做到这一点。

这是模型类:

public class TowerMeasureModel
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Tower { get; set; }
    public DateTime LaunchDateTime { get; set; }
    public DateTime ScheduledDateTime { get; set; }
    public DateTime EndDateTime { get; set; }
    public SetupModel Setup { get; set; }
    public TVList selectionDetails { get; set; }
    public int LaunchType { get; set; }
    public int Calib_Standard { get; set; }
    public int Calib_Band { get; set; }
    public int Calib_Setup { get; set; }
    public int Status { get; set; }

    public static readonly int MEASUREMENT = 0;
    public static readonly int CALIBRATION = 1;
    public static readonly int CALIB_ISDB = 10;
    public static readonly int CALIB_DVB = 11;
    public static readonly int CALIB_TER = 12;
    public static readonly int CALIB_SAT = 13;
    public static readonly int CALIB_SETUP_OPT1 = 14;
    public static readonly int CALIB_SETUP_OPT2 = 15;
    public static readonly int CALIB_SETUP_OPT3 = 16;
    public static readonly int CALIB_SETUP_OPT4 = 17;
    public static readonly int STATUS_WAITING = 20;
    public static readonly int STATUS_STARTED = 21;
    public static readonly int STATUS_PAUSED = 22;
    public static readonly int STATUS_ABORTED = 23;
    public static readonly int STATUS_FINISHED = 24;
}

其中

TVList
参数是以下项目的列表:

public abstract class TVItem
{
    [Key]
    public string Name { get; set; }
    public TVItem Parent { get; set; }
    public List<TVItem> Children { get; set; }
    public bool IsSelected { get; set; } = false;
}

正如您所观察到的,父级是递归的,这会导致表单出现问题。

表格如下:

<form method="post" id="pageForm" action="/Launch/Home/retrieveSelection">

    <aside>
        <div>
            <input type="radio" id="Calibration" name="LaunchType" value=1 />
            <label for="Calibration">Calibration</label>
            <hr />
            <input type="radio" id="Measurement" name="LaunchType" value=0 checked="checked"/>
            <label for="Measurement">Measurement</label>
            <hr />
            <label for="LaunchName">Name this run:</label> 
            <input type="text" id="LaunchName" name="LaunchName" value="@DateTime.Now.ToString().Replace(" ","_").Replace("/","").Replace(":","")" />
            <hr />
        </div>
        <a class="nav-link text-dark" asp-area="LaunchArea" asp-controller="Home" asp-action="Load">Load</a>
        <a class="nav-link text-dark" asp-area="LaunchArea" asp-controller="Home" asp-action="Save">Save</a>
        <a class="nav-link text-dark" asp-area="LaunchArea" asp-controller="Home" asp-action="Reset">Reset</a>
        <input type="submit" class="myULclass" id="myButton" value="Send Run"/>
    </aside>

    <article>

        <h2>Measurements</h2>

        <div style="height:450px ; overflow-y:scroll">
            <input type="hidden" name="Id" value="1234" />
            <ul>
                @{
                    foreach (TVStandard tvstandard in Model.selectionDetails.StandardsList) {
                        int index = Model.selectionDetails.StandardsList.IndexOf(tvstandard);
                        <li>
                            <input type="hidden" name="selectionDetails.StandardsList[@index].folderName" value="@tvstandard.folderName" />
                            <span class="caret"></span>
                            <input type="checkbox" class="checker" id="@tvstandard.Name" name="selectionDetails.StandardsList[@index].IsSelected" value="true">
                            <label for="@tvstandard.Name">@tvstandard.Name</label>
                            <ul class="nested">
                                @{
                                    foreach (TVSection tvsection in tvstandard.Children) {
                                        int index2 = tvstandard.Children.IndexOf(tvsection);
                                        <li>
                                            <input type="hidden" name="selectionDetails.StandardsList[@index].Children[@index2].scriptName" value="@tvsection.scriptName" />
                                            <span class="caret"></span>
                                            <input type="checkbox" class="checker" id="@tvsection.Name" name="selectionDetails.StandardsList[@index].Children[@index2].IsSelected" value="true">
                                            <label for="@tvsection.Name">@tvsection.Name</label>
                                            <ul class="nested">
                                                @{
                                                    foreach (TVMode tvmode in tvsection.Children) {
                                                        int index3 = tvsection.Children.IndexOf(tvmode);
                                                        <li>
                                                            <input type="hidden" name="selectionDetails.StandardsList[@index].Children[@index2].Children[@index3].Name" value="@tvmode.Name" />
                                                            <span class="caret"></span>
                                                            <input type="checkbox" class="checker" id="@tvmode.Name" name="selectionDetails.StandardsList[@index].Children[@index2].Children[@index3].IsSelected" value="true">
                                                            <label for="@tvmode.Name">@tvmode.Name</label>
                                                            <ul class="nested">
                                                                @{
                                                                    foreach (TVFreq tvfreq in tvmode.Children) {
                                                                        int index4 = tvmode.Children.IndexOf(tvfreq);
                                                                        <li>
                                                                            <input type="hidden" name="selectionDetails.StandardsList[@index].Children[@index2].Children[@index3].Children[@index4].ID" value="@tvfreq.ID" />
                                                                            <input type="checkbox" class="checker" id="@tvfreq.Name" name="selectionDetails.StandardsList[@index].Children[@index2].Children[@index3].Children[@index4].IsSelected" value="true">
                                                                            <label for="@tvfreq.Name">@tvfreq.Name</label>
                                                                        </li>
                                                                    }
                                                                }
                                                            </ul>
                                                        </li>
                                                    }
                                                }
                                            </ul>
                                        </li>
                                    }
                                }
                            </ul>
                        </li>
                    }
                }
            </ul>
        </div>

        <hr />

        <h2>Calibration</h2>

        <select style="font-size:medium" form="pageForm" name="Calib_Standard">
            <option value=10>ISDB</option>
            <option value=11>DVB</option>
        </select>
        <select style="font-size:medium" form="pageForm" name="Calib_Band">
            <option value=12>Terrestrial</option>
            <option value=13>Satellite</option>
        </select>
        <select style="font-size:medium" form="pageForm" name="Calib_Setup">
            <option value=14>Option 1</option>
            <option value=15>Option 2</option>
            <option value=16>Option 3</option>
            <option value=17>Option 4</option>
        </select>
    </article>
</form>

关于如何检索表格有什么建议吗?

html forms asp.net-core model asp.net-core-mvc
1个回答
0
投票

要提交复杂或递归模型表单,您可以使用 JavaScript 和 JSON。通过使用JS,您可以从表单中提取数据,然后发出ajax请求将数据提交到服务器端。

下面是示例代码,您可以使用它来做到这一点:

document.getElementById('myButton').addEventListener('click', function(event) {
    event.preventDefault();

    var model = buildJSONObjectFromForm(); 
    fetch('/Launch/Home/RetrieveSelection', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'RequestVerificationToken' : document.querySelector('input[name="__RequestVerificationToken"]').value  
        },
        body: JSON.stringify(model),
    })
    .then(response => response.json())
    .then(data => {
        // Handle the response data
    })
    .catch((error) => {
        // Handle errors
    });
});

控制器:

[HttpPost]
[ValidateAntiForgeryToken] // Include this if you're using ASP.NET's anti-forgery token
public ActionResult RetrieveSelection([FromBody] TowerMeasureModel model)
{
    // Your code to handle the model saving it to the database

    // Return a JSON response or other required action result
    return Json(new { success = true, message = "Data received" });
}
© www.soinside.com 2019 - 2024. All rights reserved.