Todo App10:17 with Alena Holligan
Let's put together the skills you've learned in this course to add functionality to our todo app. We'll start by displaying either complete, incomplete, or all tasks. In doing so, we'll take a closer look at how some of the comparisons work in conditional statements and how to use a secondary array to access array elements.
In PHP, when a value comparison is made with one of the element being a boolean value, each element is evaluated as a boolean.
Comparing EQUAL VALUES (empty string equals false, but any other string equals true) ('all' == 'all') equals true (after type juggling) (false == 'all') equals false (after type juggling) (true == 'all') equals true (after type juggling) (false == '') equals true (after type juggling) (true == '') equals false (after type juggling)
Comparing IDENTICAL Values and of the same type. ('all' === 'all') equals true (false === 'all') equals false (true === 'all') equals false (false === '') equals false (true === '') equals false
Let's put together that skills that you've learned in this course 0:00 to add functionality to our to do app. 0:03 We'll start by displaying only completed or incomplete tasks, then we'll 0:06 explore sorting multi dimensional arrays, using a particular inner key element. 0:11 For our to do list, this would be the title, priority, due date or 0:16 completion status. 0:20 We'll start by displaying only complete or incomplete tasks. 0:23 Within the table, we are looping through each item in our array. 0:27 We then check the complete status to show yes or 0:33 no, whether the item is complete or not. 0:37 We could use this same conditional at the top of our for each loop, 0:41 wrapping the entire row in a conditional. 0:45 When we refresh the browser we see that only the complete items show. 0:58 We're going to be adding more filters to this data so 1:05 let's remove the conditional from the display. 1:08 Now we'll go up to the top of the page. 1:14 For each of these new filter features, 1:17 we're going to create a list of keys in a particular order. 1:19 We will then use those keys to access particular items in our list. 1:24 Let's create a new array named filter. 1:30 We're going to loop through each item in the list array, and 1:36 I want both the key and the value. 1:40 So we can use the top for each loop that we set up last time. 1:43 Let's add the filter for complete status. 1:47 We add a conditional, if item, Complete, 1:50 And if the item is complete, we add the key to the filter array. 1:59 We're only adding the key to our filter, but I wanna see the details. 2:11 So I'm going to do a var dump of both the key and the item. 2:16 Var_dump($key,$item);. 2:20 Let's surround the dump with pre tags so 2:26 that it will display with line breaks in a browser and make it easier to read. 2:27 After the loop let's var dump the filter array and 2:40 the list array as well to see what we have. 2:43 We'll copy this whole dump with the pre tags. 2:48 And we'll dump filter, and list. 2:57 Now let's take a look at this in the browser again. 3:02 The value from our filter array corresponds to the key 3:08 from the dump in the loop. 3:13 There is only a single key, item dump, and only a single item in the filter array. 3:17 This is because there is only a single complete item in our list array. 3:24 If we scroll down we can also see this item in our list array. 3:29 Now that we know what our array looks like, 3:38 let's remove this dump from our loop and we'll comment out the dump here. 3:40 The filter array contains only the item keys we wish to show. 3:48 So we can use the values from our filter array to show the items 3:54 from our list array. 3:58 Instead of looking through the list array for 4:01 our table, we'll loop through the filter array. 4:04 In this way we will use only the items in the filter array. 4:08 I'm going to rename the item variable to id. 4:12 This is because it identifies the list item we're going to use. 4:16 The variable item no longer exists because we changed it to the id. 4:21 Instead of using the item variable in our display, 4:26 we're going to reference the list directly through its index id. 4:30 So, we'll use list and then we use the id from our loop. 4:35 Let's change item for list id for each field. 4:43 Making sure we don't forget the complete status. 4:52 Now let's go back to the browser. 4:57 The table shows only the items that are complete, this is nice. 5:01 But we probably want to be able to show incomplete items. 5:05 We could change our conditional to look for 5:11 a false value instead, by putting our negation operator right here. 5:14 But let's make it easy to change between complete and incomplete statuses. 5:20 Instead of hard coding the status into our conditional, 5:26 we're going to check if the item complete equals the variable status. 5:31 We can then use a variable status to represent a true-false value, 5:38 we'll add this to the top of our file. 5:43 $status = false, this will allow us to make changes 5:46 to what our script would display right at the top of the file. 5:51 Our status is set to false, so, let's go back to the browser. 5:57 Now we see our list of incomplete items. 6:03 Let's change status to true. 6:07 And this time we see a list where our status is complete. 6:13 Finally, I still may want to see all items. 6:16 So let's add the ability to set the status equal to all. 6:20 Because we're using the filter array for the display, 6:28 I named my filter array to be set, so I can't just skip this top loop entirely. 6:31 Instead, I'm going to use another conditional. 6:37 To check if $status = all. 6:42 And this is going to be an either or condition. 6:50 Either the status should be all or 6:54 the status should equal the status of complete. 6:56 In PHP, when a value comparison is made with one of the elements 7:01 being a boolean value each element is evaluated as a boolean. 7:06 Let me show you what this means in practice, we'll use this var_dump. 7:11 I'm going to dump the status and the boolean value of the string all. 7:23 Then I will also dump the value of the comparison of $status = 'all'. 7:33 Let's go back to the browser with our status equal to all. 7:42 The status variable equals the string all, but 7:47 the boolean value of the string all is true, because any string, 7:50 besides an empty string, evaluates to true. 7:56 Finally, the value of the string's status equals the string all, so 8:00 this evaluates to true. 8:05 For this comparison, a double equals works, and we see all items. 8:07 Let's change the status variable to false. 8:13 Now we see that our status is false, but 8:24 the boolean value of the string all is still true. 8:27 So the comparison of the value of the boolean status to 8:31 the value of the string all equals false. 8:35 Once again, the double equals works, and 8:39 we see only the incomplete items, but we haven't checked true. 8:41 Let's change the status variable to true. 8:47 This time, we see that our status is equal to true, and 8:54 the boolean value of all is equal to true. 8:59 So comparing the value of status to the boolean value of all equals true. 9:02 This means that instead of showing only the complete items, we see all items. 9:09 Instead of comparing only the value, we need to make sure that this is identically 9:16 matching both the type and the value using a triple equals. 9:21 Let's change both our conditional and our dump to the triple equal. 9:26 Now I see, that although the status is true and 9:35 the boolean value of all is true, the types boolean and string do not match. 9:39 So my comparison is false, and we see only the complete items that we want. 9:46 Let's check this with false again. 9:51 We once again see only incomplete items. 10:02 And finally let's check all again. 10:07 And once again, we see all items. 10:13
You need to sign up for Treehouse in order to download course files.Sign up