3014–Product List Form

Background

We want to create a product form by using jQuery.

Assume we have the following product items:

var items = [
  {name: "Sample Product A", price: 30},
  {name: "Sample Product B", price: 59.9},
  {name: "Sample Product C", price: 20},
];

We want to let user select one or multiple of them in the form. For each selected product, user can select different amount of them. User can also input a discount ratio. All the subtotals and total cost are then calculated by the jQuery program.

Requirement

The following video demonstrates the functionality.