Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- Plain Language Explanation of 3 User Stories
- 1.You should be able to add items to the list:
- handleNewItemSubmit() will contain an event listener on submit form id ($('#js-shopping-list-form')) and input for name entry
- will be added to STORE with a unique id. generateShoppingItemsString() and generateItemElement will manipulate the DOM
- and update the display of shopping list following renderShoppingList().
- 2.You should be able to check items on the list:
- generateItemElement() provides a class name parameter for checked status that is linked to CSS strike-through style. An event
- listener on the individual list item class ($('.button-label') will toggleClass for the "shopping-item__checked" class
- which will effectively remove and add strike-through styles for unchecked and checked items respectively.
- 3.You should be able to delete items from the list:
- generateItemElement() provides a "js-item-delete" class on the button element labeled "Delete" for each individual list item.
- Attaching an event listener ($('.js-item-delete')) and grabbing the id value from the closest 'li' of the selected item
- with .data('id') can be used to remove the item by id from the STORE.
- Afterwards, renderShopping() will display the remaining items with id's that don't match the one selected because
- they're all uniquely generated.
Add Comment
Please, Sign In to add comment