Hi Friends,
In today’s discussion, we’ll talk more about adding CRUD functionality in our application. So, let’s get started. But, i’ll be doing all these sort of things on a new link, let’s say Movies Link. so, the 1st thing is i’ll be modifying the layout links as shown below and then creating the view accordingly.
Obviously, we would be needing Movies controller, so let’s create that as well. But, this time with the following options as shown below:-
so, when i clicked add, it has not only created Movies controller but also all the required views in Movies sub folder as shown below in the section.
now, with these changes in place, when i build the app and refresh the page, i will be able to see one new view with complete CRUD functionality in there.
so, let’s suppose when you click either of the link, it will emit the things accordingly, let’s suppose i click on edit, it will emit me text boxes, in case of details simple list type div will get emitted and same in case of delete with one confirmation box. Also, Create New will emit new entry as in text boxes.
similarly for creating new Movie
so, this is the basic CRUD functionality provided by the scaffolding template when i created the controller. so, basically idea behind using this scaffolding template is reusing the logic which we usually write in any application, which obviously is going to save me lots of time. On the of this, i always have this liberty to tweak certain implementations my way and implement the same.
However, one thing which i found missing here is when i click on details link, i didn’t find reviews associated with each movie. This is fairly simple to put that, i can just tweak the view one foreach statement and print the Reviews for each associated movie.
Now, for listing Reviews, i would be taking a different step here. Now, for this approach i would be using Reviews controller separately and invoking the same. so, I don’t need the details view, hence i’ll delete the details view and also associated action method from my Movies Controller. Now, since we don’t have details action, so we need to change Index view, as shown below
Now, accordingly i need to modify the my reviews controller, so ultimately i will be deleting all the methods and in memory data which i have written initially to test my reviews, rather than this i would be using below piece of code.
Now, at this point i don’t have any view associated with it. so, i’ll add one by just rt-clicking the action result with the following options.
Now, i need to tweak this review a bit, because, l’ll take the same cut it from here and create a partial view for the MovieReview.
Now, replace the code copied from index view of review in the partial view as
so, here model is going to Ienumerable of MovieReview. Now, i can just optimize this view a bit like i don’t need id to be displayed here, in similar fashion, i can go ahead and delete the details and delete because this is unnecessary here. so, the same view could rephrased as
Now, i need to render this partial view from my index view as shown below.
Now, i need to make one more small change before building the app and run the same, i need to add virtual keyword in the Movies Entity, the reason being is when my query goes to load reviews associated with movie deferred query execution comes into picture, so with that virtual keyword in place it will go to db and fetch the associated review for me.
Now, let’s create a review. now, for creating a review i need to explicitly send the Movie Id from my index view so that, it will create a review for that movie as shown below.
then, i need in the reviews controller one action method which will respond to this one.
Now, i need a view for same as well like shown below. So, this time i’ll pickup the Create template with the below mentioned options.
Now, here it created me the view for Creating Reviews, however i modified the same a bit by deleting the id part from the view as this is redundant.
so, now this should be ok, to render the new Review page as shown below
But, in order to save the same, i need to have one more controller with Post action so that it will save the changes in db itself.
Now, what this will do it will respond to a POST request by taking MovieReview as a parameter, so that’s where the default Model binder in the MVC will come into picture, then it will instantiate an instance of the type and then look through all the properties to see and then push the same. Now, inside the create action, the 1st thing which we typically do is check to see if model state is valid or not, if IsValid flag returns false, then something went wrong with the model binding. so thing is if something went wrong, then in that case 
we won’t save the things in the database, we’ll return the create view again to the user, so that user can fix the things up for me. so, if any thing is wrong, then in that case HTML.validation message will show the validation error messages for me. so, now if build and click on add button to save the review then it should add the same.
Now, let’s see edit scenario. so, all we need here is one action method which will respond to the Edit Action as shown below.
so, what the above snippet will do, it will take the id parameter, look up in the db and then it will return the associated view for the same. so, we need the view, so will create the same based on the below options
This is also very much similar what we had in Create view, only thing which is different here, we do have hidden input for id value, which will allow us to track the id of the review thats being edited. Now, for submit action we need to have one action method to do the same.
Now, what this method will do here, it will again take the model object and everything is valid then, it will tell EF that here is a review that i want you to start tracking whenever this gets changed, but since this is not a new review, so it doesn’t need to be inserted in the database rather it needs to be updated with the new data inside, that’s the purpose of entitystate.modified. and now when i build and refresh i can see that reviews are updating properly.
However, there is one concern associated with this, like in edit scenario i could go and edit submitter name also, which is obviously you really want users to do that, so in order to restrict that what we could do here is we can use Bind attribute to exclude the values which we don’t want model binder to expose in like shown below.
also, from the view i have removed the values for submitter, so it won’t show now these values. but why i used Bind attribute is because i just wanted to make sure that users should not be inserting the same from the query string.
Now, In the last section of this module, let’s talk about a bit of data validation, we can do the same by applying certain annotation rules on our model classes as shown below. so, let’s suppose when am submitting any review i want this to be submitted in a range of 1 to 5. so for restricting the user for putting any other value than this, we can use Range annotation. Also, i would like to make it a required field, so i could use Required as shown below. In addition to these properties there are ton of validation properties. you can refer the same in MSDN link. for me i think this thing should be sufficient.
Now, when i build and refresh the page i got the below yellow screen of death and there is a reason for that, because EF has detected that your model definition has changed, so same thing has to be applied in the db first, so in order to sync the db with latest changes, we just need to apply migrations again, this time forceful migrations as shown below.
now, when i refresh the page it will back to normal state. now, let’s see validations in action, these validations are obviously client side validation, so even user click on submit it won’t go to server as shown below.
Now, as soon as you put valid input in there these error messages will go out. so, with this i would like to wrap this model now. so till then stay tuned and happy coding.
Thanks,
Rahul