ViewBag and ViewData in MVC 5 | MVC tutorial for beginners in .net c#
hello friends welcome to weapon technologies so today we are going to discuss about view bag and view data in mvc so let's start so uh before we proceed let me give you a wave introduction that view bag and view data both of them are used to send data from controller to a view right but not vice versa so uh let's talk about first view bag so view bag is a dynamic property and the same thing that it is used to send data from controller to a view right and the syntax for view bag is that uh viewback.propertyname over here we can give any meaningful name right so it's dynamic in nature and whatever data we want to assign it into view back we can assign it right so uh let's start before wasting any time so let's create one simple project i'm going to create one project so we are going to discuss about view back data app so i'm naming it with the same name and adding the reference of mvc so repeating the same step as we did in our previous videos right so let's wait for a couple of seconds it will generate for this nmvc application structure for this so it is performing some process in a background so let's wait yeah so now that is completed so now let's add first of all controller to our application so i'm going to add it and giving it a meaningful name let's name it home controller right and for this index action method let's add an view for this action method by the same name index so index view is also added successfully yeah now let's go back to our controller and now let's start we want to assign some data in our view back so for view bag we need to write view back dot and over here we can give any meaningful um any meaningful name right so let's suppose we give it my property name any name whatever you want and over here we will be assigning the data so let's say this is weapon living in india right now save this file now let's go back to our x view that is our index view so go to view and over here we can fetch the data of view back over here so as you know that this is a c sharp syntax so for writing c sharp syntax on the view i have already told you in my previous video we need to uh we need to start with at the rate right and then we can we can give this name view bag over here right that's it and we are simply displaying the data over here let's save this file and now then this application so it will load the application and let's see it is displaying data on the ui or not so let's wait for a couple of seconds yes application has been loaded so it is going to load home controller and the index section method so let's see it is displaying data or not yes it is displaying this is weapon living in india and the same which we assign the data in our view back right so this is how we can deal with the view back that's that was very simple now let me stop the application and now let me show you uh with the help of models uh let's suppose we want to create any class and we will assign some data into that object and that object we will be assigning to the view back so how we can do this so let's do it uh yeah and one more thing before we proceed this view bag as i told you that it is a dynamic in nature so let's go to the definition it's you will find here that you can see this is dynamic in nature right so that's why i was saying in my slide that it is dynamic and we can give any meaningful name over here right so now let's create one model inside the model folder so let's create one class uh let's give it to name employee and the and in this class let's add some properties so just to save our time i have already added some properties so in order to save the time i'm just copying and pasting over here so over here we can see we have defined the four properties id name email and each right so let's save this our model and let's go back to our home controller right and over here we can we can assign the data in the list of employee right so just to save the time i have already i have already written this so let's uh let's give it let's copy and paste and we can see over here yeah list of employee and before using a model on this controller we need to give the reference of that model so let's give it using and then name of the application and then models we want to use right now we can use the our list of employees so what we have done we have simply defined the list of employee and in that employee object we have assigned some dummy data right so let's save this and now we will assign this object to our view back so how we can do this view bag dot let's give it any meaningful name let's suppose we can define tool list to employ a list right and over here we can assign this data in this view back right that's it and now this view back dot 2 employer list we will be using over on our index page so let's create one more div for that so let's create and since it is a so since it is a object we are storing some data so we need to define in a list so let's define list and over here we can write for each loop pressing tab two times it will generate the snippet for this and now this time the collection would be view vag dot to employee list right and over here we can define in the list tag that so to define uh we have taken the property so let's suppose at the weight item over here remember one thing that we we will be not getting intellisense because it is uh dynamic right so item dot it was id so we need to copy from our model so that should be the same so let's copy it and paste similarly we can assign next is our name so we can give it item dot name right and similarly next was email so we can give it at the weight item dot email and the last one was age so at the weight item dot h right so this is how we can fetch the data from our view back to this list right so let's save this and run our application so it will display data this object data this complete data on our ui so let's see it is loading so let's wait for a couple of seconds yeah we can see all the data has been rendered in the browser id named weapon and accordingly whatever data we have assigned in our in this employee object right so all the data has been displayed on our ui so this is how we can deal with the models when we want to assign uh and when we want to assign data in our complex object or you know in any object right and we can pass in our view back right and how we can display it on our view how we can fetch this is the process right and now let me stop the application let me show you one more simple thing let's take one simple list right one simple list let's take one view back i have already taken so to just save the time let's define this and over here right so what i have done i have simply created one list of type string and in that list i am storing the string data right and that data i have assigned it to the view back with the name my list any meaningful name we can give it here right so as of now i have taken my list and now to display this data on the ui so let's go over and let's go to our index view let's create one more div block for this right and over here we can display let's write for each loop right and the collection is now this time is view back dot my my list right and over here we can define our item right to display the item in that collection now let's run the application let's see it will give the error on the page so let's see why it is giving the error so we'll tell you in a short so we'll tell you in a little bit so let's wait let's see what error it is giving on the ui oh it is displaying okay okay that's fine uh actually that will come with the view data when i will explain your view data so it is fine with the view back so we are able to see the data so just to make it you know just to make it uh just to make it look in a better way so let's define it in a list so we can do it we're defining this and we can place this server loop into this ul tag and to display the item we can display it in our list tag right so let's please let's place it now let's take now save this file now let's run it now it will be space separated and it will look better so let's see so let's wait for a couple of second yeah now we can see the list of string type whatever we have stored in that list all the data is displayed in a in a list manner right so this is how this is how we can deal with the view back and how we can show the view back on the view and how we can fetch basically view back data on the view right so this is the process so let me stop the application and now let's go to our controller and now let's understand about the view data of a new concept so let's go back to our slide for view data uh that is basically it work as a dictionary right and that is also used for the same purpose for sending data from controller to the view but not vice versa right but one important thing that we need to remember that view data basically it requires type casting for a complex data type right so whenever we want to fetch data from the view data on the on any view right so on that particular view we need to type cast it into of same type whatever uh whatever data we have stored uh in the controller right when we have assigned the data in the view data right so let me show you so let's go to the visual studio so that will be more clear to you for that uh let's create one more index action method or we can do it in the same but let's create a new next section method and let's delete this all right and let's name it let's suppose display and over here we are assigning some data into view data so let's take it view data and as i told you uh it work as a as a dictionary so we need to define the key name over here and we can define any key name over here so let's suppose we can take display details right and over here we can and over here we can assign any data let's suppose we write india is a democratic country right right and let's save this and now let's copy it and now we will fetch the data of this view data in our view so let's suppose uh yeah for this display action method we need to add one view also so let's go and add a view for this display index section for this display action method basically so the same step yeah so we have already added the view for display action method also and now in the step block we will fetch our view data but simply we need to start with add it to to write our c sharp syntax right so we simply display the data view data and the key name so let's save this and run this application and now this time it will load home controller and the display action method right you can see in the url so it will head to the home controller and inside the home controller it will head to the display action method and on that display action method we have created a display view for that particular action method so let's wait it will yeah so the data has the data has been rendered in the browser as you can see and there's a demographic country right so this is how we can uh deal with the view data right so let me show you one more thing so just just copy this data and we can assign it in the view data so we have simply created our new list of type string right and we are going to store in this view data this time not view bag right so because we are now working with the view data so let's give it a meaningful name so let's give it a list detailed right and now this time this view data we are going to use on our display view right so for that so let's create one more div block for that right and over here let's uh define our list tag and we will write our for each loop the collection would be this time our view data list details right and let's place this in our list tag at the weight item right so you can see it is giving uh this red line error on this below this text right why it is giving so let's save this file and let's run the application let's let's understand what i know that is giving on the ui so let me show you i will tell you in a little bit the solution also why it is displaying let's let me close the previous tab yeah so it is yeah so it is giving a compilation error we can see uh it cannot operate on variable of type object because object doesn't contain a public definition for get an emulator so when we are dealing with the view data so as we can see that we have we have assigned the list in this view data right so in dotnet each and everything is treated as an object right so the data is stored in the object and that object we are trying to fetch over here so we can't do it directly for that we need to type cast it into of same type right so that's why it is giving an error so let me stop the application and let me show you one thing so to fetch data from view data so in this data what kind of data we have stored we have stored of type of type string data that is of list right so we have stored list that is of type string right so we need to typecast it in the same type over here to fetch data from this collection right so that's why we need to define list of type string over here right so now we have simply type cast it to the to view uh into the same same type whatever we have stored uh whatever the data we have stored into this view data list detail right so we have simply typecasted to the same list of string type right now it will display the data so now no compilation error will come this time so let's wait and let's see what data it is giving now it will load the data properly yeah so we can see our list has been shown so it is working fine right the same data whatever we have stored in our this view data the list of type string right so all this data is is properly displayed on this ui right so that's why i i mentioned the point that view data basically requires type casting for a complex data type right so in the view of any object or any complex data type whatever we are assigning in the view data so at the time of fetching on any view we need to type cast it on we need to type cast it into of same type to display the data right so that is why uh that error was coming so this is how our view bag and view data basically work right and let me tell you one more thing let's go back to our slide view data we have already already discussed so these are the differences you can see on the screen view data is a dictionary of object that is derived from view data dictionary class and accessible using string s keys right and viewbag is a dynamic property that takes advantage of the new dynamic feature that we have already discussed and just now we have discussed for the view data that it requires typecasting for complex data type and check for the null value to avoid error but in the case of viewbag it doesn't require any typecasting it doesn't need any typecasting for a complex data type right and these are the basically um these are the basically various techniques for binding multiple model to a single view right so the using dynamic model view model view data back tuple and these so that we will be discussing in our upcoming video so don't worry about that so uh that is all for today so we have discussed about view bag and view data in this video so please like and subscribe my channel fans so that you can get all the latest notification in the future so that is all for today so bye bye take care
2022-01-10 22:46
