1.7.4.Returning Hierarchical Data

--

  • 1.Create a DTO class for MembershipType

      namespace Vidly2.Dtos
      {
          public class MembershipTypeDto
          {
              public byte Id { get; set; }
              public short SignUpFee { get; set; }
              public byte DurationInMonth { get; set; }
              public byte DiscountRate { get; set; }
              public string Name { get; set; }
    
              public static readonly byte Unknown = 0;
              public static readonly byte PayAsYouGo = 1;
          }
      }
  • 2.Modify App_Start/MappingProfile.cs

      Mapper.CreateMap<MembershipType, MembershipTypeDto>();
  • 3.Add a MembershipTypeDto member to CustomerDto

    public MembershipTypeDto membershipType { get; set; }

  • 4.Modify CustomersController to include MembershipType

       using System.Data.Entity;
       public IHttpActionResult GetCustomers()
          {
              var customerDtos = _context.Customers
                  .Include(c => c.membershipType)
                  .ToList()
                  .Select(Mapper.Map<Customer, CustomerDto>);
              return Ok(customerDtos);
          }
  • 5.Modify index.cshtml

      <script>
     $(document).ready(function () {
      var table = $('#customers').DataTable({
       ajax: {
        url: "/api/customers",
        dataSrc: ""
       },
       columns: [
        {
         data: "name",
         render: function (data, type, customer) {
          return "<a fref = '/customers/edit/" + customer.id + "'>" + customer.name + "</a>";
         }
        },
        {
         data: "membershipType.name"
        },
        {
         data: "id",
         render: function (data) {
          return "<button class='btn-link js-delete' data-customer-id" + data + ">Delete</button>";
         }
        }
       ]
      });
      $("#customers").on("click", ".js-delete", function () {
       var button = $(this);
    
       bootbox.confirm("Are you want to delete this customer?", function (result) {
        if (result) {
         $.ajax({
          url: "/api/customers/" + button.attr("data-customer-id"),
          method: "DELETE",
          success: function () {
           table.row(button.parents("tr")).remove().draw();
          }
         });
       };
      });
      });
     });
    </script>

Last updated