如何使用c#在ASP.NET MVC中在运行时动态添加行?

时间:2015-12-01 12:54:54

标签: c# jquery asp.net asp.net-mvc asp.net-mvc-4

我的模特是:

public partial class transaction
{
    public int transaction_id { get; set; }
    public Nullable<int> transaction_req_no { get; set; }
    public Nullable<System.DateTime> transaction_date { get; set; }
    public Nullable<int> transaction_reqst_by { get; set; }
    public Nullable<int> transaction_priority { get; set; }
    public Nullable<int> transaction_item { get; set; }
    public Nullable<int> transaction_site { get; set; }
    public Nullable<int> transaction_dept { get; set; }
    public Nullable<int> transaction_reqst_status { get; set; }

    public virtual department department { get; set; }
    public virtual item item { get; set; }
    public virtual person person { get; set; }
    public virtual priority priority { get; set; }
    public virtual request request { get; set; }
    public virtual site site { get; set; }
    public virtual status status { get; set; }
}

观点:

 <div class="form-horizontal">
        <h4>transaction</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.transaction_req_no, "transaction_req_no", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.DropDownList("transaction_req_no", null, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.transaction_req_no, "", new { @class = "text-danger" })
            </div>
        </div>

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

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

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


            <div class="form-group">
                @Html.LabelFor(model => model.transaction_item, "transaction_item", htmlAttributes: new { @class = "control-label col-md-2" })

                <div class="col-md-4">
                    @Html.DropDownList("transaction_item", null, htmlAttributes: new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.transaction_item, "", new { @class = "text-danger" })
                </div>
            </div>




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

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

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

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

}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

和控制器是从脚手架生成的。此处不添加其他代码。我想添加多个交易项目。 public Nullable<int> transaction_item { get; set; }脚手架视图会为此生成下拉列表。我需要一个以前能够从前端添加多个项目。

I would like to add this element dynamically.

我看过thisthisthisfirst看起来很有希望,但即使我可以使用jQuery在前端添加元素,我仍然无法获得如何将数据添加到数据库中?

2 个答案:

答案 0 :(得分:1)

使用JQuery创建,然后使用jquery prop InserAfter()并添加新行。

例如:

var r = $("HTML CODE");
$(r).insertAfter($("#BlaBlaBla"));

答案 1 :(得分:1)

就前端而言,您可以看到answer to this。您可以直接使用FormCollection而不是model。然后,您可以将值分配给行:

  

codelen1

     

codelen2

     

codelen3

然后您可以创建一个后端方法来接受formcollection作为参数。在该方法中,您可以按如下方式循环行数:

[HttpPost]
publict ActionResult DynamicRows(FormCollection f)
{
    int i = Convert.ToInt32(f["level"]); // you will set the number of rows added from JQuery
    for (int a = 0; a <= i; a++)
    {
         ABC lvl = new ABC();
         lvl.S1 = a.ToString();
         lvl.N1 = a;
         lvl.N2 = Convert.ToInt32(f["codelen" + a.ToString()]); // here you are getting back the values as codelen1..codelen2..codelen3

         // your other logic comes here... anything you want to do with the data
         WebDb.ABC.Add(lvl);

    }
    WebDb.SaveChanges();
}