ASP.NET MVC 生成post表单

Question

我只是在寻找 MVC 中的一个问题，也就是说，我想要 2 个输入文本框，用户将在其中输入行数和列数。 进入后，用户将按下生成按钮，并在下一个操作方法上生成所需数量的文本框。 例如，如果用户输入 2 行 3 列，那么在提交后，第二个表单将包含 6 个表格形式的文本框，最重要的是应该有一个提交按钮，通过它我可以从 POST 中的所有 6 个文本框中获取值行动。

这是我的代码

模型：

    [Required]
    [Display(Name = "Rows")]
    [Range(1, 10, ErrorMessage = "Number of Rows must be between 1 to 10")]
    public int NumberofRows { get; set; }

    [Required]
    [Display(Name = "Columns")]
    [Range(1, 4, ErrorMessage = "Number of Columns must be between 1 to 4")]
    public int NumberofColumns { get; set; }

    public List<int> EnteredNumberRows { get; set; }
    public List<int> EnteredNumberColumns { get; set; }

控制器：

/*Index action is one, in which the number of rows and columns are displayed. After entering number of rows and columns it redirects it to the Enter action containing required number of rows and columns*/
public class HomeController : Controller
{
    DataMineModel homeDataMineModel = new DataMineModel();
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(DataMineModel model)
    {
        TempData["NumofRows"] = model.NumberofRows;
        TempData["NumofColumns"] = model.NumberofColumns;

        return RedirectToAction("Enter");
    }

    public ActionResult Enter()
    {
        homeDataMineModel.EnteredNumberRows = new List<int>((int)TempData["NumofRows"]);
        homeDataMineModel.EnteredNumberColumns = new List<int>((int)TempData["NumofColumns"]);

        return View(homeDataMineModel);
    }

    [HttpPost]
    public ActionResult Enter(DataMineModel viewModel)
    {

        return View();
    }
}

看法：

指数：

@using (Html.BeginForm()) 
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <br />
    <h4>Please enter the number of Rows and Columns.</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.NumberofRows, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.NumberofRows, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.NumberofRows, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.NumberofColumns, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.NumberofColumns, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.NumberofColumns, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Enter" class="btn btn-success" />
        </div>
    </div>
</div>
  }

进入：

@using (Html.BeginForm("Enter", "Home", FormMethod.Post))
{
<div class="row">
    @for (int i = 0; i < Model.EnteredNumberColumns.Capacity; i++)
    {
        <div class="col-md-3">
            <div class="row">
                @for (int k = 0; k < Model.EnteredNumberRows.Capacity; k++)
                {
                    <br />
                        <input type="text" class="form-control" name="name" value="" />
                    <br />
                }
            </div>
        </div>
    }
</div>

     <input type="submit" class="btn btn-success" value="Classify the data"    />
   }

谢谢。

Answer 1

正如罗伯特所建议的，这对 MVC 来说不是问题。 您可以编写一些 JS 来获取用户输入并根据输入生成 HTML 表。 你的 JS 应该有点像：

$("body").on("change", "#coaLevelInput", function () {

        var l = $(this).val();
        var ht= "";
        for (var i = 1; i <= l ; i++)
        {
            ht= ht + "<div .... here you should set your CSS classes'>Code Lenght at Level" + i + "</label><span class=''><input class=''></span></div></div>";

        }
        $("#coaInputs").html(ht);

    });