ASP.NET MVC，引导表，获取每一列的值 [英] ASP.NET MVC, Bootstrap Tables, get values for each column

问题描述

在ASP.NET MVC中，我有一个操作，它接受用户有关行和列的输入，然后导航到该操作，该操作根据用户输入生成所需的行和列数，如下所示:-

In ASP.NET MVC, I've an action which takes user input about rows and columns and then it navigates to the action which generates required number of rows and columns based on the user input as shown below:-

观看次数:

<div class="container" style='width:@(240 * Model.Columns.Capacity)px;overflow-y:auto'>
<div class="row">
    @using (Html.BeginForm())
    {
        <table style='width:100%' class='table table-condensed'>
            <tbody>
                @for (int k = 0; k < Model.Rows.Capacity; k++)
                {
                    <tr>
                        @for (int i = 0; i < Model.Columns.Capacity; i++)
                        {
                            <td>
                                @Html.TextBox("name" + k + i, null, new { @class = "form-control" })
                            </td>
                        }
                    </tr>
                }
            </tbody>
        </table>

        <input type="submit" name="name" value="Submit" class="btn btn-primary" />
    }
</div>

进入后.

http://i.stack.imgur.com/lxhOM.png

在发布动作中，我有一个表单集合，以便使用表单集合在发布动作中获取填充的数据.在后操作中，我使用foreach循环获取每个输入字段的值.

In the post action, I've a form collection in order to get the filled data in the post action using a form collection. In the post action I get the values for each input field using a foreach loop.

    [HttpPost]
    public ActionResult Enter(FormCollection form)
    {
        for (int i = 0; i < form.Count; i++)
        {
            Debug.WriteLine(form[i]);
        }
        return View();
    }

我只想知道如何在post操作中获取单个列的所有值并逐列获取它们，默认情况下它会水平获取值.

I just want to know that how to get all the values of a single column in the post action and get them column by columns, by default it gets the values of horizontally.

谢谢. http://i.stack.imgur.com/SBMvY.png

推荐答案

创建表示您要显示/编辑的视图的模型

Create view models that represent what you want to display/edit

public class TableVM
{
  public TableVM()
  {
    Rows = new List<RowVM>();
  }
  public TableVM(int rows, int columns) : this()
  {
    for(int i = 0; i < rows; i++)
    {
      Rows.Add(new RowVM(columns));
    }
  }
  public List<string> Headers { get; set; } // for columns headers
  public List<RowVM> Rows { get; set; }
}
public class RowVM
{
  public RowVM()
  {
    Cells = new List<CellVM>();
  }
  public RowVM(int columns) : this()
  {
    for(int i = 0; i < columns; i++)
    {
      Cells.Add(new CellVM());
    }
  }
  public List<CellVM> Cells { get; set; }
}
public class CellVM
{
  public string Value { get; set; }
}

，然后在GET方法中，初始化一个新的TableVM并将其返回到视图

and in the GET method, initialize a new TableVM and return it to the view

TableVM model = new TableVM(5, 5); // 5 x 5 grid
model.Headers = new List<string>{ "col 1", "col 2", "col 3", col 4", "col 5" };
return View(model);

查看

@model TableVM
....
<table>
  <thead>
    <tr>
      @foreach(string header in Model.Headers)
      {
        <th>@header</th>
      }
    </tr>
  </thead>
  <tbody>
    @for(int r = 0; r < Model.Rows.Count; r++)
    {
      <tr>
        for (int c = 0; c < Model.Rows[r].Cells.Count; c++)
        {
          <td>@Html.TextBoxFor(m => m.Rows[r].Cells[c].Value</td>
        }
      </tr>
    }
  </tbody>
</table>

然后将您的POST方法更改为接受模型

Then change you POST method to accept the model

[HttpPost]
public ActionResult Enter(TableVM model)

您现在可以使用索引器访问每一行/列，例如model.Rows[1].Cells[2].Value将返回第二行中第三列的值

You can now access each row/column using indexers, for example model.Rows[1].Cells[2].Value will return the value of the 3rd column in the second row

这篇关于ASP.NET MVC，引导表，获取每一列的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！