使用模型列表创建记录

时间:2014-09-30 17:47:51

标签: asp.net-mvc razor asp.net-mvc-viewmodel

我正在尝试创建发票。我有两个型号Invoice& InvoiceItems

我可以使用硬编码值插入,但我希望能够使用TextBoxes动态创建发票。如何使用相同的视图插入记录,该记录将发票的数据和发票项目中的动态数据插入到两个表中?我希望最终有一个添加更多按钮,我可以留在同一页面上并继续将项目添加到同一张发票中。你可以看到我到目前为止所尝试的内容。

发票型号:

public class Invoice
{
    [Key]
    public int InvoiceId { get; set; }
    public int ClientId { get; set; }
    [Display(Name = "Amount")]
    public decimal Amount { get; set; }
    [Display(Name = "Invoice Creation Date")]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:MM/dd/yyyy}")]
    public DateTime CreationDate { get; set; }
    [Display(Name = "Invoice Due Date")]
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:MM/dd/yyyy}")]
    public DateTime DueDate { get; set; }
    [Display(Name = "Notes")]
    public string InvoiceNotes { get; set; }

    public List<InvoiceDetails> InvoiceDetails { get; set; } 
    public List<Clients> Clients { get; set; } 
}

InvoiceItem模型:

public class InvoiceDetails
{
    [Key]
    public int InvoiceDetailsId { get; set; }
    public int InvoiceId { get; set; }
    [DisplayName("Item Name")]
    public string Name { get; set; }
    [DisplayName("Item Note")]
    public string Note { get; set; }
    [DisplayName("Qty")]
    public decimal? Quantity { get; set; }
    [DisplayName("Rate/Hour")]
    public decimal? Price { get; set; }
    [DisplayName("Item Total")]
    public decimal? Total { get; set; }
}

发票控制器:

private NovaDb _db = new NovaDb();
public ActionResult InvoiceInformation()
    {
        var invoice = new Invoice();

        invoice.InvoiceDetails = new List<InvoiceDetails>();

        return View(invoice);
    }

    [HttpPost]
    public ActionResult InvoiceInformation(Invoice model)
    {
        if (ModelState.IsValid)
        {
            var invoices = new Invoice()
            {
                Amount = model.Amount,
                CreationDate = model.CreationDate,
                DueDate = model.DueDate,
                InvoiceNotes = model.InvoiceNotes,
                InvoiceId = model.InvoiceId,
                ClientId = model.ClientId                    
            };

            _db.Invoices.Add(invoices);
            _db.SaveChanges();
            return RedirectToAction("Index");
        }

        return View(model);
    }

发票查看:

@model NovaFinancial.Models.Invoice

@{
ViewBag.Title = "InvoiceInformation";
}

<h2>InvoiceInformation</h2>

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

<fieldset>
    <legend>Invoice</legend>

    @Html.HiddenFor(model => model.InvoiceId)

    <div class="editor-label">
        @Html.LabelFor(model => model.ClientId)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.ClientId)
        @Html.ValidationMessageFor(model => model.ClientId)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Amount)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Amount)
        @Html.ValidationMessageFor(model => model.Amount)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.CreationDate)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.CreationDate)
        @Html.ValidationMessageFor(model => model.CreationDate)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.DueDate)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.DueDate)
        @Html.ValidationMessageFor(model => model.DueDate)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.InvoiceNotes)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.InvoiceNotes)
        @Html.ValidationMessageFor(model => model.InvoiceNotes)
    </div>

    <div>
        <table>
            <tr>
                <th>Name</th>
                <th>Notes</th>
                <th>Qty</th>
                <th>Price</th>
                <th>Total</th>
            </tr>
            @for (int i = 0; i < Model.InvoiceDetails.Count; i++)
            {
                @Html.HiddenFor(m=>m.InvoiceDetails[i].Name)    
                @Html.HiddenFor(m=>m.InvoiceDetails[i].Note) 
                @Html.HiddenFor(m=>m.InvoiceDetails[i].Quantity) 
                @Html.HiddenFor(m=>m.InvoiceDetails[i].Price) 
                @Html.HiddenFor(m=>m.InvoiceDetails[i].Total) 
                <tr>
                    <td>@Html.DisplayFor(m=>m.InvoiceDetails[i].Name) | @Html.TextBoxFor(m=>m.InvoiceDetails[i].Name)</td>
                    <td>@Html.DisplayFor(m=>m.InvoiceDetails[i].Note) | @Html.TextBoxFor(m=>m.InvoiceDetails[i].Note)</td>
                    <td>@Html.DisplayFor(m=>m.InvoiceDetails[i].Quantity) | @Html.TextBoxFor(m=>m.InvoiceDetails[i].Quantity)</td>
                    <td>@Html.DisplayFor(m=>m.InvoiceDetails[i].Price) | @Html.TextBoxFor(m=>m.InvoiceDetails[i].Price)</td>
                    <td>@Html.DisplayFor(m=>m.InvoiceDetails[i].Total) | @Html.TextBoxFor(m=>m.InvoiceDetails[i].Total)</td>
                </tr>
            }                
        </table>
    </div>

    <p>
        <input type="submit" value="Save" />
    </p>
</fieldset>
}

1 个答案:

答案 0 :(得分:0)

我制定了一个可能不是最好的“解决方案”,但它确实有效。您仍然需要添加代码以使其更加健壮,但是通用框架就在那里。

在您的视图中,将发票明细(名称,数量,价格)的所有文本框保留为name属性的相同值,但请确保ID唯一。我使用了一些jQuery和JavaScript来根据用户点击的按钮生成额外的行。例如,

<input type="text" name="Name" id="Name"> <!--first line item for Item Name-->
<input type="number" name="Quantity" id="Quantity"> <!--first for Quanitity -->

<input type="text" name="Name" id="Name2"> <!--second line item for Item Name-->
<input type="number" name="Quantity" id="Quantity2"> <!-- second for Quanitity -->

InvoiceDetail行的值将以逗号分隔的字符串传递回服务器(最好确保您的项目名称没有逗号!)。在服务器端,

var Names = Request["Name"]; // this would yield something like "Labor,Parts"

在控制器中,您需要将字符串解析为数组并从中创建InvoiceDetail的实例。我编写了一个私有方法来拆分字符串并将一个InvoiceDetail对象列表返回给action方法。您有责任验证此数据:客户端和服务器端都需要验证。

我做了一些实验。您可以在此处查看所有代码:http://mefixme.blogspot.com/2014/10/aspnet-mvc-how-to-add-model-with.html

我希望这会对你有所帮助。