Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

ASP.NET MVC Forms

Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Completing the “Activity” Field Drop Down List

4:33 with James Churchill

Now that we’ve seen how to work with drop down lists, let’s wrap up work on the “Activity” field.

Follow Along

To follow along, you’ll need to go back a step, as this video is a continuation of the previous video.

Additional Learning

If you want to learn more about dynamic types in C# or need a refresher, see this page on MSDN.

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    Now that we've seen some examples of how to create items for 0:00
    the drop down list for method using temporary data, 0:03
    let's work on the actual implementation by updating our action methods. 0:06
    I'll add a property on the ViewBag object ActivitiesSelectListItems 0:12
    and set it to an instance of SelectList. 0:18
    Passing in the Data.Data.Activites, 0:22
    static collection. 0:28
    And the names of the properties for the value, And text fields. 0:31
    This looks odd, but it's correct. 0:40
    The first Data is the namespace for our data static class. 0:43
    Let's also remove this line of code that's setting the ActivityId property. 0:47
    Drop down list items don't automatically repopulate on a post back, so 0:53
    we also need to set this ViewBag property in our post action method. 0:57
    I'll just copy and paste this line of code from here. 1:01
    Down to here. 1:11
    And I'll remove our line of code that is setting the entry.ActivityId property. 1:12
    Now, let's update our view. 1:18
    To start with, we can remove all of this temporary code. 1:20
    Then we just need to update our call to the DropDownListFor 1:30
    method to use our new ViewBag property. 1:36
    ViewBag.ActivitiesSelectListItems. 1:40
    The only thing that's tricky here is that we need to explicitly cast 1:49
    the ViewBag property to its actual type of select list. 1:53
    That's necessary because ViewBag is a dynamic object. 1:57
    Let's run our app and test our changes. 2:05
    And here's our list of available activities. 2:11
    What if we wanted to insert an empty item as the first item so 2:16
    users would need to select a value? 2:20
    Turns out, there's a method overload that makes this easy to do. 2:22
    We can add an empty string, just after the SelectList parameter, and 2:27
    the DropdownListFor method will create a default empty item. 2:31
    We could supply a prompt for our value. 2:39
    Something like Select an Activity, but I prefer to use an empty string. 2:42
    Also it's worth noting that if you pass in null for 2:48
    the value, MVC won't create the default empty item. 2:51
    You need to pass a string value, save the view, and refresh the page. 2:55
    And now the empty item is selected by default, 3:01
    if we right-click on the drop-down list and 3:04
    select the inspect menu item, we can see what our controls markup looks like. 3:06
    The first option is our default empty item. 3:13
    The remaining items are the available activities that we can select from. 3:19
    The value attributes represent the activity ID values, and 3:23
    the option element inner text is populated with the activity name values. 3:27
    When the form is submitted to the server, the selected items value attribute, 3:33
    is used for the activity ID form fields value. 3:37
    It's worth noting, that when we save an entry, 3:40
    we only have the activity ID value on hand, not the activities name. 3:43
    We don't need the activity name, until we display the entry on the list page. 3:48
    This might be surprising the first time you see this approach in use. 3:53
    But it's a very common way of handling related data. 3:56
    Go ahead and stop the app. 4:00
    If you're using GitHub let's commit our changes. 4:03
    Enter a commit message of, 4:10
    Updated the "Activity" field to use a drop 4:13
    down list, and click the Commit All button. 4:18
    In the next video, we'll continue with improving our form 4:26
    by updating the intensity field to use radio buttons. 4:29

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up