Добавление строк счетов с ASP.NET MVC

Question

Я создаю приложения ASP.NET с технологией MVC 4, и я хочу разрешить конечным пользователям вводить позиции в счет-фактуру. Я хочу, чтобы у пользователя была возможность добавлять столько позиций, сколько они хотят для счета-фактуры, а затем, когда они закончены, чтобы иметь возможность щелкнуть кнопку «Сохранить» в форме, которая затем будет записывать счет-фактуру и все данные позиции базы данных. Может ли кто-нибудь помочь мне справиться с этим?

Answer 1

У вас есть всплывающее окно, где ваши пользователи могут искать позиции и добавлять их. Когда выбрано, запишите ItemId и используйте его для построения строки, возможно, tr или div. Итак, у вас будет tr или div для каждой позиции, которая содержит Id позиции, а затем одно или два текстовых поля. Скажите текстовое поле для количества и другое по цене. Затем либо сделайте сообщение ajax, где вы выполните итерацию всех div, и поместите эту информацию в виде json-данных и разместите их по вашему методу контроллера. Или форматируйте каждый div, где ваша привязка может их собирать и быть отправлена, когда вы выполняете обратную передачу - через кнопку отправки. Это должно заставить вас начать.

Answer 2

Вы хотите что-то вроде this. Но это будет намного сложнее для вашего дела. Используйте jquery для упрощения вашей работы.

$('#add_item').click(function() { 
    $('#invoice_listing tbody') 
     .append(
      "<tr><td>" + $('#item').val() + "</td>" + 
      "<td>" + $('#amount').val() + "</td></tr>" 
     ) 
}); 

На каждой позиции добавляется кнопка [Добавить запись] будет срабатывать событие, чтобы сделать AJAX пост данных элементов строки в контроллер MVC. Затем контроллер выполнит бизнес-логику и сохранит данные позиции в базе данных. Как только транзакция будет успешной, контроллер должен вернуть флаг «успех» в клиентский браузер. Используйте JSON для этого. Ваш javascript должен распознать флаг «успех» и добавить элемент в список товаров.

Затем, наконец, пользователь нажимает кнопку [Сохранить], которая заполняет весь ввод данных счета. Затем вы должны пометить счет-фактуру как успешно введенный.

Постарайтесь не допустить, чтобы пользователь продолжал добавлять позицию без сохранения. Они будут сердиться, если сохранение не удалось после добавления строк элемента.

Answer 3

Так я решил сделать это после того, как несколько других идей подвели меня. Это может показаться странным, но, пожалуйста, несите меня. В качестве основы я использовал MVC Index View.

Прежде чем пользователь даже увидит счет-фактуру, я добавляю новый счет-фактуру в базу данных, чтобы иметь идентификатор счета-фактуры. Затем я показываю вид индекса счета. Но вместо таблицы, показывающей @foreach (var item in Model), я изменил ее на @foreach (var item in Model.LineItems). Теперь он пуст, но после того, как я добавлю некоторые LineItsms, я покажу список LineItems - именно это и есть счет.

Но мы хотим, чтобы иметь возможность добавлять и в наш индексный указатель. Итак, в верхней части индекса, в той части, где вы можете закодировать, создайте новый LineItem и сохраните его LineItem.invoiceID в качестве Model.ID. Затем перед отображением таблицы LineItems добавьте частичный вид - Create LineItem.

Теперь у вас есть список счетов-фактур на странице, где вы можете добавить новые.

Вот некоторый код из индекса Вид LineItem:

@model MyAppName.Models.Invoice 

@{ 
    ViewBag.Title = "Index"; 
    MyAppName.Models.LineItem line = new LineItem(); 
    line.invoiceID = Model.ID; 
} 

<h2>Invoice</h2> 

@Html.Partial("Create", line) 

<table> 
    <tr> 
     <th> 
      @Html.DisplayName("Amount") 
     </th> 
     <th> 
      @Html.DisplayName("Description") 
     </th> 
     <th></th> 
    </tr> 

@foreach (var item in Model.LineItems) 
{ 
    <tr> 
     <td> 
@Html.DisplayFor(modelItem => item.Amount) 
     </td> 

@Html.DisplayFor(modelItem => item.Description 
    </td> 
    <td> 
     @Html.ActionLink("Delete", "DeleteConfirmed", new { id = item.invoiceID }) 
    </td> 
    </tr> 
} 
    <tr> 
     <th>Total</th> 
     <th>R @Model.LineItems.Sum(amt => amt.Amount)</th> 
     <th></th> 
     <th></th> 
    </tr> 
</table> 

А вот как это выглядит (за исключением того, что шахта не была Invoice):