Asked by:
How to save with an Editable Orders Table

Question
-
User-1381715179 posted
Hi,
I would like help on the my Order request form with order details to which I have added an editable table with which I don't have experience but I would like to calculate the total and save records on the form together with the Order details to the same database table. Below is the code to the View , Model and Controller minus the code to save table contents on the view (ShoppingCartRequest), I have failed to upload images but try that link.
Thanks.
C:\Task Order Database Project\TastOrder Queries\FormView.jpg
//View for the shoppingCartRequest form. @model Engineering_TaskOrder_App.Models.ShoppingCartRequest @{ ViewBag.Title = "Create"; } <hr /> @*Stylesheet link file for this form.*@ <link href="~/Styles/NewFormStyle.css" rel="stylesheet" /> @*Link to the UN Logo and the form Name to the center of the form.*@ <img src="~/Images/UN-LOGO-Blue.png" alt="UN Logo" class="center" /> <h2 style="text-align:center">UNSOS SHOPPING CART REQUEST FORM</h2> @using (Html.BeginForm()) { @Html.AntiForgeryToken() <hr /> //Display the first row of field controls with their names (Project Number, Purchase Order, Date and Name Of Requestor) <table class="table-responsive"> <tr> <td> <label>Project Number: </label> @Html.EditorFor(model => model.ProjectNumber, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.ProjectNumber, "", new { @class = "text-danger" }) </td> <td> <label>Purchase Order: </label> @Html.EditorFor(model => model.PurchaseOrderNumber, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.PurchaseOrderNumber, "", new { @class = "text-danger" }) </td> <td> <label>Date: </label> @Html.EditorFor(model => model.SC_Date, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SC_Date, "", new { @class = "text-danger" }) </td> <td> <label>Name of Requestor: </label> @Html.EditorFor(model => model.NameOfRequestor, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.NameOfRequestor, "", new { @class = "text-danger" }) </td> </tr> </table> <br /> //Display the second row of field controls with their names (Contact Person, Phone Number, Type of Requirement and Date Required fields) <table class="table-responsive"> <tr> <td> <label>Contact Person:</label> @Html.EditorFor(model => model.Section_Contact_Person, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Section_Contact_Person, "", new { @class = "text-danger" }) </td> <td> <label>Phone Number:</label> @Html.EditorFor(model => model.Phone_Number, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Phone_Number, "", new { @class = "text-danger" }) </td> <td> <label>Type of Requirement:</label> @Html.EditorFor(model => model.Type_Of_Requirement, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Type_Of_Requirement, "", new { @class = "text-danger" }) </td> <td> <label>Date Required:</label> @Html.EditorFor(model => model.SC_Date_Required, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SC_Date_Required, "", new { @class = "text-danger" }) </td> </tr> </table> <br /> //Display the third row of field controls with their names (Justification, Priority, Justification IOR and Specs, SOW, BoQ, Attached? checkbox.) <table class="table-responsive"> <tr> <td> <label>Justification:</label> @Html.EditorFor(model => model.SC_Justification, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SC_Justification, "", new { @class = "text-danger" }) </td> <td> <label>Priority:</label> @Html.EditorFor(model => model.Priority, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Priority, "", new { @class = "text-danger" }) </td> <td> <label>Justification IOR:</label> @Html.EditorFor(model => model.SC_IOR_Justification, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SC_IOR_Justification, "", new { @class = "text-danger" }) </td> <td> <label>Specs, SOW, BoQ, Attached?</label> <input type="checkbox" id="Specifications_Drawings_attached" onclick="myFunction" /> </td> </tr> </table> <br /> //Display the fourth row of field controls with their names (Specs. Attachements and Delivery Address.) <table class="table-responsive"> <tr> <td> <label>Specs. Attachements</label> @Html.EditorFor(model => model.Specifications_Attached, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Specifications_Attached, "", new { @class = "form-control-static", disabled = "disabled" }) </td> <td> <label>Delivery Address</label> <textarea id="Delivery_Address" class="form-control" style="width:6500px"></textarea> </td> </tr> </table> <br /> //Display the fifth area purchase order table (S/N. Requisition/Line Description, Quantity, Unit Price, Currency SubTotal and Total fields.) <table class="table table-bordered"> <tr> <th><label>S/N</label></th> <th><label>Requisition/Description</label></th> <th><label>Quantity</label></th> <th><label>Unit Price</label></th> @*<th>@Html.LabelFor(model => model.Currency_USD, htmlAttributes: new { @class = "control-label col-md-2" })</th>*@ <th><label>Total USD</label></th> </tr> <tr> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.SerialNo, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SerialNo, "", new { @class = "text-danger" })*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.Requisition_Line_Description, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Requisition_Line_Description, "", new { @class = "text-danger" })*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.Quantity, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Quantity, "", new { @class = "text-danger" })*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.Unit_Price, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Unit_Price, "", new { @class = "text-danger" })*@ </td> @*<td> @Html.EditorFor(model => model.Currency_USD, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Currency_USD, "", new { @class = "text-danger" }) </td>*@ <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.Total_USD, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Total_USD, "", new { @class = "text-danger" })*@ @*@{ if (Model.Quantity != null) { if (Model.Unit_Price != null) { Model.Total_USD = (Model.Quantity * Model.Unit_Price); } } }*@ </td> </tr> @*</table> <table class="table-responsive">*@ <tr> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="description" size="15" maxlength="40" value="" />*@ @*@Html.EditorFor(model => model.SerialNo, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.SerialNo, "", new { @class = "text-danger" })*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="description" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="description" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="description" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="description" size="15" maxlength="40" value="" />*@ </td> </tr> <tr> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="quantity" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="quantity" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="quantity" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="quantity" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="quantity" size="15" maxlength="40" value="" />*@ </td> </tr> <tr> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="unitPrice" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="unitPrice" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="unitPrice" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="unitPrice" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="unitPrice" size="15" maxlength="40" value="" />*@ </td> </tr> <tr> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="subtotal" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="subtotal" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="subtotal" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="subtotal" size="15" maxlength="40" value="" />*@ </td> <td class="pt-3-half" contenteditable="true"> @*<input style="text-align:right;" type="text" name="total" id="subtotal" size="15" maxlength="40" value="" />*@ </td> </tr> <tr> <td></td> <td></td> <td></td> <td align='right'><b>Total</b></td> <td> <input style="text-align:right;" type="text" name="total" id="total" size="15" maxlength="40" value="" /> </td> </tr> </table> <div class="col-md-offset-6 col-md-10 text-right"> <input type="button" id="btn_save" value="Save" class="btn btn-default" style="padding:5px 20px; width:180px; color:green" /> <input type="button" id="sum" value="Order Total" class="btn btn-default" style="padding:5px 20px; width:180px; color:green" /> <input type="text" id="total" style="padding:5px 23px"/> </div> <br /> //Display Requirement was Budgeted?, Funds Available?, Redeployment of Funds?, System Contract?, Local Contract? checkboxes and Account Number field. <table> <tr> <td> <label>Requirement was Budgeted?</label> <input type="checkbox" id="Requirement_was_Budgeted" onclick="model => model.Requirement_was_Budgeted" /> </td> <td> <label>Funds Available?</label> <input type="checkbox" id="Funds_Available" onclick="model => model.Funds_Available" /> </td> <td> <label>Redeployment of Funds?</label> <input type="checkbox" id="Redeployment_of_Funds" onclick="model => model.Redeployment_of_Funds" /> </td> <td> <label>System Contract?</label> <input type="checkbox" id="System_Contract" onclick="model => model.System_Contract" /> </td> <td> <label>Local Contract?</label> <input type="checkbox" id="Local_Contract" onclick="model => model.Local_Contract" /> </td> <td> <label>Account Number:</label> @Html.EditorFor(model => model.Account_, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Account_, "", new { @class = "text-danger" }) </td> </tr> </table> <br /> //Code to render the Balance, Source Account, Destination Account and Amount fields on a single row. <table class="table-responsive"> <tr> <td> <label>Balance:</label> @Html.EditorFor(model => model.Balance_, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Balance_, "", new { @class = "text-danger" }) </td> <td> <label>Source Account:</label> @Html.EditorFor(model => model.Source_Account__, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Source_Account__, "", new { @class = "text-danger" }) </td> <td> <label>Destination Account:</label> @Html.EditorFor(model => model.Destination_Account_, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Destination_Account_, "", new { @class = "text-danger" }) </td> <td> <label>Amount:</label> @Html.EditorFor(model => model.Amount, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Amount, "", new { @class = "text-danger" }) </td> </tr> </table> <br /> //Code to render the Contract# and Approved checkbox on the same row. <table class="table-responsive"> <tr> <td> <label>Contract#</label> @Html.EditorFor(model => model.Contract__, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.Contract__, "", new { @class = "text-danger" }) </td> <td> <label>Approved</label> <input type="checkbox" id="Approved" onclick="model => model.Approved" /> @*@Html.EditorFor(model => model.Approved) @Html.ValidationMessageFor(model => model.Approved, "", new { @class = "text-danger" })*@ </td> </tr> </table> //Button to save entries from the form to the database and the button to display the list of the saved Shopping Cart Requests all rendered on the same row. <div> <p><input type="submit" value="Create" class="btn btn-default" style="text-align:center; width:200px; color:green" /></p> @*<p><input type="submit" class="btn btn-default" href="http://localhost:5213/ShoppingCartRequests/Details" style="text-align:center; width:200px"</input></p>*@ </div> <div class="col-md-4"> <p><input type="submit" value="<< Back to List" class="btn btn-default" href="http://localhost:5213/Contracts/Details" style="text-align:center; width:200px; color:green" /></p> </div> <br /> } <link href="~/Content/bootstrap.min.css" rel="stylesheet" /> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" /> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script src="~/Scripts/myScripts.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script> $(document).on('click', '.btn_save', function (event) { var row_id = random_id(); event.preventDefault(); var tbl_row = $(this).closest('tr'); var row_id = tbl_row.attr('row_id'); //make the whole row editable tbl_row.find('.row_data') .attr('edit_type', 'click') .removeClass('bg-warning') .css('padding', '') //--->get row data > start var arr = {}; tbl_row.find('.row_data').each(function (index, val) { var col_name = $(this).attr('col_name'); var col_val = $(this).html(); arr[col_name] = col_val; }); //--->get row data > end //use the "arr" object for your ajax call $.extend(arr, { row_id: row_id }); //out put to show $('.post_msg').html('<pre class="bg-success">' + JSON.stringify(arr, null, 2) + '</pre>') }); //--->save whole row entry > end </script> <style> span.error { display: block; visibility: hidden; color: red; font-size: 90%; } tr.error { background-color: rgba(255,0,0,0.35); } </style> //ShopingCart Model. namespace UNSOS_Engineering_TaskOrder_App.Models { using System; using System.Collections.Generic; public partial class ShoppingCartRequest { [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")] public ShoppingCartRequest() { this.TaskOrders = new HashSet<TaskOrder>(); } public int SC_RequestNo { get; set; } public Nullable<int> PurchaseOrderID { get; set; } public string ProjectNumber { get; set; } public string PurchaseOrderNumber { get; set; } public Nullable<System.DateTime> SC_Date { get; set; } public string NameOfRequestor { get; set; } public string Section_Contact_Person { get; set; } public string Phone_Number { get; set; } public string Type_Of_Requirement { get; set; } public Nullable<System.DateTime> SC_Date_Required { get; set; } public string SC_Justification { get; set; } public string Priority { get; set; } public string SC_IOR_Justification { get; set; } public string Delivery_Address { get; set; } public Nullable<bool> Specifications_Drawings_attached { get; set; } public string Specifications_Attached { get; set; } public Nullable<int> SerialNo { get; set; } public string Requisition_Line_Description { get; set; } public Nullable<decimal> Quantity { get; set; } public Nullable<decimal> Unit_Price { get; set; } public Nullable<decimal> Currency_USD { get; set; } public Nullable<decimal> Total_USD { get; set; } public Nullable<bool> Requirement_was_Budgeted { get; set; } public Nullable<bool> Funds_Available { get; set; } public Nullable<bool> Redeployment_of_Funds { get; set; } public Nullable<bool> System_Contract { get; set; } public Nullable<bool> Local_Contract { get; set; } public string Account_ { get; set; } public string Balance_ { get; set; } public string Source_Account__ { get; set; } public string Destination_Account_ { get; set; } public Nullable<decimal> Amount { get; set; } public string Contract__ { get; set; } public Nullable<bool> Approved { get; set; } public virtual PurchaseOrder PurchaseOrder { get; set; } [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")] public virtual ICollection<TaskOrder> TaskOrders { get; set; } } } //ShoppingCart Controller minus the method to save table records on the form. using System; using System.Collections.Generic; using System.Data; using System.Data.Entity; using System.Linq; using System.Net; using System.Web; using System.Web.Mvc; using UNSOS_Engineering_TaskOrder_App.Models; namespace UNSOS_Engineering_TaskOrder_App.Controllers { public class ShoppingCartRequestsController : Controller { private TaskOrderEntities db = new TaskOrderEntities(); // GET: ShoppingCartRequests public ActionResult Index() { var shoppingCartRequests = db.ShoppingCartRequests.Include(s => s.PurchaseOrder); return View(shoppingCartRequests.ToList()); } // GET: ShoppingCartRequests/Details/5 public ActionResult Details(int? id) { if (id == null) { return new HttpStatusCodeResult(HttpStatusCode.BadRequest); } ShoppingCartRequest shoppingCartRequest = db.ShoppingCartRequests.Find(id); if (shoppingCartRequest == null) { return HttpNotFound(); } return View(shoppingCartRequest); } // GET: ShoppingCartRequests/Create public ActionResult Create() { ViewBag.PurchaseOrderID = new SelectList(db.PurchaseOrders, "PurchaseOrderID", "PurchaseOrderNumber"); return View(); } // POST: ShoppingCartRequests/Create [HttpPost] [ValidateAntiForgeryToken] public ActionResult Create([Bind(Include = "SC_RequestNo,PurchaseOrderID,ProjectNumber,PurchaseOrderNumber,SC_Date,NameOfRequestor,Section_Contact_Person,Phone_Number,Type_Of_Requirement,SC_Date_Required,SC_Justification,Priority,SC_IOR_Justification,Delivery_Address,Specifications_Drawings_attached,Specifications_Attached,SerialNo,Requisition_Line_Description,Quantity,Unit_Price,Currency_USD,Total_USD,Requirement_was_Budgeted,Funds_Available,Redeployment_of_Funds,System_Contract,Local_Contract,Account_,Balance_,Source_Account__,Destination_Account_,Amount,Contract__,Approved")] ShoppingCartRequest shoppingCartRequest) { if (ModelState.IsValid) { db.ShoppingCartRequests.Add(shoppingCartRequest); db.SaveChanges(); return RedirectToAction("Index"); } ViewBag.PurchaseOrderID = new SelectList(db.PurchaseOrders, "PurchaseOrderID", "PurchaseOrderNumber", shoppingCartRequest.PurchaseOrderID); return View(shoppingCartRequest); } [HttpPost] // GET: ShoppingCartRequests/Edit/5 public ActionResult Edit(int? id) { if (id == null) { return new HttpStatusCodeResult(HttpStatusCode.BadRequest); } ShoppingCartRequest shoppingCartRequest = db.ShoppingCartRequests.Find(id); if (shoppingCartRequest == null) { return HttpNotFound(); } ViewBag.PurchaseOrderID = new SelectList(db.PurchaseOrders, "PurchaseOrderID", "PurchaseOrderNumber", shoppingCartRequest.PurchaseOrderID); return View(shoppingCartRequest); } // POST: ShoppingCartRequests/Edit/5 [HttpPost] [ValidateAntiForgeryToken] public ActionResult Edit([Bind(Include = "SC_RequestNo,PurchaseOrderID,ProjectNumber,PurchaseOrderNumber,SC_Date,NameOfRequestor,Section_Contact_Person,Phone_Number,Type_Of_Requirement,SC_Date_Required,SC_Justification,Priority,SC_IOR_Justification,Delivery_Address,Specifications_Drawings_attached,Specifications_Attached,SerialNo,Requisition_Line_Description,Quantity,Unit_Price,Currency_USD,Total_USD,Requirement_was_Budgeted,Funds_Available,Redeployment_of_Funds,System_Contract,Local_Contract,Account_,Balance_,Source_Account__,Destination_Account_,Amount,Contract__,Approved")] ShoppingCartRequest shoppingCartRequest) { if (ModelState.IsValid) { db.Entry(shoppingCartRequest).State = EntityState.Modified; db.SaveChanges(); return RedirectToAction("Index"); } ViewBag.PurchaseOrderID = new SelectList(db.PurchaseOrders, "PurchaseOrderID", "PurchaseOrderNumber", shoppingCartRequest.PurchaseOrderID); return View(shoppingCartRequest); } // GET: ShoppingCartRequests/Delete/5 public ActionResult Delete(int? id) { if (id == null) { return new HttpStatusCodeResult(HttpStatusCode.BadRequest); } ShoppingCartRequest shoppingCartRequest = db.ShoppingCartRequests.Find(id); if (shoppingCartRequest == null) { return HttpNotFound(); } return View(shoppingCartRequest); } // POST: ShoppingCartRequests/Delete/5 [HttpPost, ActionName("Delete")] [ValidateAntiForgeryToken] public ActionResult DeleteConfirmed(int id) { ShoppingCartRequest shoppingCartRequest = db.ShoppingCartRequests.Find(id); db.ShoppingCartRequests.Remove(shoppingCartRequest); db.SaveChanges(); return RedirectToAction("Index"); } protected override void Dispose(bool disposing) { if (disposing) { db.Dispose(); } base.Dispose(disposing); } } }
Thursday, September 27, 2018 12:06 PM
All replies
-
User283571144 posted
Hi YoungRich,
According to your description, I couldn't understand your requirement clearly.The images is also couldn't seen.
Could you please re-upload the image?
Best Regards,
Brando
Friday, September 28, 2018 5:27 AM