Introduction

A water distribution company delivers water to homes and commercial buildings. In this exercise, we will create an application for a fictitious company that distributes and sells water. This version of the application creates and stores records in XML.

Practical Learning: Introducing XML Node Maintenance

1. Start Microsoft Visual Studio
2. On the main menu, click File -> New -> Project...
3. On the main menu of Microsoft Visual Studio, click File -> New -> Project ...
4. In the middle frame of the New Project dialog box, click ASP.NET Web Application (.NET Framework) and change the project Name to WaterDistributionCompany1
5. Click OK
6. In the New ASP.NET Application dialog box, click the MVC icon
7. Click OK
8. In the Solution Explorer, right-click WaterDistributionCompany1 -> Add -> New Folder
9. Type Images
10. Save the following picture to the Images folder:

    

11. Right-click the picture where you saved it and click Copy
12. In the Solution Explorer, right-click Images and click Paste
13. In the Solution Explorer, right-click Content -> Add -> New Item...
14. In the middle frame of the Add New Item dialog box, click Style Sheet
15. Change the file Name to WaterDistribution
16. Click Add
17. Change the document as follows:

    body {
        background-color: #2b5b8f;
    }
    
    .bold              { font-weight:      600;               }
    .top-bar           { top:              0;
                         width:            100%;
                         z-index:          1000;
                         position:         fixed;
                         height:           6.85em;
                         background-color: #203864;           }
    .containment       { margin:           auto;
                         width:            460px;             }
    .navbar-inverse    { background-color: #001132;
                         border-top:       3px solid #cfdde0;
                         border-bottom:    3px solid #cfdde0; }
    .navbar-fixed-top  { top:              6.75em;            }
    .jumbotron         { padding-bottom:   4px;
                         background-color: #153a62;           }
    .col-md-3 h2       { color:            #abcbd9;
                         border-bottom:    1px solid #cfdde0; }
    .lead              { color:            #cfdde0;           }
    .col-md-3 p        { color:            #d5d4c2;           }
    .caption           { color:            lightblue;         }
    .control-label     { font-weight:      400;
                         font-family:      Garamond, Georgia, 'Times New Roman', serif; }
    .copyright         { color:            #beeeab;           }
    .push-down         { margin-top:       8em;               }
    .push-down h2      { font-weight:      600;
                         font-size:        26px;
                         text-align:       center;
                         color:            #d5d4c2;
                         font-family:      Garamond, Georgia, 'Times New Roman', serif; }
    .push-down h3      { color:            #abcbd9;           }
    .push-down p       { color:            #cfdde0;           }
    .water-nav         { text-decoration:  none;
                         color:            yellow;            }
    .water-nav:link    { color:            lightcyan;         }
    .water-nav:visited { color:            aliceblue;         }
    .water-nav:active  { color:            #a8c3ce;           }
    .water-nav:hover   { color:            yellow;            }
    .common-font       { font-family:      Garamond, Georgia, 'Times New Roman', serif; }
    .col-md-125        { min-height:       1px;
                         padding-right:    15px;
                         padding-left:     15px;
                         width:            12.50%;
                         position:         relative;          }
    
    @media (min-width: 992px) {
        .col-md-125 {
            float: left;
            width: 12.50%;
        }
    }
    
    .table-striped > tbody > tr:nth-of-type(even) {
        color: navy;
        background-color: azure;
    }
    
    .table-striped > tbody > tr:nth-of-type(odd) {
        color: aliceblue;
        background-color: cornflowerblue;
    }

18. In the Solution Explorer, expand App_Start and double-click BundleConfig.cs
19. Change the document as follows:

    using System.Web.Optimization;
    
    namespace WaterDistribution2
    {
        public class BundleConfig
        {
            // For more information on bundling, visit https://go.microsoft.com/fwlink/?LinkId=301862
            public static void RegisterBundles(BundleCollection bundles)
            {
                bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                            "~/Scripts/jquery-{version}.js"));
    
                bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                            "~/Scripts/jquery.validate*"));
    
                // Use the development version of Modernizr to develop with and learn from. Then, when you're
                // ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
                bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                            "~/Scripts/modernizr-*"));
    
                bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                          "~/Scripts/bootstrap.js",
                          "~/Scripts/respond.js"));
    
                bundles.Add(new StyleBundle("~/Content/css").Include(
                          "~/Content/bootstrap.css",
                          "~/Content/site.css",
                          "~/Content/WaterDistribution.css"));
            }
        }
    }

20. In the Solution Explorer, right-click WaterDistribution2 -> Add -> New Folder
21. Type WaterDistribution

Water Meters

Utility companies use a device that measure what their customers consume. For example a water utility company installs water meters in residences and commercial buildings to find out how much water has been used. In this section, we will create a view that allows an employee to keep track of water consumption.

Practical Learning: Creating Water Meters

1. In the Solution Explorer, right-click Controllers -> Add -> Controller...
2. In the middle frame of the Add Scaffold dialog box, click MVC 5 Controller With Read/Write Actions:

   

3. Click Add
4. Type WaterMeters to get WaterMetersController
5. Click Add
6. Implement the Index(), the Details(), and the second Create() methods as follows:

   using System;
   using System.IO;
   using System.Xml;
   using System.Linq;
   using System.Web.Mvc;
   
   namespace WaterDistributionCompany1.Controllers
   {
       public class WaterMetersController : Controller
       {
           // GET: WaterMeters
           public ActionResult Index()
           {
               XmlDocument xdWaterMeters = new XmlDocument();
               string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
               if (System.IO.File.Exists(strFileWaterMeters))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterMeters.Load(fsWaterMeters);
                   }
   
                   if (xdWaterMeters.DocumentElement.ChildNodes.Count > 0)
                   {
                       ViewData["WaterMeters"] = xdWaterMeters.DocumentElement.ChildNodes;
                   }
                   else
                   {
                       ViewData["WaterMeters"] = null;
                   }
               }
   
               return View();
           }
   
           // GET: WaterMeters/Details/5
           public ActionResult Details(int id)
           {
               XmlDocument xdWaterMeters = new XmlDocument();
               string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
               if (System.IO.File.Exists(strFileWaterMeters))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterMeters.Load(fsWaterMeters);
   
                       XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                       foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                       {
                           if (xnWaterMeter.InnerText == id.ToString())
                           {
                               ViewData["WaterMeterID"] = xnWaterMeter.InnerText;
                               ViewData["MeterNumber"] = xnWaterMeter.NextSibling.InnerText;
                               ViewData["Make"] = xnWaterMeter.NextSibling.NextSibling.InnerText;
                               ViewData["Model"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["MeterSize"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["DateLastUpdate"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["CounterValue"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // GET: WaterMeters/Create
           public ActionResult Create()
           {
               return View();
           }
   
           // POST: WaterMeters/Create
           [HttpPost]
           public ActionResult Create(FormCollection collection)
           {
               try
               {
                   // TODO: Add insert logic here
                   int meter_id = -1;
                   XmlDocument xdWaterMeters = new XmlDocument();
                   string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                   // Make sure a meter number was provided. If not, don't do nothing
                   if (!string.IsNullOrEmpty(collection["MeterNumber"]))
                   {
                       // If an XML file for water meters was created already, ...
                       if (System.IO.File.Exists(strFileWaterMeters))
                       {
                           // ... open it ...
                           using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.OpenOrCreate, FileAccess.ReadWrite, FileShare.ReadWrite))
                           {
                               // ... and put the records in the DOM
                               xdWaterMeters.Load(fsWaterMeters);
   
                               // We need the meters numbers. Therefore, use XPath to specify their path
                               XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                               // Check the whole list of meters numbers
                               foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                               {
                                   // Every time, assign the current meter number to our meterNumber variable
                                   meter_id = int.Parse(xnWaterMeter.InnerText);
                               }
                           }
                       }
                       else
                       {
                           // If there is no XML file yet, create skeleton code for an XML document, ...
                           xdWaterMeters.LoadXml("<?xml version=\"1.0\" encoding=\"utf-8\"?>" +
                                                 "<water-meters></water-meters>");
                           // and set our meterNumber variable to 0
                           meter_id = 0;
                       }
                   }
   
                   // Get ready to create an XML element named water-meter
                   XmlElement xeWaterMeter = xdWaterMeters.CreateElement("water-meter");
   
                   // Increase the meterNumber variable by 1
                   meter_id += 1;
   
                   // Create the markup of the XML water meter
                   string strWaterMeter = "<meter-id>" + meter_id + "</meter-id>" +
                                          "<meter-number>" + collection["MeterNumber"] + "</meter-number>" +
                                          "<make>" + collection["Make"] + "</make>" +
                                          "<model>" + collection["Model"] + "</model>" +
                                          "<meter-size>" + collection["MeterSize"] + "</meter-size>" +
                                          "<date-last-update>" + collection["DateLastUpdate"] + "</date-last-update>" +
                                          "<counter-value>" + collection["CounterValue"] + "</counter-value>";
   
                   // Specify the markup of the new element
                   xeWaterMeter.InnerXml = strWaterMeter;
                   // Add the new node to the root
                   xdWaterMeters.DocumentElement.AppendChild(xeWaterMeter);
   
                   // Save the (new version of the) XML file
                   using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Create, FileAccess.Write, FileShare.Write))
                   {
                       xdWaterMeters.Save(fsWaterMeters);
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: WaterMeters/Edit/5
           public ActionResult Edit(int id)
           {
               XmlDocument xdWaterMeters = new XmlDocument();
               string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
               if (System.IO.File.Exists(strFileWaterMeters))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterMeters.Load(fsWaterMeters);
   
                       XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                       foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                       {
                           if (xnWaterMeter.InnerText == id.ToString())
                           {
                               ViewData["WaterMeterID"] = xnWaterMeter.InnerText;
                               ViewData["MeterNumber"] = xnWaterMeter.NextSibling.InnerText;
                               ViewData["Make"] = xnWaterMeter.NextSibling.NextSibling.InnerText;
                               ViewData["Model"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["MeterSize"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["DateLastUpdate"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["CounterValue"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: WaterMeters/Edit/5
           [HttpPost]
           public ActionResult Edit(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add update logic here
                   XmlDocument xdWaterMeters = new XmlDocument();
                   string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                   if (System.IO.File.Exists(strFileWaterMeters))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           xdWaterMeters.Load(fsWaterMeters);
                       }
   
                       XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Truncate, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                           {
                               if (xnWaterMeter.InnerText == id.ToString())
                               {
                                   xnWaterMeter.ParentNode.InnerXml = "<meter-id>" + id + "</meter-id>" +
                                                                      "<meter-number>" + collection["MeterNumber"] + "</meter-number>" +
                                                                      "<make>" + collection["Make"] + "</make>" +
                                                                      "<model>" + collection["Model"] + "</model>" +
                                                                      "<meter-size>" + collection["MeterSize"] + "</meter-size>" +
                                                                      "<date-last-update>" + collection["DateLastUpdate"] + "</date-last-update>" +
                                                                      "<counter-value>" + collection["CounterValue"] + "</counter-value>";
                                   xdWaterMeters.Save(fsWaterMeters);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: WaterMeters/Delete/5
           public ActionResult Delete(int id)
           {
               XmlDocument xdWaterMeters = new XmlDocument();
               string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
               if (System.IO.File.Exists(strFileWaterMeters))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterMeters.Load(fsWaterMeters);
   
                       XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                       foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                       {
                           if (xnWaterMeter.InnerText == id.ToString())
                           {
                               ViewData["WaterMeterID"] = xnWaterMeter.InnerText;
                               ViewData["MeterNumber"] = xnWaterMeter.NextSibling.InnerText;
                               ViewData["Make"] = xnWaterMeter.NextSibling.NextSibling.InnerText;
                               ViewData["Model"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["MeterSize"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["DateLastUpdate"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewData["CounterValue"] = xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: WaterMeters/Delete/5
           [HttpPost]
           public ActionResult Delete(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add delete logic here
                   XmlDocument xdWaterMeters = new XmlDocument();
                   string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                   /* Make sure an XML file for the water meters was previously created 
                    * (normally, this is not necessary; if there is no such file, this code 
                    * will never run because it is completely based on routing) */
                   if (System.IO.File.Exists(strFileWaterMeters))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdWaterMeters.Load(fsWaterMeters);
                       }
   
                       // Get ready to change something on the file
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Truncate, FileAccess.Write, FileShare.Write))
                       {
                           // Get a collection of water meter nodes
                           XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("water-meter");
   
                           // Check each node
                           foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                           {
                               /* If you find a water-meter record whose meter-id is 
                                * the same as the id of the record the user clicked, ... */
                               if (xnWaterMeter.FirstChild.InnerText == id.ToString())
                               {
                                   // ... ask its parent to delete that record
                                   xnWaterMeter.ParentNode.RemoveChild(xnWaterMeter);
                                   // Now that the record has been deleted, save the XML file
                                   xdWaterMeters.Save(fsWaterMeters);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
       }
   }

7. In the class, right-click Under Index() and click Add View...
8. In the Add View dialog box, make sure the View Name text box is displaying Index.
   Click Add
9. Chreate a form as follows:

   @{
       ViewBag.Title = "Water Meters";
   }
   
   <div class="push-down">
       <h2 class="common-font bold text-center">Water Meters</h2>
   </div>
   
   <hr />
   
   <table class="table table-striped common-font">
       <tr>
           <th class="bold">Meter ID</th>
           <th class="bold">Meter #</th>
           <th class="bold">Make</th>
           <th class="bold">Model</th>
           <th class="bold">Meter Size</th>
           <th class="bold">Date Last Update</th>
           <th class="bold">Counter Value</th>
           <th>@Html.ActionLink("New Water Meter", "Create", null, htmlAttributes: new { @class = "water-nav" })</th>
       </tr>
   
       @if (ViewBag.waterMeters != null)
       {
           foreach (System.Xml.XmlNode meter in ViewBag.WaterMeters as System.Xml.XmlNodeList)
           {
               <tr>
                   <td class="text-center">@meter.FirstChild.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.NextSibling.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@meter.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>
                       @Html.ActionLink("Update", "Edit", new { id = @meter.FirstChild.InnerText }) :: 
                       @Html.ActionLink("Review", "Details", new { id = @meter.FirstChild.InnerText }) :: 
                       @Html.ActionLink("Remove", "Delete", new { id = @meter.FirstChild.InnerText })
                   </td>
               </tr>
           }
       }
   </table>

10. Click the WaterMetersController.cs tab to access the controller
11. In the document, right-click Details() and click Add View...
12. In the Add View dialog box, make sure the View Name text box is displaying Details.
    Click Add
13. Change the code as follows:

    @{
        ViewBag.Title = "Water Meter Details";
    }
    
    <div class="push-down">
        <h2>Water Meter Details</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt class="bold">Meter ID:</dt>
            <dd>@ViewData["WaterMeterID"]</dd>
            <dt>Water Meter #:</dt>
            <dd>@ViewData["MeterNumber"]</dd>
            <dt>Make:</dt>
            <dd>@ViewData["Make"]</dd>
            <dt>Model:</dt>
            <dd>@ViewData["Model"]</dd>
            <dt>Meter Size:</dt>
            <dd>@ViewData["MeterSize"]</dd>
            <dt>Date Last Update:</dt>
            <dd>@ViewData["DateLastUpdate"]</dd>
            <dt>Counter Value:</dt>
            <dd>@ViewData["CounterValue"]</dd>
        </dl>
    </div>
    
    <p class="text-center">
        @Html.ActionLink("Edit/Update Water Meter Information", "Edit",
                          new { id = ViewData["WaterMeterID"] }, htmlAttributes: new { @class = "water-nav" }) ::
        @Html.ActionLink("Water Meters", "Index",
                         null, new { @class = "water-nav" })
    </p>

14. Click the WaterMetersController.cs tab to access the class
15. In the class, right-click Create() and click Add View...
16. Make sure the View Name text box displays Create.
    Press Enter
17. Create a form as follows:

    @{
        ViewBag.Title = "New Water Meter";
    }
    
    <div class="push-down">
        <h2>New Water Meter</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label for="mtrNbr" class="control-label col-md-4 caption">Meter #:</label>
                <div class="col-md-8">
                    @Html.TextBox("MeterNumber", null, htmlAttributes: new { @class = "form-control", id = "mtrNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="make" class="control-label col-md-4 caption">Make:</label>
                <div class="col-md-8">
                    @Html.TextBox("Make", null, htmlAttributes: new { @class = "form-control", id = "make" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="model" class="control-label col-md-4 caption">Model:</label>
                <div class="col-md-8">
                    @Html.TextBox("Model", null, htmlAttributes: new { @class = "form-control", id = "model" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="mtrSize" class="control-label col-md-4 caption">Meter Size:</label>
                <div class="col-md-8">
                    @Html.TextBox("MeterSize", null, htmlAttributes: new { @class = "form-control", id = "mtrSize" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="dlu" class="control-label col-md-4 caption">Date Last Update:</label>
                <div class="col-md-8">
                    @Html.TextBox("DateLastUpdate",
                        null, htmlAttributes: new { @class = "form-control", type = "date", id = "dlu" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="cntVal" class="control-label col-md-4 caption">Counter Value:</label>
                <div class="col-md-8">
                    @Html.TextBox("CounterValue", null, htmlAttributes: new { @class = "form-control", id = "cntVal" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Water Meters", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Create Water Meter" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }

18. Click the WaterMetersController tab
19. In the document, right-click one of the Edit() methods and click Add View...
20. Make sure the View Name text box is displaying Edit.
    Click Add
21. Change the document as follows:

    @{
        ViewBag.Title = "Edit/Update Water Meter";
    }
    
    <div class="push-down">
        <h2>Edit/Update Water Meter</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label class="control-label col-md-4 caption">Meter #:</label>
                <div class="col-md-8">
                    @Html.TextBox("WaterMeterID", ViewBag.WaterMeterID as string, htmlAttributes: new { @class = "form-control", disabled = "disabled" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="mtrNbr" class="control-label col-md-4 caption">Meter #:</label>
                <div class="col-md-8">
                    @Html.TextBox("MeterNumber", ViewBag.MeterNumber as string, htmlAttributes: new { @class = "form-control", id = "mtrNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="make" class="control-label col-md-4 caption">Make:</label>
                <div class="col-md-8">
                    @Html.TextBox("Make", ViewBag.Make as string, htmlAttributes: new { @class = "form-control", id = "make" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="model" class="control-label col-md-4 caption">Model:</label>
                <div class="col-md-8">
                    @Html.TextBox("Model", ViewBag.Model as string, htmlAttributes: new { @class = "form-control", id = "model" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="mtrSize" class="control-label col-md-4 caption">Meter Size:</label>
                <div class="col-md-8">
                    @Html.TextBox("MeterSize", ViewBag.MeterSize as string, htmlAttributes: new { @class = "form-control", id = "mtrSize" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="dlu" class="control-label col-md-4 caption">Date Last Update:</label>
                <div class="col-md-8">
                    @Html.TextBox("DateLastUpdate",
                        ViewBag.DateLastUpdate as string, htmlAttributes: new { @class = "form-control", type = "date", id = "dlu" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="cntVal" class="control-label col-md-4 caption">Counter Value:</label>
                <div class="col-md-8">
                    @Html.TextBox("CounterValue", ViewBag.CounterValue as string, htmlAttributes: new { @class = "form-control", id = "cntVal" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Water Meters", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Update Water Meter Details" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }

22. Click the WaterMetersController.cs tab
23. In the class, right-click one of the Delete() methods and click Add View...
24. Make sure the View Name is displaying Delete. Click Add
25. Change the document as follows:

    @{
        ViewBag.Title = "Delete Water Meter";
    }
    
    <div class="push-down">
        <h2>Deleting Water Meter</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt>Water Meter ID:</dt>
            <dd>@ViewBag.WaterMeterID</dd>
    
            <dt>Meter #:</dt>
            <dd>@ViewBag.MeterNumber</dd>
    
            <dt>Make:</dt>
            <dd>@ViewBag.Make</dd>
    
            <dt>Model:</dt>
            <dd>@ViewBag.Model</dd>
    
            <dt>Meter Size:</dt>
            <dd>@ViewBag.MeterSize</dd>
    
            <dt>Date Last Update:</dt>
            <dd>@ViewBag.DateLastUpdate</dd>
    
            <dt>Counter Value:</dt>
            <dd>@ViewBag.CounterValue</dd>
        </dl>
    
        <h3 class="common-font caption">Are you sure you want to remove this water meter from the system?</h3>
    
        @using (Html.BeginForm())
        {
            <div class="form-actions no-color">
                <input type="submit" value="Delete this Water Meter" class="btn btn-primary" /> |
                @Html.ActionLink("Water Meters", "Index", null, new { @class = "water-nav" })
            </div>
        }
    </div>

Customers

Customers are people and companies that consume a resource such as water. In this section, we will create object that can assist the employees in creating and managing customers accounts.

Practical Learning: Creating Customers

1. In the Solution Explorer, right-click Controllers -> Add -> New Scaffold Item...
2. In the left list of the Add Scaffold dialog box, click MVC and, in the middle list, click MVC 5 Controller With Read/Write Actions

   

3. Click Add
4. Type Customers to get CustomersController
5. Click Add
6. In the class, change the Index(), the Details(), and the second Create() methods as follows:

   using System;
   using System.IO;
   using System.Xml;
   using System.Linq;
   using System.Web.Mvc;
   
   namespace WaterDistributionCompany1.Controllers
   {
       public class CustomersController : Controller
       {
           // GET: Customers
           public ActionResult Index()
           {
               // Get a reference to the XML DOM
               XmlDocument xdCustomers = new XmlDocument();
               // This is the name and path of the XML file that contains the customers records
               string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
               // If a file that contains the customers records was previously created, ...
               if (System.IO.File.Exists(strFileCustomers))
               {
                   // ... open it
                   using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       // and store the records in the DOM
                       xdCustomers.Load(fsCustomers);
                   }
   
                   /* If the Customers records exist, send them to the view.
                    * If there is no file for the customers, indicate that the DOM is null. */
                   ViewBag.Customers = xdCustomers.DocumentElement.ChildNodes.Count > 0 ? xdCustomers.DocumentElement.ChildNodes : null;
               }
   
               return View();
           }
   
           // GET: Customers/Details/5
           public ActionResult Details(int id)
           {
               XmlDocument xdCustomers = new XmlDocument();
               string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
               if (System.IO.File.Exists(strFileCustomers))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdCustomers.Load(fsWaterMeters);
   
                       XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("account-id");
   
                       foreach (XmlNode xnCustomer in xnlCustomers)
                       {
                           if (xnCustomer.InnerText == id.ToString())
                           {
                               ViewBag.AccountID = xnCustomer.InnerText;
                               ViewBag.AccountNumber = xnCustomer.NextSibling.InnerText;
                               ViewBag.MeterNumber = xnCustomer.NextSibling.NextSibling.InnerText;
                               ViewBag.FirstName = xnCustomer.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.LastName = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.Address = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.City = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.County = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.State = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.ZIPCode = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // GET: Customers/Create
           public ActionResult Create()
           {
               return View();
           }
   
           // POST: Customers/Create
           [HttpPost]
           public ActionResult Create(FormCollection collection)
           {
               try
               {
                   // TODO: Add insert logic here
                   int account_id = -1;
                   bool meterNumberIsValid = false;
                   XmlDocument xdWaterMeters = new XmlDocument();
                   XmlDocument xdCustomersAccounts = new XmlDocument();
                   string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
                   string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                   // Make sure the user provides an account number, ...
                   if (!string.IsNullOrEmpty(collection["AccountNumber"]))
                   {
                       // If the user provided an account number, to start, find out if a file for water meters was created already.
                       if (System.IO.File.Exists(strFileWaterMeters))
                       {
                           // If a file for water meters exists, open it
                           using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open,
                                                                                                FileAccess.Read,
                                                                                                FileShare.Read))
                           {
                               // Store the list of water meters in an XML document
                               xdWaterMeters.Load(fsWaterMeters);
   
                               // Create a list of child nodes of the root node
                               XmlNodeList xnlWaterMeters = xdWaterMeters.DocumentElement.ChildNodes;
   
                               // Visit each node of the list of elements
                               foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                               {
                                   // When you get to a list of (child) nodes of a water-meter node, visit each child node
                                   foreach (XmlNode xnMeterNumber in xnWaterMeter.ChildNodes)
                                   {
                                       // If you find a meter number that is the same as the meter number from the form, ...
                                       if (xnMeterNumber.InnerText == collection["MeterNumber"])
                                       {
                                           // ... make a note
                                           meterNumberIsValid = true;
                                       }
                                   }
                               }
                           }
                       }
   
                       // If either the user didn't provide a meter number or provided a meter number that doesn't exist, ...
                       if (meterNumberIsValid == false)
                       {
                           // ... create a message that will display to the user
                           ViewBag.ErrorMessage = "You must provide a valid meter number";
                       }
                       else
                       {
                           // It appears that the user provided both an account number and a valid meter number.
   
                           // If an XML file for customers accounts was previously created, ...
                           if (System.IO.File.Exists(strFileCustomers))
                           {
                               // ... open it ...
                               using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.OpenOrCreate,
                                                                                                FileAccess.ReadWrite,
                                                                                                FileShare.ReadWrite))
                               {
                                   // ... and put the records in the DOM
                                   xdCustomersAccounts.Load(fsCustomers);
   
                                   XmlNodeList xnlCustomers = xdCustomersAccounts.GetElementsByTagName("account-id");
   
                                   foreach (XmlNode xnCustomer in xnlCustomers)
                                   {
                                       account_id = int.Parse(xnCustomer.InnerText);
                                   }
                               }
                           }
                           else
                           {
                               // If there is no XML file yet for the customers, create skeleton code for an XML document
                               xdCustomersAccounts.LoadXml("<?xml version=\"1.0\" encoding=\"utf-8\"?>" +
                                                           "<customers></customers>");
                               account_id = 0;
                           }
   
                           // Get ready to create an XML element named customer
                           XmlElement xeCustomer = xdCustomersAccounts.CreateElement("customer");
   
                           account_id++;
   
                           // Create the markup of the XML customer
                           string strCustomer = "<account-id>" + account_id + "</account-id>" +
                                                "<account-number>" + collection["AccountNumber"] + "</account-number>" +
                                                "<meter-number>" + collection["MeterNumber"] + "</meter-number>" +
                                                "<first-name>" + collection["FirstName"] + "</first-name>" +
                                                "<last-name>" + collection["LastName"] + "</last-name>" +
                                                "<address>" + collection["Address"] + "</address>" +
                                                "<city>" + collection["City"] + "</city>" +
                                                "<county>" + collection["County"] + "</county>" +
                                                "<state>" + collection["State"] + "</state>" +
                                                "<zip-code>" + collection["ZIPCode"] + "</zip-code>";
   
                           // Specify the markup of the new element
                           xeCustomer.InnerXml = strCustomer;
   
                           // Add the new node to the root
                           xdCustomersAccounts.DocumentElement.AppendChild(xeCustomer);
   
                           // Save the (new version of the) XML file
                           using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.Create, FileAccess.Write, FileShare.Write))
                           {
                               xdCustomersAccounts.Save(fsCustomers);
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: Customers/Edit/5
           public ActionResult Edit(int id)
           {
               XmlDocument xdCustomers = new XmlDocument();
               string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
               if (System.IO.File.Exists(strFileCustomers))
               {
                   using (FileStream fsWaterMeters = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdCustomers.Load(fsWaterMeters);
   
                       XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("account-id");
   
                       foreach (XmlNode xnCustomer in xnlCustomers)
                       {
                           if (xnCustomer.InnerText == id.ToString())
                           {
                               ViewBag.AccountID = xnCustomer.InnerText;
                               ViewBag.AccountNumber = xnCustomer.NextSibling.InnerText;
                               ViewBag.MeterNumber = xnCustomer.NextSibling.NextSibling.InnerText;
                               ViewBag.FirstName = xnCustomer.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.LastName = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.Address = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.City = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.County = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.State = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.ZIPCode = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: Customers/Edit/5
           [HttpPost]
           public ActionResult Edit(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add update logic here
                   XmlDocument xdCustomers = new XmlDocument();
                   string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
                   XmlElement xeCustomer = xdCustomers.CreateElement("customer");
   
                   // Create the markup of a customer
                   string strCustomer = "<account-id>" + id + "</account-id>" +
                                        "<account-number>" + collection["AccountNumber"] + "</account-number>" +
                                        "<meter-number>" + collection["MeterNumber"] + "</meter-number>" +
                                        "<first-name>" + collection["FirstName"] + "</first-name>" +
                                        "<last-name>" + collection["LastName"] + "</last-name>" +
                                        "<address>" + collection["Address"] + "</address>" +
                                        "<city>" + collection["City"] + "</city>" +
                                        "<county>" + collection["County"] + "</county>" +
                                        "<state>" + collection["State"] + "</state>" +
                                        "<zip-code>" + collection["ZIPCode"] + "</zip-code>";
   
                   xeCustomer.InnerXml = strCustomer;
   
                   if (System.IO.File.Exists(strFileCustomers))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileCustomers, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           xdCustomers.Load(fsWaterMeters);
                       }
   
                       using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.OpenOrCreate, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("customer");
   
                           foreach (XmlNode xnCustomer in xnlCustomers)
                           {
                               if (xnCustomer.FirstChild.InnerText == id.ToString())
                               {
                                   xnCustomer.ParentNode.ReplaceChild(xeCustomer, xnCustomer);
                                   xdCustomers.Save(fsCustomers);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: Customers/Delete/5
           public ActionResult Delete(int id)
           {
               XmlDocument xdCustomers = new XmlDocument();
               string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
               if (System.IO.File.Exists(strFileCustomers))
               {
                   using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdCustomers.Load(fsCustomers);
   
                       XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("account-id");
   
                       foreach (XmlNode xnCustomer in xnlCustomers)
                       {
                           if (xnCustomer.InnerText == id.ToString())
                           {
                               ViewBag.AccountID = xnCustomer.InnerText;
                               ViewBag.AccountNumber = xnCustomer.NextSibling.InnerText;
                               ViewBag.MeterNumber = xnCustomer.NextSibling.NextSibling.InnerText;
                               ViewBag.FirstName = xnCustomer.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.LastName = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.Address = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.City = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.County = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.State = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                               ViewBag.ZIPCode = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: Customers/Delete/5
           [HttpPost]
           public ActionResult Delete(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add delete logic here
                   XmlDocument xdCustomers = new XmlDocument();
                   string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
                   /* Open the XML file that contains customers accounts so you can fill the DOM with records */
                   using (FileStream fsWaterMeters = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdCustomers.Load(fsWaterMeters);
                   }
   
                   // Get ready to change something on the file
                   using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.Truncate, FileAccess.Write, FileShare.Write))
                   {
                       // Get a collection of customer nodes
                       XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("customer");
   
                       // Check each node
                       foreach (XmlNode xnCustomer in xnlCustomers)
                       {
                           /* If you find a customer record whose customer-id is
                            * the same as the id of the record the user clicked, ... */
                           if (xnCustomer.FirstChild.InnerText == id.ToString())
                           {
                               // ... ask its parent to delete that record
                               xnCustomer.ParentNode.RemoveChild(xnCustomer);
                               // Now that the record has been deleted, save the XML file
                               xdCustomers.Save(fsCustomers);
                               break;
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
       }
   }

7. In the class, right-click Index() and click Add View...
8. In the Add View dialog box, make sure the View Name text box is displaying Index.
   Click Add
9. Change the webpage as follows:

   @{
       ViewBag.Title = "Customers Accounts";
   }
   
   <div class="push-down">
       <h2>Customers Accounts</h2>
   </div>
   
   <hr />
   
   <table class="table table-striped common-font">
       <tr>
           <th class="bold">Account ID</th>
           <th class="bold">Account #</th>
           <th class="bold">Meter #</th>
           <th class="bold">First Name</th>
           <th class="bold">Last Name</th>
           <th class="bold">Address</th>
           <th class="bold">City</th>
           <th class="bold">County</th>
           <th class="bold">State</th>
           <th class="bold">ZIP Code</th>
           <th>@Html.ActionLink("New Customer Account", "Create", null, htmlAttributes: new { @class = "water-nav" })</th>
       </tr>
   
       @if (ViewBag.customers != null)
       {
           foreach (System.Xml.XmlNode client in ViewBag.Customers as System.Xml.XmlNodeList)
           {
               <tr>
                   <td class="text-center">@client.FirstChild.InnerText</td>
                   <td>@client.FirstChild.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@client.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>
                       @Html.ActionLink("Update", "Edit", new { id = @client.FirstChild.InnerText }) |
                       @Html.ActionLink("Review", "Details", new { id = @client.FirstChild.InnerText }) |
                       @Html.ActionLink("Remove", "Delete", new { id = @client.FirstChild.InnerText })
                   </td>
               </tr>
           }
       }
   </table>

10. In the Solution Explorer, under Views, right-click Customers -> Add -> View...
11. Type Details as the name of the view
12. Press Enter
13. Change the document as follows:

    @{
        ViewBag.Title = "Customer Account Details";
    }
    
    <div class="push-down">
        <h2>Customer Account Details</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt class="bold">Account ID:</dt>
            <dd>@ViewBag.AccountID</dd>
            <dt>Account #:</dt>
            <dd>@ViewBag.AccountNumber</dd>
            <dt>Water Meter #</dt>
            <dd>@ViewBag.MeterNumber</dd>
            <dt>First Name:</dt>
            <dd>@ViewBag.FirstName</dd>
            <dt>Last Name:</dt>
            <dd>@ViewBag.LastName</dd>
            <dt>Address:</dt>
            <dd>@ViewBag.Address</dd>
            <dt>City:</dt>
            <dd>@ViewBag.City</dd>
            <dt>County:</dt>
            <dd>@ViewBag.County</dd>
            <dt>State:</dt>
            <dd>@ViewBag.State</dd>
            <dt>ZIP Code:</dt>
            <dd>@ViewBag.ZIPCode</dd>
        </dl>
    </div>
    
    <p class="text-center">
        @Html.ActionLink("Edit/Update Customer Account Details", "Edit",
                         new { id = @ViewBag.AccountID }, htmlAttributes: new { @class = "water-nav" }) :: 
        @Html.ActionLink("Customers Accounts", "Index",
                         null, new { @class = "water-nav" })
    </p>

14. In the Solution Explorer, under Views, right-click Customers -> Add -> View...
15. Type Create as the name of the view
16. Click Add
17. Change the document as follows

    @{
        ViewBag.Title = "New Customer Account";
    }
    
    <div class="push-down">
        <h2>New Customer Account</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label for="acntNbr" class="control-label col-md-4 caption">Account #:</label>
                <div class="col-md-8">
                    @Html.TextBox("AccountNumber", null, htmlAttributes: new { @class = "form-control", id = "acntNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="mtrNbr" class="control-label col-md-4 caption">Water Meter:</label>
    
                <div class="col-md-8">
                    @Html.TextBox("MeterNumber", null, htmlAttributes: new { @class = "form-control", id = "mtrNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-4 caption">&nbsp;</label>
                <div class="col-md-8"><input type="text" id="meterDetails" class="form-control" disabled /></div>
            </div>
    
            <div class="form-group">
                <label for="fName" class="control-label col-md-4 caption">First Name:</label>
                <div class="col-md-8">
                    @Html.TextBox("FirstName", null, htmlAttributes: new { @class = "form-control", id = "fName" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="lName" class="control-label col-md-4 caption">Last Name:</label>
                <div class="col-md-8">
                    @Html.TextBox("LastName", null, htmlAttributes: new { @class = "form-control", id = "lName" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="adrs" class="control-label col-md-4 caption">Address:</label>
                <div class="col-md-8">
                    @Html.TextBox("Address", null, htmlAttributes: new { @class = "form-control", id = "adrs" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="ct" class="control-label col-md-4 caption">City:</label>
                <div class="col-md-8">
                    @Html.TextBox("City", null, htmlAttributes: new { @class = "form-control", id = "ct" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="county" class="control-label col-md-4 caption">County:</label>
                <div class="col-md-8">
                    @Html.TextBox("County", null, htmlAttributes: new { @class = "form-control", id = "county" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="state" class="control-label col-md-4 caption">State:</label>
                <div class="col-md-8">
                    @Html.TextBox("State", null, htmlAttributes: new { @class = "form-control", id = "state" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="zip" class="control-label col-md-4 caption">ZIP Code:</label>
    
                <div class="col-md-8">
                    @Html.TextBox("ZIPCode", null, htmlAttributes: new { @class = "form-control", id = "zip" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Customers", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Create Customer Account" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }
    
    @Scripts.Render("~/bundles/jquery")
    
    <script type="text/javascript">
        $(document).ready(function () {
            $("#mtrNbr").blur(function (event) {
                var connection = {
                    url: "/WaterDistribution/WaterMeters.xml",
                    method: "GET",
                    dataType: "xml"
                };
                $.ajax(connection).
                    done(function (data) {
                        var waterMeters = $(data).find("water-meter");
                        waterMeters.each(function () {
                            if ($(this).find("meter-number").text() == $("#mtrNbr").val())
                                $("#meterDetails").val($(this).find("make").text() + " " + $(this).find("model").text() + " (" + $(this).find("meter-size").text() + ")");
                        });
                    });
            }); // Lost Focus Event
        }); // Document.Ready
    </script>

18. In the class, right-click one of the Edit() methods and click Add View...
19. Make sure the View Name text box is displaying Edit.
    Click Add
20. Create a form as follows:

    @{
        ViewBag.Title = "Edit/Update Customer Details";
    }
    
    <div class="push-down">
        <h2>Edit/Update Customer Details</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
    <div class="form-horizontal">
        <div class="form-group">
            <label class="control-label col-md-4 caption">Acount ID:</label>
            <div class="col-md-8">
                @Html.TextBox("AccountID", ViewBag.AccountID as string, htmlAttributes: new { @class = "form-control", disabled = "disabled" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="acntNbr" class="control-label col-md-4 caption">Account #:</label>
            <div class="col-md-8">
                @Html.TextBox("AccountNumber", ViewBag.AccountNumber as string, htmlAttributes: new { @class = "form-control", id = "acntNbr" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="mtrNbr" class="control-label col-md-4 caption">Meter #:</label>
            <div class="col-md-8">
                @Html.TextBox("MeterNumber", ViewBag.MeterNumber as string, htmlAttributes: new { @class = "form-control", id = "mtrNbr" })
            </div>
        </div>
    
        <div class="form-group">
            <label class="control-label col-md-4 caption">&nbsp;</label>
            <div class="col-md-8"><input type="text" id="meterDetails" class="form-control" disabled /></div>
        </div>
    
        <div class="form-group">
            <label for="fname" class="control-label col-md-4 caption">First Name:</label>
            <div class="col-md-8">
                @Html.TextBox("FirstName", ViewBag.FirstName as string, htmlAttributes: new { @class = "form-control", id = "fname" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="lname" class="control-label col-md-4 caption">Last Name:</label>
            <div class="col-md-8">
                @Html.TextBox("LastName", ViewBag.LastName as string, htmlAttributes: new { @class = "form-control", id = "lname" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="adrs" class="control-label col-md-4 caption">Address:</label>
            <div class="col-md-8">
                @Html.TextBox("Address", ViewBag.Address as string, htmlAttributes: new { @class = "form-control", id = "adrs" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="ct" class="control-label col-md-4 caption">City:</label>
            <div class="col-md-8">
                @Html.TextBox("City",
                    ViewBag.DateLastUpdate as string, htmlAttributes: new { @class = "form-control", id = "ct" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="county" class="control-label col-md-4 caption">County:</label>
            <div class="col-md-8">
                @Html.TextBox("County", ViewBag.CounterValue as string, htmlAttributes: new { @class = "form-control", id = "county" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="state" class="control-label col-md-4 caption">State:</label>
            <div class="col-md-8">
                @Html.TextBox("State", ViewBag.CounterValue as string, htmlAttributes: new { @class = "form-control", id = "state" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="zip" class="control-label col-md-4 caption">ZIP-Code:</label>
            <div class="col-md-8">
                @Html.TextBox("ZIPCode", ViewBag.CounterValue as string, htmlAttributes: new { @class = "form-control", id = "zip" })
            </div>
        </div>
    
        <div class="form-group">
            <label class="control-label col-md-5">
                @Html.ActionLink("Customers Accounts", "Index", null, htmlAttributes: new { @class = "water-nav" })
            </label>
            <div class="col-md-7">
                <input type="submit" value="Update Customer Details" class="btn btn-primary" />
            </div>
        </div>
    </div>
    }
    
    @Scripts.Render("~/bundles/jquery")
    
    <script type="text/javascript">
        $(document).ready(function () {
            var connection = {
                url: "/WaterDistribution/WaterMeters.xml",
                method: "GET",
                dataType: "xml"
            };
            $.ajax(connection).
                done(function (data) {
                    var waterMeters = $(data).find("water-meter");
                    waterMeters.each(function () {
                        if ($(this).find("meter-number").text() == $("#mtrNbr").val())
                            $("#meterDetails").val($(this).find("make").text() + " " + $(this).find("model").text() + " (" + $(this).find("meter-size").text() + ")");
                    });
                });
    
            $("#mtrNbr").blur(function (event) {
                var connection = {
                    url: "/WaterDistribution/WaterMeters.xml",
                    method: "GET",
                    dataType: "xml"
                };
                $.ajax(connection).
                    done(function (data) {
                        var waterMeters = $(data).find("water-meter");
                        waterMeters.each(function () {
                            if ($(this).find("meter-number").text() == $("#mtrNbr").val())
                                $("#meterDetails").val($(this).find("make").text() + " " + $(this).find("model").text() + " (" + $(this).find("meter-size").text() + ")");
                        });
                    });
            }); // Lost Focus Event
        }); // Document.Ready
    </script>

21. Click the CustomersController.cs tab
22. In the class, right-click one of the Delete() methods and click Add View...
23. Make sure the View Name text box is displaying Delete. Click Add
24. Change the document as follows:

    @{
        ViewBag.Title = "Delete Customer Account";
    }
    
    <div class="push-down">
        <h2>Closing Customer Account</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt>Account ID:</dt>
            <dd>@ViewBag.AccountID</dd>
            <dt>Account #:</dt>
            <dd>@ViewBag.AccountNumber</dd>
            <dt>Meter #:</dt>
            <dd>@ViewBag.MeterNumber</dd>
            <dt>First Name:</dt>
            <dd>@ViewBag.FirstName</dd>
            <dt>Last Name:</dt>
            <dd>@ViewBag.LastName</dd>
            <dt>Address:</dt>
            <dd>@ViewBag.Address</dd>
            <dt>City:</dt>
            <dd>@ViewBag.City</dd>
            <dt>County:</dt>
            <dd>@ViewBag.County</dd>
            <dt>State:</dt>
            <dd>@ViewBag.State</dd>
            <dt>ZIP-Code:</dt>
            <dd>@ViewBag.ZIPCode</dd>
        </dl>
    
        <h3 class="common-font caption">Are you sure you want to close the account of this customer (if you do, the account will disappear from our system)?</h3>
    
        @using (Html.BeginForm())
        {
            <div class="form-actions no-color">
                <input type="submit" value="Close this Customer's Account" class="btn btn-primary" /> |
                @Html.ActionLink("Customers Accounts", "Index", null, new { @class = "water-nav" })
            </div>
        }
    </div>

Water Bills

A water bill is a document that provides various pieces of information about a costumer consuming water and the amount to pay for it. In thissection, we will create objects that can assist the company in creating water bills.

Practical Learning: Creating Water Bills

1. In the Solution Explorer, right-click Controllers -> Add -> Controller...
2. In the middle frame of the Add Scaffold dialog box, make sure MVC 5 Controller With Read/Write Actions is selected.
   Click Add
3. Type WaterBills to get WaterBillsControllers
4. Press Enter
5. Change the class as follows:

   using System;
   using System.IO;
   using System.Xml;
   using System.Web.Mvc;
   using System.Collections.Generic;
   
   namespace WaterDistributionCompany1.Controllers
   {
       public class WaterBillsController : Controller
       {
           // GET: WaterBills
           public ActionResult Index()
           {
               XmlDocument xdWaterBills = new XmlDocument();
               string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
               if (System.IO.File.Exists(strFileWaterBills))
               {
                   using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterBills.Load(fsWaterBills);
                   }
   
                   if (xdWaterBills.DocumentElement.ChildNodes.Count > 0)
                   {
                       ViewData["Invoices"] = xdWaterBills.DocumentElement.ChildNodes;
                   }
                   else
                   {
                        ViewData["Invoices"] = null;
                   }
               }
   
               return View();
           }
   
           // GET: WaterBills/Details/5
           public ActionResult Details(int id)
           {
               XmlDocument xdWaterBills = new XmlDocument();
               string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
               if (System.IO.File.Exists(strFileWaterBills))
               {
                   using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterBills.Load(fsWaterBills);
   
                       XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                       foreach (XmlNode xnWaterBill in xnlWaterBills)
                       {
                           if (xnWaterBill.InnerText == id.ToString())
                           {
                                ViewData["WaterBillID"]           = xnWaterBill.InnerText;
                                ViewData["InvoiceNumber"]         = xnWaterBill.NextSibling.InnerText;
                                ViewData["AccountNumber"]         = xnWaterBill.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingStartDate"] = xnWaterBill.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingEndDate"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["BillingDays"]           = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingStart"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingEnd"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalHCF"]              = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalGallons"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["First15HCF"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["Next10HCF"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["RemainingHCF"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["SewerCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StormCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["WaterUsageCharges"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LocalTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StateTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDueDate"]        = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["AmountDue"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LatePaymentDueDate"]    = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LateAmountDue"]         = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // GET: WaterBills/Create
           public ActionResult Create()
           {
               int water_bill_id = 0;
               XmlDocument xdWaterBills = new XmlDocument();
               string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
               if (System.IO.File.Exists(strFileWaterBills))
               {
                   using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterBills.Load(fsWaterBills);
   
                       XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                       foreach (XmlNode xnWaterBill in xnlWaterBills)
                       {
                           water_bill_id = int.Parse(xnWaterBill.InnerText);
                       }
                   }
               }
   
               ViewData["WaterBillID"] = (water_bill_id + 1);
   
               Random rndNumber = new Random();
               ViewData["InvoiceNumber"] = rndNumber.Next(100001, 999999).ToString();
   
               return View();
           }
   
           // POST: WaterBills/Create
           [HttpPost]
           public ActionResult Create(FormCollection collection)
           {
               try
               {
                   // TODO: Add insert logic here
                   int bill_id = -1;
                   bool customerIsValid = false;
                   string meterNumber = string.Empty;
                   XmlDocument xdCustomers = new XmlDocument();
                   XmlDocument xdWaterBills = new XmlDocument();
                   string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
                   string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
                   // Make sure the user provided an account number for the customer, ...
                   if (!string.IsNullOrEmpty(collection["AccountNumber"]))
                   {
                       // If the user provided an account number, find out if an XML file for customers was already created.
                       if (System.IO.File.Exists(strFileCustomers))
                       {
                           // If a file for customers exists, open it
                           using (FileStream fsCustomers = new FileStream(strFileCustomers, FileMode.Open,
                                                                                            FileAccess.Read,
                                                                                            FileShare.Read))
                           {
                               // Store the list of customers in an XML document
                               xdCustomers.Load(fsCustomers);
   
                               // Create a list of customers nodes that use the account number provided by the user
                               XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("account-number");
   
                               // Visit each node of the list of elements
                               foreach (XmlNode xnCustomer in xnlCustomers)
                               {
                                   // If you find a customer that is the same as the account number from the form, ...
                                   if (xnCustomer.InnerText == collection["AccountNumber"])
                                   {
                                       // ... make a note
                                       customerIsValid = true;
                                       // and get the meter number used by that customer
                                       meterNumber = xnCustomer.NextSibling.InnerText;
                                   }
                               }
                           }
                       }
                   }
   
                   if (customerIsValid == true)
                   {
                       // It appears that the user provided a valid customer account number.
                       // If an XML file for water bills was previously created, ...
                       if (System.IO.File.Exists(strFileWaterBills))
                       {
                           // ... open it ...
                           using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.OpenOrCreate,
                                                                                              FileAccess.ReadWrite,
                                                                                              FileShare.ReadWrite))
                           {
                               // ... and put the records in the DOM
                               xdWaterBills.Load(fsWaterBills);
   
                               XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                               foreach (XmlNode xnWaterBill in xnlWaterBills)
                               {
                                   bill_id = int.Parse(xnWaterBill.InnerText);
                               }
                           }
                       }
                       else
                       {
                           // If there is no XML file yet for the customers, create skeleton code for an XML document
                           xdWaterBills.LoadXml("<?xml version=\"1.0\" encoding=\"utf-8\"?>" +
                                                "<water-bills></water-bills>");
                           bill_id = 0;
                       }
   
                       // Get ready to create an XML element named water-bill
                       XmlElement xeWaterBill = xdWaterBills.CreateElement("invoice");
   
                       bill_id++;
   
                       // Create the markup of the XML water bill
                       xeWaterBill.InnerXml = "<water-bill-id>"            + bill_id + "</water-bill-id>"        +
                                              "<invoice-number>"           + collection["InvoiceNumber"]         + "</invoice-number>"           +
                                              "<account-number>"           + collection["AccountNumber"]         + "</account-number>"           +
                                              "<meter-reading-start-date>" + collection["MeterReadingStartDate"] + "</meter-reading-start-date>" +
                                              "<meter-reading-end-date>"   + collection["MeterReadingEndDate"]   + "</meter-reading-end-date>"   +
                                              "<billing-days>"             + collection["BillingDays"]           + "</billing-days>"             +
                                              "<counter-reading-start>"    + collection["CounterReadingStart"]   + "</counter-reading-start>"    +
                                              "<counter-reading-end>"      + collection["CounterReadingEnd"]     + "</counter-reading-end>"      +
                                              "<total-hcf>"                + collection["TotalHCF"]              + "</total-hcf>"                +
                                              "<total-gallons>"            + collection["TotalGallons"]          + "</total-gallons>"            +
                                              "<first-15-hcf>"             + collection["First15HCF"]            + "</first-15-hcf>"             +
                                              "<next-10-hcf>"              + collection["Next10HCF"]             + "</next-10-hcf>"              +
                                              "<remaining-hcf>"            + collection["RemainingHCF"]          + "</remaining-hcf>"            +
                                              "<sewer-charges>"            + collection["SewerCharges"]          + "</sewer-charges>"            +
                                              "<storm-charges>"            + collection["StormCharges"]          + "</storm-charges>"            + 
                                              "<water-usage-charges>"      + collection["WaterUsageCharges"]     + "</water-usage-charges>"      +
                                              "<total-charges>"            + collection["TotalCharges"]          + "</total-charges>"            +
                                              "<local-taxes>"              + collection["LocalTaxes"]            + "</local-taxes>"              +
                                              "<state-taxes>"              + collection["StateTaxes"]            + "</state-taxes>"              +
                                              "<payment-due-date>"         + collection["PaymentDueDate"]        + "</payment-due-date>"         +
                                              "<amount-due>"               + collection["AmountDue"]             + "</amount-due>"               +
                                              "<late-payment-due-date>"    + collection["LatePaymentDueDate"]    + "</late-payment-due-date>"    +
                                              "<late-amount-due>"          + collection["LateAmountDue"]         + "</late-amount-due>";
   
                       // Add the new node to the root
                       xdWaterBills.DocumentElement.AppendChild(xeWaterBill);
   
                       // Save the (new version of the) XML file
                       using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Create, FileAccess.Write, FileShare.Write))
                       {
                           xdWaterBills.Save(fsWaterBills);
                       }
   
                       // We also want to update the counter value on the water meter with the new Counter Reading End value
                       XmlDocument xdWaterMeters = new XmlDocument();
                       string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                       if (System.IO.File.Exists(strFileWaterMeters))
                       {
                           using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
                           {
                               xdWaterMeters.Load(fsWaterMeters);
                           }
   
                           XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-id");
   
                           using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Truncate, FileAccess.ReadWrite, FileShare.ReadWrite))
                           {
                               foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                               {
                                   if (xnWaterMeter.NextSibling.InnerText == meterNumber)
                                   {
                                       xnWaterMeter.ParentNode.InnerXml = "<meter-id>"         + xnWaterMeter.InnerText + "</meter-id>" +
                                                                          "<meter-number>"     + meterNumber + "</meter-number>" +
                                                                          "<make>"             + xnWaterMeter.NextSibling.NextSibling.InnerText + "</make>" +
                                                                          "<model>"            + xnWaterMeter.NextSibling.NextSibling.NextSibling.InnerText + "</model>" +
                                                                          "<meter-size>"       + xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.InnerText + "</meter-size>" +
                                                                          "<date-last-update>" + xnWaterMeter.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText + "</date-last-update>" +
                                                                          "<counter-value>"    + collection["CounterReadingEnd"] + "</counter-value>";
                                       xdWaterMeters.Save(fsWaterMeters);
                                       break;
                                   }
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: WaterBills/Edit/5
           public ActionResult Edit(int id)
           {
               XmlDocument xdWaterBills = new XmlDocument();
               string strAccountNumber = string.Empty, strMeterNumber = string.Empty;
               string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
               if (System.IO.File.Exists(strFileWaterBills))
               {
                   using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterBills.Load(fsWaterBills);
   
                       XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                       foreach (XmlNode xnWaterBill in xnlWaterBills)
                       {
                           if (xnWaterBill.InnerText == id.ToString())
                           {
                                ViewData["WaterBillID"]           = xnWaterBill.InnerText;
                                ViewData["InvoiceNumber"]         = xnWaterBill.NextSibling.InnerText;
                                ViewData["AccountNumber"]         = xnWaterBill.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingStartDate"] = xnWaterBill.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingEndDate"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["BillingDays"]           = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingStart"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingEnd"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalHCF"]              = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalGallons"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["First15HCF"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["Next10HCF"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["RemainingHCF"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["SewerCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StormCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["WaterUsageCharges"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LocalTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StateTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDueDate"]        = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["AmountDue"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LatePaymentDueDate"]    = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LateAmountDue"]         = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
   
                               strAccountNumber = xnWaterBill.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
   
                   XmlDocument xdCustomers = new XmlDocument();
                   string strFileCustomers = Server.MapPath("/WaterDistribution/Customers.xml");
   
                   if (System.IO.File.Exists(strFileCustomers))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileCustomers, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdCustomers.Load(fsWaterMeters);
   
                           XmlNodeList xnlCustomers = xdCustomers.GetElementsByTagName("account-number");
   
                           foreach (XmlNode xnCustomer in xnlCustomers)
                           {
                               if (xnCustomer.InnerText == strAccountNumber)
                               {
                                    ViewData["AccountNumber"]   = xnCustomer.InnerText;
                                    ViewData["MeterNumber"]     = xnCustomer.NextSibling.InnerText;
                                    ViewData["CustomerName"]    = xnCustomer.NextSibling.NextSibling.InnerText + " " +
                                                                  xnCustomer.NextSibling.NextSibling.NextSibling.InnerText;
                                    ViewData["CustomerAddress"] = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                    ViewData["CustomerCity"]    = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                    ViewData["CustomerCounty"]  = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                    ViewData["CustomerState"]   = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                    ViewData["CustomerZIPCode"] = xnCustomer.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
   
                                   strMeterNumber = xnCustomer.NextSibling.InnerText;
                               }
                           }
                       }
                   }
   
                   XmlDocument xdWaterMeters = new XmlDocument();
                   string strFileWaterMeters = Server.MapPath("/WaterDistribution/WaterMeters.xml");
   
                   if (System.IO.File.Exists(strFileWaterMeters))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterMeters, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdWaterMeters.Load(fsWaterMeters);
   
                           XmlNodeList xnlWaterMeters = xdWaterMeters.GetElementsByTagName("meter-number");
   
                           foreach (XmlNode xnWaterMeter in xnlWaterMeters)
                           {
                               if (xnWaterMeter.InnerText == strMeterNumber)
                               {
                                    ViewData["MeterDetails"] = xnWaterMeter.InnerText + " " +
                                                          xnWaterMeter.NextSibling.InnerText + " (" +
                                                          xnWaterMeter.NextSibling.NextSibling.NextSibling.InnerText + ")";
                               }
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: WaterBills/Edit/5
           [HttpPost]
           public ActionResult Edit(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add update logic here
                   XmlDocument xdWaterBills = new XmlDocument();
                   string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
                   if (System.IO.File.Exists(strFileWaterBills))
                   {
                       using (FileStream fsWaterMeters = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           xdWaterBills.Load(fsWaterMeters);
                       }
   
                       XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                       using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Truncate, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           foreach (XmlNode xnWaterBill in xnlWaterBills)
                           {
                               if (xnWaterBill.InnerText == id.ToString())
                               {
                                   xnWaterBill.ParentNode.InnerXml = "<water-bill-id>" + id + "</water-bill-id>" +
                                                                     "<invoice-number>" + collection["InvoiceNumber"] + "</invoice-number>" +
                                                                     "<account-number>" + collection["AccountNumber"] + "</account-number>" +
                                                                     "<meter-reading-start-date>" + collection["MeterReadingStartDate"] + "</meter-reading-start-date>" +
                                                                     "<meter-reading-end-date>" + collection["MeterReadingEndDate"] + "</meter-reading-end-date>" +
                                                                     "<billing-days>" + collection["BillingDays"] + "</billing-days>" +
                                                                     "<counter-reading-start>" + collection["CounterReadingStart"] + "</counter-reading-start>" +
                                                                     "<counter-reading-end>" + collection["CounterReadingEnd"] + "</counter-reading-end>" +
                                                                     "<total-hcf>" + collection["TotalHCF"] + "</total-hcf>" +
                                                                     "<total-gallons>" + collection["TotalGallons"] + "</total-gallons>" +
                                                                     "<first-15-hcf>" + collection["First15HCF"] + "</first-15-hcf>" +
                                                                     "<next-10-hcf>" + collection["Next10HCF"] + "</next-10-hcf>" +
                                                                     "<remaining-hcf>" + collection["RemainingHCF"] + "</remaining-hcf>" +
                                                                     "<sewer-charges>" + collection["SewerCharges"] + "</sewer-charges>" +
                                                                     "<storm-charges>" + collection["StormCharges"] + "</storm-charges>" +
                                                                     "<water-usage-charges>" + collection["WaterUsageCharges"] + "</water-usage-charges>" +
                                                                     "<total-charges>" + collection["TotalCharges"] + "</total-charges>" +
                                                                     "<local-taxes>" + collection["LocalTaxes"] + "</local-taxes>" +
                                                                     "<state-taxes>" + collection["StateTaxes"] + "</state-taxes>" +
                                                                     "<payment-due-date>" + collection["PaymentDueDate"] + "</payment-due-date>" +
                                                                     "<amount-due>" + collection["AmountDue"] + "</amount-due>" +
                                                                    "<late-payment-due-date>" + collection["LatePaymentDueDate"] + "</late-payment-due-date>" +
                                                                    "<late-amount-due>" + collection["LateAmountDue"] + "</late-amount-due>";
   
                                   xdWaterBills.Save(fsWaterBills);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: WaterBills/Delete/5
           public ActionResult Delete(int id)
           {
               XmlDocument xdWaterBills = new XmlDocument();
               string strAccountNumber = string.Empty, strMeterNumber = string.Empty;
               string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
               if (System.IO.File.Exists(strFileWaterBills))
               {
                   using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdWaterBills.Load(fsWaterBills);
   
                       XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("water-bill-id");
   
                       foreach (XmlNode xnWaterBill in xnlWaterBills)
                       {
                           if (xnWaterBill.InnerText == id.ToString())
                           {
                                ViewData["WaterBillID"]           = xnWaterBill.InnerText;
                                ViewData["InvoiceNumber"]         = xnWaterBill.NextSibling.InnerText;
                                ViewData["AccountNumber"]         = xnWaterBill.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingStartDate"] = xnWaterBill.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["MeterReadingEndDate"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["BillingDays"]           = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingStart"]   = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["CounterReadingEnd"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalHCF"]              = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalGallons"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["First15HCF"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["Next10HCF"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["RemainingHCF"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["SewerCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StormCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["WaterUsageCharges"]     = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["TotalCharges"]          = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LocalTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["StateTaxes"]            = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDueDate"]        = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["AmountDue"]             = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LatePaymentDueDate"]    = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["LateAmountDue"]         = xnWaterBill.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
   
                               strAccountNumber = xnWaterBill.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: WaterBills/Delete/5
           [HttpPost]
           public ActionResult Delete(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add delete logic here
                   XmlDocument xdWaterBills = new XmlDocument();
                   string strFileWaterBills = Server.MapPath("/WaterDistribution/WaterBills.xml");
   
                   if (System.IO.File.Exists(strFileWaterBills))
                   {
                       using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdWaterBills.Load(fsWaterBills);
                       }
   
                       using (FileStream fsWaterBills = new FileStream(strFileWaterBills, FileMode.Truncate, FileAccess.Write, FileShare.Write))
                       {
                           XmlNodeList xnlWaterBills = xdWaterBills.GetElementsByTagName("invoice");
   
                           foreach (XmlNode xnWaterBill in xnlWaterBills)
                           {
                               if (xnWaterBill.FirstChild.InnerText == id.ToString())
                               {
                                   xnWaterBill.ParentNode.RemoveChild(xnWaterBill);
                                   xdWaterBills.Save(fsWaterBills);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
       }
   }

6. In the document, right-click Index() and click Add View...
7. In the Add View dialog box, make sure the View Name text is displaying Index. Click Add
8. Change the document as follows:

   @{
       ViewBag.Title = "Customers Water Bills";
   }
   
   <div class="push-down">
       <h2 class="common-font bold text-center">Customers Water Bills</h2>
   </div>
   
   <hr />
   
   <table class="table table-striped common-font">
       <tr>
           <th class="bold text-center" colspan="2">Identification</th>
           <th class="bold text-center" colspan="4">Meter Reading</th>
           <th class="bold text-center" colspan="2">Counter Reading</th>
           <th class="bold text-center" colspan="5">HCF Summary</th>
           <th class="bold text-center" colspan="4">Charges</th>
           <th class="bold text-center" colspan="2">Taxes</th>
           <th class="bold text-center" colspan="4">Payment</th>
           <th>&nbsp;</th>
       </tr>
       <tr>
           <th class="bold">Bill ID</th>
           <th class="bold">Invoice #</th>
           <th class="bold">Account #</th>
           <th class="bold">Start Date</th>
           <th class="bold">End Date</th>
           <th class="bold">Days</th>
           <th class="bold">Start</th>
           <th class="bold">End</th>
           <th class="bold">Total</th>
           <th class="bold">Gallons</th>
           <th class="bold">First 15</th>
           <th class="bold">Next 10</th>
           <th class="bold">Remaining</th>
           <th class="bold">Sewer</th>
           <th class="bold">Storm</th>
           <th class="bold">Water Usage</th>
           <th class="bold">Total</th>
           <th class="bold">Local</th>
           <th class="bold">State</th>
           <th class="bold">Due Date</th>
           <th class="bold">Amount</th>
           <th class="bold">Late Pmt</th>
           <th class="bold">Late Amt</th>
           <th>&nbsp;</th>
       </tr>
   
       @if (ViewBag.Invoices != null)
       {
           foreach (System.Xml.XmlNode bill in ViewData["Invoices"] as System.Xml.XmlNodeList)
           {
               <tr>
                   <td class="text-center">@bill.FirstChild.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@bill.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>
                       @Html.ActionLink("Update", "Edit", new { id = @bill.FirstChild.InnerText }) <span style="color: aquamarine">::</span>
                       @Html.ActionLink("Review", "Details", new { id = @bill.FirstChild.InnerText }) <span style="color: aquamarine">::</span>
                       @Html.ActionLink("Remove", "Delete", new { id = @bill.FirstChild.InnerText })
                   </td>
               </tr>
           }
       }
   </table>
   
   <p class="text-center">@Html.ActionLink("New Water Bill", "Create", null, htmlAttributes: new { @class = "water-nav" })</p>

9. Click the WaterBillsController.cs tab to access its class
10. In the class, right-click Details() and click Add View...
11. Makre sure the View Name text box is displaying Details. Click Add
12. Change the document as follows:

    @{
        ViewBag.Title = "Water Bill Details";
    }
    
    <div class="push-down">
        <h2>Water Bill Details</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt class="bold">Water Bill ID:</dt>
            <dd>@ViewData["WaterBillID"]</dd>
            <dt class="bold">Invoice #:</dt>
            <dd>@ViewData["InvoiceNumber"]</dd>
            <dt class="bold">Account #:</dt>
            <dd>@ViewData["AccountNumber"]</dd>
            <dt class="bold">Meter Reading Start Date:</dt>
            <dd>@ViewData["MeterReadingStartDate"]</dd>
            <dt class="bold">Meter Reading End Date:</dt>
            <dd>@ViewData["MeterReadingEndDate"]</dd>
            <dt class="bold">Billing Days:</dt>
            <dd>@ViewData["BillingDays"]</dd>
            <dt class="bold">Counter Reading Start:</dt>
            <dd>@ViewData["CounterReadingStart"]</dd>
            <dt class="bold">Counter Reading End:</dt>
            <dd>@ViewData["CounterReadingEnd"]</dd>
            <dt class="bold">Total HCF:</dt>
            <dd>@ViewData["TotalHCF"]</dd>
            <dt class="bold">Total Gallons:</dt>
            <dd>@ViewData["TotalGallons"]</dd>
            <dt class="bold">First 15 HCF:</dt>
            <dd>@ViewData["First15HCF"]</dd>
            <dt class="bold">Next 10 HCF:</dt>
            <dd>@ViewData["Next10HCF"]</dd>
            <dt class="bold">Remaining HCF:</dt>
            <dd>@ViewData["RemainingHCF"]</dd>
            <dt class="bold">Sewer Charges:</dt>
            <dd>@ViewData["SewerCharges"]</dd>
            <dt class="bold">Storm Charges:</dt>
            <dd>@ViewData["StormCharges"]</dd>
            <dt class="bold">Water Usage Charges:</dt>
            <dd>@ViewData["WaterUsageCharges"]</dd>
            <dt class="bold">Total Charges:</dt>
            <dd>@ViewData["TotalCharges"]</dd>
            <dt class="bold">Local Taxes:</dt>
            <dd>@ViewData["LocalTaxes"]</dd>
            <dt class="bold">State Taxes:</dt>
            <dd>@ViewData["StateTaxes"]</dd>
            <dt class="bold">Payment Due Date:</dt>
            <dd>@ViewData["PaymentDueDate"]</dd>
            <dt class="bold">Amount Due:</dt>
            <dd>@ViewData["AmountDue"]</dd>
            <dt class="bold">Late Payment Due Date:</dt>
            <dd>@ViewData["LatePaymentDueDate"]</dd>
            <dt class="bold">Late Amount Due:</dt>
            <dd>@ViewData["LateAmountDue"]</dd>
        </dl>
    </div>
    
    <p class="text-center">
        @Html.ActionLink("Edit/Update Customer Water Bill", "Edit",
                         new { id = ViewData["WaterBillID"] }, htmlAttributes: new { @class = "water -nav" }) :: 
        @Html.ActionLink("Customers Water Bills", "Index",
                         null, new { @class = "water-nav" })
    </p>

13. Click the WaterBillsController.cs tab
14. In the class, right-click one of the Create() methods and click Add View...
15. In the Add View dialog box, make sure the View Name text box is displaying Create. Click Add
16. Create the form as follows:

    @{
        ViewBag.Title = "Prepare Customer Water Bill";
    }
    
    <div class="push-down">
        <h2>Prepare Customer Water Bill</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label for="billNbr" class="control-label col-md-4 caption">Water Bill ID:</label>
                <div class="col-md-8">
                    @Html.TextBox("WaterBillID", null,
                                  htmlAttributes: new { @class = "form-control", id = "billNbr", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label for="invoiceNbr" class="control-label col-md-4 caption">Invoice #:</label>
                <div class="col-md-8">
                    @Html.TextBox("InvoiceNumber", null,
                                  htmlAttributes: new { @class = "form-control", id = "invoiceNbr" })
                </div>
            </div>
            <div class="form-group">
                <label for="acntNbr" class="control-label col-md-4 caption">Customer Account #:</label>
                <div class="col-md-8">
                    @Html.TextBox("AccountNumber", null,
                                  htmlAttributes: new { @class = "form-control", id = "acntNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-4 caption">Customer Name:</label>
                <div class="col-md-8">
                    @Html.TextBox("CustomerName", null,
                                  new { @class = "form-control", id = "custName", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4 caption">Customer Address:</label>
                <div class="col-md-8">
                    @Html.TextBox("CustomerAddress", null,
                                  new { @class = "form-control", id = "adrs", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">
                    @Html.TextBox("CustomerCity", null,
                                  new { @class = "form-control", id = "city", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerCounty", null,
                                  new { @class = "form-control", id = "county", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerState", null,
                                  new { @class = "form-control", id = "state", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerZIPCode", null,
                                  new { @class = "form-control", id = "zip", disabled = "disabled" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-4 caption">Meter Details:</label>
                <div class="col-md-125">
                    @Html.TextBox("MeterNumber", null,
                                  new { @class = "form-control", id = "mtrNbr", disabled = "disabled" })
                </div>
                <div class="col-md-6">
                    @Html.TextBox("MeterDetails", null,
                                  htmlAttributes: new { @class = "form-control", id = "meterDetails", disabled = "disabled" })
                </div>
            </div>
            <hr />
            <div class="form-group">
                <label for="mrsd" class="control-label col-md-4 caption">Meter Reading Start Date:</label>
                <div class="col-md-2">
                    @Html.TextBox("MeterReadingStartDate", null,
                                  htmlAttributes: new { @class = "form-control", id = "mrsd" })
                </div>
                <label for="mred" class="control-label col-md-125 caption">Meter Reading End Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("MeterReadingEndDate", null,
                                  htmlAttributes: new { @class = "form-control", type = "date", id = "mred" })
                </div>
                <label for="days" class="control-label col-md-2 caption">Billing Days:</label>
                <div class="col-md-1">
                    @Html.TextBox("BillingDays", null, htmlAttributes: new { @class = "form-control", id = "days" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="crs" class="control-label col-md-4 caption">Counter Reading Start:</label>
                <div class="col-md-2">
                    @Html.TextBox("CounterReadingStart", null, htmlAttributes: new { @class = "form-control", id = "crs" })
                </div>
                <label for="cre" class="control-label col-md-125 caption">Current Meter Reading:</label>
                <div class="col-md-125">
                    @Html.TextBox("CounterReadingEnd", null, htmlAttributes: new { @class = "form-control", id = "cre" })
                </div>
                <label for="thcf" class="control-label col-md-2 caption">Total HCF:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalHCF", null, htmlAttributes: new { @class = "form-control", id = "thcf" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-2">&nbsp;</div>
                <label class="control-label col-md-125">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="gallons" class="control-label col-md-2 caption">Total Gallons:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalGallons", null, htmlAttributes: new { @class = "form-control", id = "gallons" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="f15HCF" class="control-label col-md-4 caption">1st 15 HCF at $3.6121:</label>
                <div class="col-md-2">
                    @Html.TextBox("First15HCF", null,
                                  htmlAttributes: new { @class = "form-control", id = "f15HCF" })
                </div>
                <label for="next10HCF" class="control-label col-md-125 caption">Next 10 HCF at $3.9180:</label>
                <div class="col-md-125">
                    @Html.TextBox("Next10HCF", null,
                                  htmlAttributes: new { @class = "form-control", id = "next10HCF" })
                </div>
                <label for="remHCF" class="control-label col-md-2 caption">Remaining HCF at $4.2763:</label>
                <div class="col-md-1">
                    @Html.TextBox("RemainingHCF", null, htmlAttributes: new { @class = "form-control", id = "remHCF" })
                </div>
            </div>
            <div class="form-group">
                <label for="sewerCharges" class="control-label col-md-4 caption">Sewer Charges:</label>
                <div class="col-md-2">
                    @Html.TextBox("SewerCharges", null,
                                  htmlAttributes: new { @class = "form-control", id = "sewerCharges" })
                </div>
                <label for="stormCharges" class="control-label col-md-125 caption">Storm Charges:</label>
                <div class="col-md-125">
                    @Html.TextBox("StormCharges", null,
                                  htmlAttributes: new { @class = "form-control", id = "stormCharges" })
                </div>
                <label for="wuc" class="control-label col-md-2 caption">Water Usage Charges:</label>
                <div class="col-md-1">
                    @Html.TextBox("WaterUsageCharges", null, htmlAttributes: new { @class = "form-control", id = "wuc" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-2">&nbsp;</div>
                <label class="control-label col-md-125">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="totalCharges" class="control-label col-md-2 caption">Total Charges:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalCharges", null, htmlAttributes: new { @class = "form-control", id = "totalCharges" })
                </div>
            </div>
            <hr />
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="localTaxes" class="control-label col-md-125 caption">Local Taxes:</label>
                <div class="col-md-125">
                    @Html.TextBox("LocalTaxes", null,
                                  htmlAttributes: new { @class = "form-control", id = "localTaxes" })
                </div>
                <label for="stateTaxes" class="control-label col-md-125 caption">State Taxes:</label>
                <div class="col-md-125">
                    @Html.TextBox("StateTaxes", null, htmlAttributes: new { @class = "form-control", id = "stateTaxes" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="pdd" class="control-label col-md-125 caption">Payment Due Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("PaymentDueDate", null,
                                  htmlAttributes: new { @class = "form-control", type = "date", id = "pdd" })
                </div>
                <label for="amtDue" class="control-label col-md-125 caption">Amount Due:</label>
                <div class="col-md-125">
                    @Html.TextBox("AmountDue", null,
                                  htmlAttributes: new { @class = "form-control", id = "amtDue" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4 caption">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="lpdd" class="control-label col-md-125 caption">Late Payment Due Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("LatePaymentDueDate", null,
                                  htmlAttributes: new { @class = "form-control", id = "lpdd" })
                </div>
                <label for="lateAmtDue" class="control-label col-md-125 caption">Late Amount Due:</label>
                <div class="col-md-125">
                    @Html.TextBox("LateAmountDue", null, htmlAttributes: new { @class = "form-control", id = "lateAmtDue" })
                </div>
            </div>
    
            <div class="form-group text-center">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Water Bills", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Save Water Bill" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }
    
    @Scripts.Render("~/bundles/jquery")
    
    <script type="text/javascript">
        $(document).ready(function () {
            $("#acntNbr").blur(function (event) {
                var connection = {
                    method: "GET",
                    dataType: "xml",
                    url: "/WaterDistribution/Customers.xml"
                };
                $.ajax(connection).
                    done(function (data) {
                        var clients = $(data).find("customer");
                        clients.each(function () {
                            if ($(this).find("account-number").text() === $("#acntNbr").val()) {
                                $("#mtrNbr").val($(this).find("meter-number").text());
                                $("#custName").val($(this).find("first-name").text() + " " + $(this).find("last-name").text());
                                $("#adrs").val($(this).find("address").text());
                                $("#city").val($(this).find("city").text());
                                $("#county").val($(this).find("county").text());
                                $("#state").val($(this).find("state").text());
                                $("#zip").val($(this).find("zip-code").text());
                            }
                        });
                    });
    
                connection = {
                    method: "GET",
                    dataType: "xml",
                    url: "/WaterDistribution/WaterMeters.xml"
                };
                $.ajax(connection).
                    done(function (data) {
                        var waterMeters = $(data).find("water-meter");
                        waterMeters.each(function () {
                            if ($(this).find("meter-number").text() === $("#mtrNbr").val()) {
                                $("#meterDetails").val($(this).find("make").text() + " " + $(this).find("model").text() + " (" + $(this).find("meter-size").text() + ")");
                                $("#mrsd").val($(this).find("date-last-update").text());
                                $("#crs").val($(this).find("counter-value").text());
                            }
                        });
                    });
    
                connection = {
                    method: "GET",
                    dataType: "xml",
                    url: "/WaterDistribution/WaterBills.xml"
                };
                $.ajax(connection).
                    done(function (data) {
                        var invoices = $(data).find("invoice");
                        invoices.each(function () {
                            if ($(this).find("account-number").text() === $("#acntNbr").val()) {
                                $("#mrsd").val($(this).find("meter-reading-end-date").text());
                                $("#crs").val($(this).find("counter-reading-end").text());
                            }
                        });
                    });
            }); // Account # Lost Focus
    
            $("#mred").change(function (event) {
                var meterReadingStartDate = Date.parse($("#mrsd").val());
                var meterReadingEndDate = Date.parse($("#mred").val());
    
                var days = (meterReadingEndDate - meterReadingStartDate) / 86400000;
    
                $("#days").val(days.toFixed());
            }); // Meter Reading End Date Lost Focus
    
            $("#cre").focusout(function (event) {
                var counterReadingStart = parseInt($("#crs").val());
                var counterReadingEnd = parseInt($("#cre").val());
                var totalHCF = counterReadingEnd - counterReadingStart;
                var gallons = totalHCF * 748; // 748.05
    
                var first15HCF = totalHCF * 3.612;
                var next10HCF = 0, remainingHCF = 0;
    
                if (totalHCF <= 15) {
                    first15HCF = totalHCF * 3.612;
                    next10HCF = 0;
                    remainingHCF = 0;
                }
                else if (totalHCF <= 25) {
                    first15HCF = 15 * 3.612;
                    next10HCF = (totalHCF - 15) * 3.918;
                    remainingHCF = 0;
                }
                else {
                    first15HCF = 15 * 3.612;
                    next10HCF = 10 * 3.918;
                    remainingHCF = (totalHCF - 25) * 2.2763;
                }
    
                var waterUsageCharges = first15HCF + next10HCF + remainingHCF;
                var sewerCharges      = waterUsageCharges * 0.252;
                var stormCharges      = waterUsageCharges * 0.0025;
                var totalCharges      = waterUsageCharges + sewerCharges + stormCharges;
                var localTaxes        = totalCharges * 0.0152;
                var stateTaxes        = totalCharges * 0.005;
                var amountDue         = totalCharges + localTaxes + stateTaxes;
    
                $("#thcf").val(totalHCF.toFixed());
                $("#gallons").val(gallons.toFixed());
                $("#amtDue").val(amountDue.toFixed(2));
                $("#f15HCF").val(first15HCF.toFixed(2));
                $("#next10HCF").val(next10HCF.toFixed(2));
                $("#remHCF").val(remainingHCF.toFixed(2));
                $("#wuc").val(waterUsageCharges.toFixed(2));
                $("#stateTaxes").val(stateTaxes.toFixed(2));
                $("#localTaxes").val(localTaxes.toFixed(2));
                $("#sewerCharges").val(sewerCharges.toFixed(2));
                $("#stormCharges").val(stormCharges.toFixed(2));
                $("#totalCharges").val(totalCharges.toFixed(2));
                $("#lateAmtDue").val((amountDue + 8.95).toFixed(2));
            }); // Counter Reading End Lost Focus
        }); // Document.Ready
    </script>

17. Click the WaterBillsController.cs tab to return to the controller
18. In the class, right-click one of the Edit() methods and click Add View...
19. In the Add View dialog box, make sure the View Name text box is displaying Edit. Click Add
20. Create a form as follows:

    @{
        ViewBag.Title = "Edit/Update Water Bill";
    }
    
    <div class="push-down">
        <h2>Edit/Update Water Bill</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label for="billNbr" class="control-label col-md-4 caption">Water Bill ID:</label>
                <div class="col-md-8">
                    @Html.TextBox("WaterBillID", null,
                                  htmlAttributes: new { @class = "form-control", id = "billNbr", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label for="invoiceNbr" class="control-label col-md-4 caption">Invoice #:</label>
                <div class="col-md-8">
                    @Html.TextBox("InvoiceNumber", null,
                                  htmlAttributes: new { @class = "form-control", id = "invoiceNbr" })
                </div>
            </div>
            <div class="form-group">
                <label for="acntNbr" class="control-label col-md-4 caption">Customer Account #:</label>
                <div class="col-md-8">
                    @Html.TextBox("AccountNumber", null,
                                  htmlAttributes: new { @class = "form-control", id = "acntNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-4 caption">Customer Name:</label>
                <div class="col-md-8">
                    @Html.TextBox("CustomerName", null,
                                  new { @class = "form-control", id = "custName", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4 caption">Customer Address:</label>
                <div class="col-md-8">
                    @Html.TextBox("CustomerAddress", null,
                                  new { @class = "form-control", id = "adrs", disabled = "disabled" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">
                    @Html.TextBox("CustomerCity", null,
                                  new { @class = "form-control", id = "city", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerCounty", null,
                                  new { @class = "form-control", id = "county", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerState", null,
                                  new { @class = "form-control", id = "state", disabled = "disabled" })
                </div>
                <div class="col-md-125">
                    @Html.TextBox("CustomerZIPCode", null,
                                  new { @class = "form-control", id = "zip", disabled = "disabled" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-4 caption">Meter Details:</label>
                <div class="col-md-125">
                    @Html.TextBox("MeterNumber", null,
                                  new { @class = "form-control", id = "mtrNbr", disabled = "disabled" })
                </div>
                <div class="col-md-6">
                    @Html.TextBox("MeterDetails", null,
                                  new { @class = "form-control", id = "meterDetails", disabled = "disabled" })
                </div>
            </div>
            <hr />
            <div class="form-group">
                <label for="mrsd" class="control-label col-md-4 caption">Meter Reading Start Date:</label>
                <div class="col-md-2">
                    @Html.TextBox("MeterReadingStartDate", null,
                                  htmlAttributes: new { @class = "form-control", id = "mrsd" })
                </div>
                <label for="mred" class="control-label col-md-125 caption">Meter Reading End Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("MeterReadingEndDate", null,
                                  htmlAttributes: new { @class = "form-control", type = "date", id = "mred" })
                </div>
                <label for="days" class="control-label col-md-2 caption">Billing Days:</label>
                <div class="col-md-1">
                    @Html.TextBox("BillingDays", null, htmlAttributes: new { @class = "form-control", id = "days" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="crs" class="control-label col-md-4 caption">Counter Reading Start:</label>
                <div class="col-md-2">
                    @Html.TextBox("CounterReadingStart", null, htmlAttributes: new { @class = "form-control", id = "crs" })
                </div>
                <label for="cre" class="control-label col-md-125 caption">Current Meter Reading:</label>
                <div class="col-md-125">
                    @Html.TextBox("CounterReadingEnd", null, htmlAttributes: new { @class = "form-control", id = "cre" })
                </div>
                <label for="thcf" class="control-label col-md-2 caption">Total HCF:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalHCF", null, htmlAttributes: new { @class = "form-control", id = "thcf" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-2">&nbsp;</div>
                <label class="control-label col-md-125">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="gallons" class="control-label col-md-2 caption">Total Gallons:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalGallons", null, htmlAttributes: new { @class = "form-control", id = "gallons" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="f15HCF" class="control-label col-md-4 caption">1st 15 HCF at $3.6121:</label>
                <div class="col-md-2">
                    @Html.TextBox("First15HCF", null,
                                  htmlAttributes: new { @class = "form-control", id = "f15HCF" })
                </div>
                <label for="next10HCF" class="control-label col-md-125 caption">Next 10 HCF at $3.9180:</label>
                <div class="col-md-125">
                    @Html.TextBox("Next10HCF", null,
                                  htmlAttributes: new { @class = "form-control", id = "next10HCF" })
                </div>
                <label for="remHCF" class="control-label col-md-2 caption">Remaining HCF at $4.2763:</label>
                <div class="col-md-1">
                    @Html.TextBox("RemainingHCF", null, htmlAttributes: new { @class = "form-control", id = "remHCF" })
                </div>
            </div>
            <div class="form-group">
                <label for="sewerCharges" class="control-label col-md-4 caption">Sewer Charges:</label>
                <div class="col-md-2">
                    @Html.TextBox("SewerCharges", null,
                                  htmlAttributes: new { @class = "form-control", id = "sewerCharges" })
                </div>
                <label for="stormCharges" class="control-label col-md-125 caption">Storm Charges:</label>
                <div class="col-md-125">
                    @Html.TextBox("StormCharges", null,
                                  htmlAttributes: new { @class = "form-control", id = "stormCharges" })
                </div>
                <label for="wuc" class="control-label col-md-2 caption">Water Usage Charges:</label>
                <div class="col-md-1">
                    @Html.TextBox("WaterUsageCharges", null, htmlAttributes: new { @class = "form-control", id = "wuc" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-2">&nbsp;</div>
                <label class="control-label col-md-125">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="totalCharges" class="control-label col-md-2 caption">Total Charges:</label>
                <div class="col-md-1">
                    @Html.TextBox("TotalCharges", null, htmlAttributes: new { @class = "form-control", id = "totalCharges" })
                </div>
            </div>
            <hr />
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="localTaxes" class="control-label col-md-125 caption">Local Taxes:</label>
                <div class="col-md-125">
                    @Html.TextBox("LocalTaxes", null,
                                  htmlAttributes: new { @class = "form-control", id = "localTaxes" })
                </div>
                <label for="stateTaxes" class="control-label col-md-125 caption">State Taxes:</label>
                <div class="col-md-125">
                    @Html.TextBox("StateTaxes", null, htmlAttributes: new { @class = "form-control", id = "stateTaxes" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="pdd" class="control-label col-md-125 caption">Payment Due Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("PaymentDueDate", null,
                                  htmlAttributes: new { @class = "form-control", type = "date", id = "pdd" })
                </div>
                <label for="amtDue" class="control-label col-md-125 caption">Amount Due:</label>
                <div class="col-md-125">
                    @Html.TextBox("AmountDue", null,
                                  htmlAttributes: new { @class = "form-control", id = "amtDue" })
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-4 caption">&nbsp;</label>
                <div class="col-md-125">&nbsp;</div>
                <label for="lpdd" class="control-label col-md-125 caption">Late Payment Due Date:</label>
                <div class="col-md-125">
                    @Html.TextBox("LatePaymentDueDate", null,
                                  htmlAttributes: new { @class = "form-control", id = "lpdd" })
                </div>
                <label for="lateAmtDue" class="control-label col-md-125 caption">Late Amount Due:</label>
                <div class="col-md-125">
                    @Html.TextBox("LateAmountDue", null, htmlAttributes: new { @class = "form-control", id = "lateAmtDue" })
                </div>
            </div>
    
            <div class="form-group text-center">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Water Bills", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Update Water Bill" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }

21. Click the WaterBillsController.cs tab
22. In the document, right-click one of the Delete() methods and click Add View...
23. In the Add View dialog box, make sure the View Name text box is displayinig Delete. Click Add
24. Create the webpage as follows:

    @{
        ViewBag.Title = "Delete Water Bill";
    }
    
    <div class="push-down">
        <h2>Cancel Water Bill</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt class="bold">Water Bill ID:</dt>
            <dd>@ViewData["WaterBillID"]</dd>
            <dt class="bold">Invoice #:</dt>
            <dd>@ViewData["InvoiceNumber"]</dd>
            <dt class="bold">Account #:</dt>
            <dd>@ViewData["AccountNumber"]</dd>
            <dt class="bold">Meter Reading Start Date:</dt>
            <dd>@ViewData["MeterReadingStartDate"]</dd>
            <dt class="bold">Meter Reading End Date:</dt>
            <dd>@ViewData["MeterReadingEndDate"]</dd>
            <dt class="bold">Billing Days:</dt>
            <dd>@ViewData["BillingDays"]</dd>
            <dt class="bold">Counter Reading Start:</dt>
            <dd>@ViewData["CounterReadingStart"]</dd>
            <dt class="bold">Counter Reading End:</dt>
            <dd>@ViewData["CounterReadingEnd"]</dd>
            <dt class="bold">Total HCF:</dt>
            <dd>@ViewData["TotalHCF"]</dd>
            <dt class="bold">Total Gallons:</dt>
            <dd>@ViewData["TotalGallons"]</dd>
            <dt class="bold">First 15 HCF:</dt>
            <dd>@ViewData["First15HCF"]</dd>
            <dt class="bold">Next 10 HCF:</dt>
            <dd>@ViewData["Next10HCF"]</dd>
            <dt class="bold">Remaining HCF:</dt>
            <dd>@ViewData["RemainingHCF"]</dd>
            <dt class="bold">Sewer Charges:</dt>
            <dd>@ViewData["SewerCharges"]</dd>
            <dt class="bold">Storm Charges:</dt>
            <dd>@ViewData["StormCharges"]</dd>
            <dt class="bold">Water Usage Charges:</dt>
            <dd>@ViewData["WaterUsageCharges"]</dd>
            <dt class="bold">Total Charges:</dt>
            <dd>@ViewData["TotalCharges"]</dd>
            <dt class="bold">Local Taxes:</dt>
            <dd>@ViewData["LocalTaxes"]</dd>
            <dt class="bold">State Taxes:</dt>
            <dd>@ViewData["StateTaxes"]</dd>
            <dt class="bold">Payment Due Date:</dt>
            <dd>@ViewData["PaymentDueDate"]</dd>
            <dt class="bold">Amount Due:</dt>
            <dd>@ViewData["AmountDue"]</dd>
            <dt class="bold">Late Payment Due Date:</dt>
            <dd>@ViewData["LatePaymentDueDate"]</dd>
            <dt class="bold">Late Amount Due:</dt>
            <dd>@ViewData["LateAmountDue"]</dd>
        </dl>
    
        <h3 class="common-font caption">Are you sure you want to cancel this water bill (if you do, the bill will disappear from the system)?</h3>
    
        @using (Html.BeginForm())
        {
            <div class="form-actions no-color">
                <input type="submit" value="Cancel this Water Bill" class="btn btn-primary" /> |
                @Html.ActionLink("Customers Water Bills", "Index", null, new { @class = "water-nav" })
            </div>
        }
    </div>

Payments

Bills payments are the means by which a company make smoney. Now, we will create the webpages necessary to create and manage payments.

Practical Learning: Making Payments

1. In the Solution Explorer, right-click Controllers -> Add -> New Scaffolded Item...
2. In the middle frame of the Add Scaffold dialog box, make sure MVC 5 Controller With Read/Write Actions is selected.
   Click Add
3. Type Payments to get PaymentsControllers
4. Press Enter
5. Change the class as follows:

   using System;
   using System.IO;
   using System.Xml;
   using System.Linq;
   using System.Web.Mvc;
   
   namespace WaterDistributionCompany1.Controllers
   {
       public class PaymentsController : Controller
       {
           // GET: Payments
           public ActionResult Index()
           {
               XmlDocument xdPayments = new XmlDocument();
               string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
               if (System.IO.File.Exists(strFilePayments))
               {
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdPayments.Load(fsPayments);
                   }
   
                   if (xdPayments.DocumentElement.ChildNodes.Count > 0)
                   {
                        ViewData["Payments"] = xdPayments.DocumentElement.ChildNodes;
                   }
                   else
                   {
                        ViewData["Payments"] = null;
                   }
               }
   
               return View();
           }
   
           // GET: Payments/Details/5
           public ActionResult Details(int id)
           {
               XmlDocument xdPayments = new XmlDocument();
               string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
               if (System.IO.File.Exists(strFilePayments))
               {
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdPayments.Load(fsPayments);
   
                       XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                       foreach (XmlNode xnPayment in xnlPayments)
                       {
                           if (xnPayment.InnerText == id.ToString())
                           {
                                ViewData["PaymentID"]     = xnPayment.InnerText;
                                ViewData["ReceiptNumber"] = xnPayment.NextSibling.InnerText;
                                ViewData["WaterBillID"]   = xnPayment.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDate"]   = xnPayment.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentAmount"] = xnPayment.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // GET: Payments/Create
           public ActionResult Create()
           {
               int payment_id = 0;
               XmlDocument xdPayments = new XmlDocument();
               string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
               if (System.IO.File.Exists(strFilePayments))
               {
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdPayments.Load(fsPayments);
   
                       XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                       foreach (XmlNode xnPayment in xnlPayments)
                       {
                           payment_id = int.Parse(xnPayment.FirstChild.InnerText);
                       }
                   }
               }
   
               ViewData["PaymentID"] = (payment_id + 1);
   
               Random rndNumber = new Random();
               ViewData["ReceiptNumber"] = rndNumber.Next(100001, 999999).ToString();
   
               return View();
           }
   
           // POST: Payments/Create
           [HttpPost]
           public ActionResult Create(FormCollection collection)
           {
               try
               {
                   // TODO: Add insert logic here
                   // int pmtId = 0;
                   XmlDocument xdPayments = new XmlDocument();
                   string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
                   if (System.IO.File.Exists(strFilePayments))
                   {
                       using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdPayments.Load(fsPayments);
   
                           /* XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                           foreach (XmlNode xnPayment in xnlPayments)
                           {
                               pmtId = int.Parse(xnPayment.InnerText);
                           } */
                       }
                   }
                   else
                   {
                       xdPayments.LoadXml("<?xml version=\"1.0\" encoding=\"utf-8\"?>" +
                                          "<payments></payments>");
                       // pmtId = 0;
                   }
   
                   // pmtId++;
   
                   XmlElement xePayment = xdPayments.CreateElement("payment");
   
                   xePayment.InnerXml = "<payment-id>"     + collection["PaymentID"]     + "</payment-id>"     +
                                        "<receipt-number>" + collection["ReceiptNumber"] + "</receipt-number>" +
                                        "<water-bill-id>"  + collection["WaterBillID"]   + "</water-bill-id>"  +
                                        "<payment-date>"   + collection["PaymentDate"]   + "</payment-date>"   +
                                        "<payment-amount>" + collection["PaymentAmount"] + "</payment-amount>";
   
                   xdPayments.DocumentElement.AppendChild(xePayment);
   
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.OpenOrCreate, FileAccess.ReadWrite, FileShare.ReadWrite))
                   {
                       xdPayments.Save(fsPayments);
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: Payments/Edit/5
           public ActionResult Edit(int id)
           {
               XmlDocument xdPayments = new XmlDocument();
               string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
               if (System.IO.File.Exists(strFilePayments))
               {
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdPayments.Load(fsPayments);
   
                       XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                       foreach (XmlNode xnPayment in xnlPayments)
                       {
                           if (xnPayment.InnerText == id.ToString())
                           {
                                ViewData["PaymentID"]     = xnPayment.InnerText;
                                ViewData["ReceiptNumber"] = xnPayment.NextSibling.InnerText;
                                ViewData["WaterBillID"]   = xnPayment.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDate"]   = xnPayment.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentAmount"] = xnPayment.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: Payments/Edit/5
           [HttpPost]
           public ActionResult Edit(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add update logic here
                   XmlDocument xdPayments = new XmlDocument();
                   string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
                   if (System.IO.File.Exists(strFilePayments))
                   {
                       using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           xdPayments.Load(fsPayments);
                       }
   
                       XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                       using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Truncate, FileAccess.ReadWrite, FileShare.ReadWrite))
                       {
                           foreach (XmlNode xnPayment in xnlPayments)
                           {
                               if (xnPayment.InnerText == id.ToString())
                               {
                                   xnPayment.ParentNode.InnerXml = "<payment-id>"     + id                          + "</payment-id>"     +
                                                                   "<receipt-number>" + collection["ReceiptNumber"] + "</receipt-number>" +
                                                                   "<water-bill-id>"  + collection["WaterBillID"]   + "</water-bill-id>"  +
                                                                   "<payment-date>"   + collection["PaymentDate"]   + "</payment-date>"   +
                                                                   "<payment-amount>" + collection["PaymentAmount"] + "</payment-amount>";
                                   xdPayments.Save(fsPayments);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
   
           // GET: Payments/Delete/5
           public ActionResult Delete(int id)
           {
               XmlDocument xdPayments = new XmlDocument();
               string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
               if (System.IO.File.Exists(strFilePayments))
               {
                   using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                   {
                       xdPayments.Load(fsPayments);
   
                       XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment-id");
   
                       foreach (XmlNode xnPayment in xnlPayments)
                       {
                           if (xnPayment.InnerText == id.ToString())
                           {
                                ViewData["PaymentID"]     = xnPayment.InnerText;
                                ViewData["ReceiptNumber"] = xnPayment.NextSibling.InnerText;
                                ViewData["WaterBillID"]   = xnPayment.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentDate"]   = xnPayment.NextSibling.NextSibling.NextSibling.InnerText;
                                ViewData["PaymentAmount"] = xnPayment.NextSibling.NextSibling.NextSibling.NextSibling.InnerText;
                           }
                       }
                   }
               }
   
               return View();
           }
   
           // POST: Payments/Delete/5
           [HttpPost]
           public ActionResult Delete(int id, FormCollection collection)
           {
               try
               {
                   // TODO: Add delete logic here
                   XmlDocument xdPayments = new XmlDocument();
                   string strFilePayments = Server.MapPath("/WaterDistribution/Payments.xml");
   
                   if (System.IO.File.Exists(strFilePayments))
                   {
                       using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Open, FileAccess.Read, FileShare.Read))
                       {
                           xdPayments.Load(fsPayments);
                       }
   
                       using (FileStream fsPayments = new FileStream(strFilePayments, FileMode.Truncate, FileAccess.Write, FileShare.Write))
                       {
                           XmlNodeList xnlPayments = xdPayments.GetElementsByTagName("payment");
   
                           foreach (XmlNode xnPayment in xnlPayments)
                           {
   
                               if (xnPayment.FirstChild.InnerText == id.ToString())
                               {
                                   xnPayment.ParentNode.RemoveChild(xnPayment);
                                   xdPayments.Save(fsPayments);
                                   break;
                               }
                           }
                       }
                   }
   
                   return RedirectToAction("Index");
               }
               catch
               {
                   return View();
               }
           }
       }
   }

6. In the class, right-click Index() and click Add View...
7. Make sure the View Name text box is displaying Index. Click Add
8. Change document as follows:

   @{
       ViewBag.Title = "Water Bills Payments";
   }
   
   <div class="push-down">
       <h2 class="common-font bold text-center">Water Bills Payments</h2>
   </div>
   
   <hr />
   
   <table class="table table-striped common-font">
       <tr>
           <th class="bold">Payment ID</th>
           <th class="bold">Receipt #</th>
           <th class="bold">Water Bill ID</th>
           <th class="bold">Payment Date</th>
           <th class="bold">Payment Amount</th>
           <th>@Html.ActionLink("New Bill Payment", "Create", null, htmlAttributes: new { @class = "water-nav" })</th>
       </tr>
   
       @if (ViewData["Payments"] != null)
       {
           foreach (System.Xml.XmlNode pmt in ViewData["Payments"] as System.Xml.XmlNodeList)
           {
               <tr>
                   <td class="text-center">@pmt.FirstChild.InnerText</td>
                   <td>@pmt.FirstChild.NextSibling.InnerText</td>
                   <td>@pmt.FirstChild.NextSibling.NextSibling.InnerText</td>
                   <td>@pmt.FirstChild.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>@pmt.FirstChild.NextSibling.NextSibling.NextSibling.NextSibling.InnerText</td>
                   <td>
                       @Html.ActionLink("Update", "Edit", new { id = pmt.FirstChild.InnerText }) <span style="color: aquamarine">::</span>
                       @Html.ActionLink("Review", "Details", new { id = pmt.FirstChild.InnerText }) <span style="color: aquamarine">::</span>
                       @Html.ActionLink("Remove", "Delete", new { id = pmt.FirstChild.InnerText })
                   </td>
               </tr>
           }
       }
   </table>

9. Click the PaymentsController.cs tab
10. In the class, right-click Details() and click Add View...
11. Make sure the View Name text box is displaying Details. Click Add
12. Chang the document as follows:

    @{
        ViewBag.Title = "Water Bill Details";
    }
    
    <div class="push-down">
        <h2>Water Bill Details</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt class="bold">Payment ID:</dt>
            <dd>@ViewData["PaymentID"]</dd>
            <dt>Receipt #:</dt>
            <dd>@ViewData["ReceiptNumber"]</dd>
            <dt>Water Bill ID:</dt>
            <dd>@ViewData["WaterBillID"]</dd>
            <dt>Payment Date:</dt>
            <dd>@ViewData["PaymentDate"]</dd>
            <dt>Payment Amount:</dt>
            <dd>@ViewData["PaymentAmount"]</dd>
        </dl>
    </div>
    
    <p class="text-center">
        @Html.ActionLink("Edit/Update Bill Payment", "Edit",
                          new { id = ViewData["PaymentID"] }, htmlAttributes: new { @class = "water-nav" }) ::
        @Html.ActionLink("Water Bill Payments", "Index",
                         null, new { @class = "water-nav" })
    </p>

13. Click the PaymentsController.cs tab
14. In the document, righte-click Create() and click Add View...
15. In the Add View dialog box, make sure the View Name text box is displaying Create. Click Add
16. Change the document as follows:

    @{
        ViewBag.Title = "Create Bill Payment";
    }
    
    <div class="push-down">
        <h2>Make Water Bill Payment</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
    <div class="form-horizontal">
        <div class="form-group">
            <label for="pmtId" class="control-label col-md-4 caption">Payment ID:</label>
            <div class="col-md-8">
                @Html.TextBox("PaymentID", null, htmlAttributes: new { @class = "form-control", id = "pmtId" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="mtrNbr" class="control-label col-md-4 caption">Receipt #:</label>
            <div class="col-md-8">
                @Html.TextBox("ReceiptNumber", null, htmlAttributes: new { @class = "form-control", id = "mtrNbr" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="billId" class="control-label col-md-4 caption">Water Bill ID:</label>
            <div class="col-md-8">
                @Html.TextBox("WaterBillID", null, htmlAttributes: new { @class = "form-control", id = "billId" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="pmtDate" class="control-label col-md-4 caption">Payment Date:</label>
            <div class="col-md-8">
                @Html.TextBox("PaymentDate", null, htmlAttributes: new { @class = "form-control", id = "pmtDate" })
            </div>
        </div>
    
        <div class="form-group">
            <label for="pmtAmt" class="control-label col-md-4 caption">Payment Amount:</label>
            <div class="col-md-8">
                @Html.TextBox("PaymentAmount", null, htmlAttributes: new { @class = "form-control", id = "pmtAmt" })
            </div>
        </div>
    
        <div class="form-group">
            <label class="control-label col-md-5">
                @Html.ActionLink("Bills Payments", "Index", null, htmlAttributes: new { @class = "water-nav" })
            </label>
            <div class="col-md-7">
                <input type="submit" value="Create Bill Payment" class="btn btn-primary" />
            </div>
        </div>
    </div>
    }

17. Click the PaymntsControllers.cs tab
18. In the PaymentsController class, right-click one of the Edit() methods and click Add View...
19. Make sure the View Name text box is displaying Edit. Click Add
20. Change the webpage as follows:

    @{
        ViewBag.Title = "Edit/Update Bill Payment";
    }
    
    <div class="push-down">
        <h2>Edit/Update Bill Payment</h2>
    </div>
    
    <hr />
    
    @using (Html.BeginForm())
    {
        <div class="form-horizontal">
            <div class="form-group">
                <label class="control-label col-md-4 caption">Payment ID:</label>
                <div class="col-md-8">
                    @Html.TextBox("PaymentID", null,
                                  htmlAttributes: new { @class = "form-control", disabled = "disabled" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="recNbr" class="control-label col-md-4 caption">Receipt #:</label>
                <div class="col-md-8">
                    @Html.TextBox("ReceiptNumber", null, htmlAttributes: new { @class = "form-control", id = "recNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="billNbr" class="control-label col-md-4 caption">Account #:</label>
                <div class="col-md-8">
                    @Html.TextBox("WaterBillID", null, htmlAttributes: new { @class = "form-control", id = "billNbr" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="pmtDate" class="control-label col-md-4 caption">Payment Date:</label>
                <div class="col-md-8">
                    @Html.TextBox("PaymentDate", null,
                                  htmlAttributes: new { @class = "form-control", type = "date", id = "pmtDate" })
                </div>
            </div>
    
            <div class="form-group">
                <label for="pmtAmt" class="control-label col-md-4 caption">Payment Amount:</label>
                <div class="col-md-8">
                    @Html.TextBox("PaymentAmount", null, htmlAttributes: new { @class = "form-control", id = "pmtAmt" })
                </div>
            </div>
    
            <div class="form-group">
                <label class="control-label col-md-5">
                    @Html.ActionLink("Bills Payments", "Index", null, htmlAttributes: new { @class = "water-nav" })
                </label>
                <div class="col-md-7">
                    <input type="submit" value="Update this Payment" class="btn btn-primary" />
                </div>
            </div>
        </div>
    }

21. Click the PaymentsController.cs tab
22. In the document, right-click one of the Delete() methods and click Add View...
23. Make sure the View Name text box is displaying Delete. Click Add
24. Create the wepbpage as follows:

    @{
        ViewBag.Title = "Delete Bill Payment";
    }
    
    <div class="push-down">
        <h2>Delete Bill Payment</h2>
    </div>
    
    <hr />
    
    <div class="containment">
        <dl class="dl-horizontal common-font caption">
            <dt>Payment ID:</dt>
            <dd>@ViewData["PaymentID"]</dd>
            <dt>Receipt #:</dt>
            <dd>@ViewData["ReceiptNumber"]</dd>
            <dt>Water Bill ID:</dt>
            <dd>@ViewData["WaterBillID"]</dd>
            <dt>Payment Date:</dt>
            <dd>@ViewData["PaymentDate"]</dd>
            <dt>Payment Amount:</dt>
            <dd>@ViewData["PaymentAmount"]</dd>
        </dl>
    
        <h3 class="common-font caption">Are you sure you want to cancel this payment?</h3>
    
        @using (Html.BeginForm())
        {
            <div class="form-actions no-color">
                <input type="submit" value="Cancel this bill payment" class="btn btn-primary" /> |
                @Html.ActionLink("Water Bills Payments", "Index", null, new { @class = "water-nav" })
            </div>
        }
    </div>

Finalizing the Application

Most of the time, it is a good idea to apply a common design to most webpages of a website. In ASP.NET, such a design is created as a layout view.

Practical Learning: Finalizing the Application

1. In the Solution Explorer, under Views, expand Shared
2. Click _Layout.cshtml and change the document as follows:

   <!DOCTYPE html>
   <html>
   <head>
       <meta charset="utf-8" />
       <meta name="viewport" content="width=device-width, initial-scale=1.0">
       <title>@ViewBag.Title - Water for a Shining Life</title>
       @Styles.Render("~/Content/css")
       @Scripts.Render("~/bundles/modernizr")
   </head>
   <body>
       <div class="top-bar">
           <div class="containment"><img src="~/Images/wsl1.png" alt="Water for a Shining Life" width="490" height="92" /></div>
       </div>
   
       <div class="navbar navbar-inverse navbar-fixed-top">
           <div class="container">
               <div class="navbar-header">
                   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                   </button>
                   @Html.ActionLink("Home", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
               </div>
               <div class="navbar-collapse collapse">
                   <ul class="nav navbar-nav">
                       <li>@Html.ActionLink("Emergency Services", "Index", "Home")</li>
                       <li>@Html.ActionLink("Cummunity", "Index", "Home")</li>
                       <li>@Html.ActionLink("Environment", "Index", "Home")</li>
                       <li>@Html.ActionLink("Resources", "Index", "Home")</li>
                       <li>@Html.ActionLink("Projects", "Index", "Home")</li>
                       <li>@Html.ActionLink("Customer Service", "Index", "Home")</li>
                       <li>@Html.ActionLink("Employment", "Index", "Home")</li>
                       <li>@Html.ActionLink("Questions?", "Index", "Home")</li>
                       <li>@Html.ActionLink("About", "About", "Home")</li>
                       <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                   </ul>
               </div>
           </div>
       </div>
       <div class="container body-content">
           @RenderBody()
           <hr />
           <footer>
               <p class="copyright text-center common-font">&copy; @DateTime.Now.Year - Water for a Shining Life</p>
           </footer>
       </div>
   
       @Scripts.Render("~/bundles/jquery")
       @Scripts.Render("~/bundles/bootstrap")
       @RenderSection("scripts", required: false)
   </body>
   </html>

3. In the Solution Explorer, under Views, expand Home, and click Index.cshtml
4. Change the document as follows:

   <div class="jumbotron">
       <h2>.</h2>
       <p class="lead">
           Our water utility company provides energy, greatness, and warmth
           for a everyday life, a shining life. We provide solutions to families, businesses,
           and the community.
       </p>
   
       <p class="lead">
           This is the employees portal section of the company. From here,
           employees can register a new water meter, manage a customer account, or
           create a water bill.
       </p>
   </div>
   
   <div class="row">
       <div class="col-md-3">
           <h2>Water Meters</h2>
           <p>
               Our company uses the most accurate, sophisticated, and environment-friendly
               water meters on the market.
           </p>
           <p>@Html.ActionLink("Water Meters", "Index", "WaterMeters", null, new { @class = "btn btn-primary" })</p>
       </div>
       <div class="col-md-3">
           <h2>Customers</h2>
           <p>
               We supply water to individuals, families, small
               businesses, as well as enterprises or government agencies.
           </p>
           <p>@Html.ActionLink("Customers", "Index", "Customers", null, new { @class = "btn btn-primary" })</p>
       </div>
       <div class="col-md-3">
           <h2>Water Bills</h2>
           <p>
               Our water rates are very competitive nationwide. We use precise,
               effective, and strict algorithms when calculating our bills.
           </p>
           <p>@Html.ActionLink("Bills/Invoices", "Index", "WaterBills", null, new { @class = "btn btn-primary" })</p>
       </div>
       <div class="col-md-3">
           <h2>Payments</h2>
           <p>
               Our payment system is the simplest, the fairest, and the fastest. Our custiomer's service
               is highly rated.
           </p>
           <p>@Html.ActionLink("Bills Payments", "Index", "Payments", null, new { @class = "btn btn-primary" })</p>
       </div>
   </div>

5. To execute the application, on the main menu, click Debug -> Start Without Debugging

   

6. Click the Water Meters button

   

7. Click the New Water Meter link

   

8. Create the following records:
    

   Meter #	Make	Model	Meter Size	Date Last Update	Counter Value
   392-44-572	Constance Technologies	TG-4822	5/8 Inches	03/31/2018	109992
   938-75-869	Standard Trend	266G	1 1/2 Inches	10/22/2017	137926
   799-28-461	Constance Technologies	BD-7000	3/4 Inches	05/05/2018	6268
   207-94-835	Constance Technologies	TG-6220	5/8 Inches	02/17/2018	96
   592-84-957	Standard Trend	428T	3/4 Inches	12/07/2018	49
   28358958	Igawa International	TR6224	3/4 Inches	04/22/2012	1138

   

9. Click the Review link that corresponds to the fourth record

   

10. Click the Water Meters link
11. Click the Review link of the last record

    

12. Click the Edit/Update Water Meter Information link
13. Change the following values:

    Meter #:         283-58-958
    Make:            Constance Technologies
    Model:           TR-6224
    Date Last Udate: 04/22/2022

    

14. Click Update Water Meter Details

    

15. Click the Home link
16. In the webpage, click the Customers link

    

17. Click the New Customer Account link

    

18. Create the following records:
    

    Account #	Meter #	First Name	Last Name	Address	City	County	State	ZIP Code
    9279-570-8394	799-28-461	Thomas	Stones	10252 Broward Ave #D4	Frederick	Frederick	MD	21703
    4820-375-2842	392-44-572	Akhil	Koumari	748 Red Hills Rd	Roanoke		VA	24012
    7518-302-6895	207-94-835	Grace	Brenner	4299 Peachtree Court	Rockville	Montgomery	MD	20853
    2038-413-9680	938-75-869	Amidou	Gomah	2075 Rose Hills Ave	Washington		DC	20004
    5938-074-5293	592-84-957	Marie	Rath	582G Dunhill Ave	Lanham	Prince George	MD	20706
    28864153060	392-44-572	Janice	Edson	10304 Rolando Drv	Anderson		PA	17262

    

19. Click the Home link
20. Click the Bills/Invoices button

    

21. Click the New Water Bill link

    

22. To start a record, in the Customer Account # text box, type 7518-302-6895 and press Tab

    

23. In the Meter Reading End Date text box, type 7/30/2022 and press Tab

    

24. In the Current Meter Reading text box, type 114 and press Tab

    

25. Enter the following two values:

    Payment Due Date:      08/27/2022
    Late Payment Due Date: 09/13/2022

    

26. Click the Save Water Bill button
27. Click the New Water Bill link
28. Create a few records with the following values:
    
    

    Account #	Meter Reading End Date	Current Meter Reading	Payment Due Date	Late Payment Due Date
    4820-375-2842	07/31/2022	109998	08/28/2022	09/14/2022
    2038-413-9680	7/30/2022	137975	8/27/2022	9/13/2022
    9279-570-8394	08/07/2022	6275	08/04/2022	08/20/2022
    7518-302-6895	11/07/2022	118	12/01/2022	12/15/2022
    2038-413-9680	10/27/2022	138012	11/24/2022	12/10/2022

    

29. Click the Home link
30. click the Bills Payments button

    

31. Click the New Bill Payment link

    

32. Create a few records with the following values:
    
    

    Receipt #	Bill ID	Payment Date	Payment Amount
    625288	2	08/24/2022	145.75
    836168	3	09/12/2022	198.36
    886415	1	08/27/2022	93.34
    724705	4	09/01/2022	41.31
    141806	6	12/05/2022	163.40
    706953	5	12/10/2022	27.44

    

33. Close the browser and return to your programming environment
34. Close your programming environment

Home	Copyright © 2005-2022, FunctionX	Friday 06 May 2022	Home