1
00:00:00,356 --> 00:00:04,840
So far we've been defining our
data directly in the view.

2
00:00:04,840 --> 00:00:09,080
To be honest,
doing it this way is unusual.

3
00:00:09,080 --> 00:00:13,070
Typically it's the controller's job
to supply the data to the view.

4
00:00:13,070 --> 00:00:17,040
That way our view can be written
in more of a generic fashion, so

5
00:00:17,040 --> 00:00:19,430
it can work with any comic book.

6
00:00:19,430 --> 00:00:23,140
Moving the data to our controller
also follows the separation of

7
00:00:23,140 --> 00:00:25,460
concerns design principle.

8
00:00:25,460 --> 00:00:28,340
We'll talk more about design
principles in a later video.

9
00:00:30,180 --> 00:00:33,720
Let's move our data from
our view to the controller.

10
00:00:33,720 --> 00:00:37,500
Starting in the detail view, select
the lines of code that we're interested in

11
00:00:37,500 --> 00:00:41,980
moving and
press Ctrl+X to cut them to the clipboard.

12
00:00:41,980 --> 00:00:47,660
IN the controllers folder,
open the ComicBooksController.cs file,

13
00:00:47,660 --> 00:00:52,113
then create a couple of blank lines
above the view method call and

14
00:00:52,113 --> 00:00:55,700
press Ctrl+ V to paste from the clipboard.

15
00:00:56,790 --> 00:01:00,360
Go ahead and fix the indentation
of the artists array values

16
00:01:00,360 --> 00:01:03,390
by selecting those lines and
pressing Tab twice.

17
00:01:04,870 --> 00:01:10,890
Next we need to replace our variables with
defining properties on the ViewBag object.

18
00:01:10,890 --> 00:01:13,719
ViewBag is an object provided by MVC

19
00:01:13,719 --> 00:01:18,071
that allows us to pass data
from a controller to a view.

20
00:01:18,071 --> 00:01:23,267
Starting with seriesTitle,
let's remove the var keyword and

21
00:01:23,267 --> 00:01:25,921
type ViewBag followed by a dot.

22
00:01:25,921 --> 00:01:30,110
Then, capitalize the letter
S in SeriesTitle.

23
00:01:30,110 --> 00:01:33,300
Since we're switching from
using variables to properties,

24
00:01:33,300 --> 00:01:36,620
we need to capitalize the first
letter of each property name,

25
00:01:36,620 --> 00:01:40,740
which is the commonly accepted
convention for naming properties.

26
00:01:40,740 --> 00:01:42,896
Then, do the same for issueNumber.

27
00:01:47,252 --> 00:01:48,244
Description.

28
00:01:51,751 --> 00:01:52,911
And artists.

29
00:02:00,325 --> 00:02:03,120
We can see that it's of type dynamic.

30
00:02:03,120 --> 00:02:07,288
This allows us to define properties
on the ViewBag object without

31
00:02:07,288 --> 00:02:10,858
having to modify a class as
we would normally have to do.

32
00:02:10,858 --> 00:02:16,388
ViewBag is one of the few real world
use cases for dynamic types in C#.

33
00:02:16,388 --> 00:02:19,390
Let's save the file and
switch back to our view.

34
00:02:20,440 --> 00:02:25,690
Visual Studio is underlining each of our
variable references in a red squiggle,

35
00:02:25,690 --> 00:02:30,580
indicating that the variables no
longer exist in the current context.

36
00:02:30,580 --> 00:02:34,227
We need to update each reference with
the appropriate ViewBag property.

37
00:02:35,280 --> 00:02:38,590
Notice that if I type
ViewBag followed by a dot,

38
00:02:38,590 --> 00:02:43,770
Visual Studio's IntelliSense is not able
to tell us what properties are available.

39
00:02:43,770 --> 00:02:48,510
This is one of the key disadvantages
of using a dynamic type.

40
00:02:48,510 --> 00:02:50,030
Let's look at that again.

41
00:02:50,030 --> 00:02:55,250
I'll remove the IssueNmber variable,
then type ViewBag followed by a dot.

42
00:02:56,300 --> 00:03:01,620
Nope, no help whatsoever with what
properties are available for us to use.

43
00:03:01,620 --> 00:03:04,990
So I'll go ahead and
type the property name.

44
00:03:04,990 --> 00:03:14,630
Let's finish up by updating description,
And both artist references.

45
00:03:17,770 --> 00:03:18,983
There's the first.

46
00:03:21,500 --> 00:03:22,897
And here's the second.

47
00:03:25,542 --> 00:03:28,830
Okay, let's save the view and
run our website.

48
00:03:30,940 --> 00:03:34,340
Everything looks good with
the exception of the issue number,

49
00:03:34,340 --> 00:03:37,430
whose value is no longer displaying.

50
00:03:37,430 --> 00:03:40,350
Looking at that line of
code in Visual Studio,

51
00:03:40,350 --> 00:03:43,300
we can see that I misspelled
the property name.

52
00:03:43,300 --> 00:03:44,940
When using ViewBag,

53
00:03:44,940 --> 00:03:48,900
it's very important to make sure that
you type the property names correctly.

54
00:03:48,900 --> 00:03:53,310
You won't get an error, instead,
your content just won't display.

55
00:03:53,310 --> 00:03:55,100
I'll go ahead and add the missing E.

56
00:03:56,640 --> 00:03:59,950
Notice that our series
title displayed correctly,

57
00:03:59,950 --> 00:04:04,690
even though we didn't capitalize the first
letter as we had in the controller.

58
00:04:04,690 --> 00:04:09,010
This tells us that ViewBag
properties are not case sensitive.

59
00:04:09,010 --> 00:04:12,820
That being said, it would be a good
idea to be consistent anyway.

60
00:04:12,820 --> 00:04:19,760
So let's capitalize the letter S,
save the view and refresh the page.

61
00:04:19,760 --> 00:04:22,740
And now we have our issue number back.

62
00:04:22,740 --> 00:04:26,040
Go ahead and close Chrome and
stop the website.

63
00:04:27,230 --> 00:04:31,238
If you're using GitHub, let's commit our
changes before we wrap up this video.

64
00:04:31,238 --> 00:04:36,876
Enter a commit message of updated

65
00:04:36,876 --> 00:04:41,109
comic book detail view.

66
00:04:41,109 --> 00:04:42,525
And click the commit all button.

67
00:04:45,291 --> 00:04:48,910
Great job on updating our controller and
view.

68
00:04:48,910 --> 00:04:51,960
Moving the data to the controller
is a nice improvement

69
00:04:51,960 --> 00:04:54,870
to the overall design of our website.

70
00:04:54,870 --> 00:04:59,120
Before we finish this video,
let's talk a bit about the dynamic type.

71
00:04:59,120 --> 00:05:01,020
While we use the dynamic
type in this video,

72
00:05:01,020 --> 00:05:06,100
it was provided to us by MVC via
the controller view back property.

73
00:05:06,100 --> 00:05:09,000
In most cases it's not necessary or

74
00:05:09,000 --> 00:05:12,300
even desirable to use
dynamic types in our code.

75
00:05:12,300 --> 00:05:16,350
Because we loose all the advantages
of having a compiler

76
00:05:16,350 --> 00:05:18,160
check that we didn't miss type something.

77
00:05:19,160 --> 00:05:24,020
We saw this drawback in our view when
Visual Studio was unable to help us

78
00:05:24,020 --> 00:05:26,951
from making a simple typo in
our ViewBag property names.

79
00:05:28,070 --> 00:05:32,510
We want to do whatever we can to
avoid these simple kind of mistakes.

80
00:05:32,510 --> 00:05:34,970
In fact, later in this course

81
00:05:34,970 --> 00:05:38,440
I'll show you an alternative to using
ViewBag that I think you'll like.

82
00:05:39,670 --> 00:05:43,530
If you want to learn more about the
dynamic type see the teacher's notes for

83
00:05:43,530 --> 00:05:46,090
links to additional resources.

84
00:05:46,090 --> 00:05:49,790
In the next video we'll be
updating our website's design.

85
00:05:49,790 --> 00:05:50,290
See ya then.