Create Update & Delete (CRUD) with Model Forms | Django (3.0) Crash Course Tutorials (pt 10)

hey guys so in this video we're gonna add some create update and delete functionality to our Django project here so we have this table of orders and we want to give the user the ability to click this button here and be taken to a page where they can fill out a form and actually place an order and then be directed be redirected back to this page and then from there have the ability to update and delete each order so for those of you that are not here with my Django series I'll just quickly recap my model structure and we'll get into building that functionality so in my models I have this customer model and we have this product and order model and we're gonna be creating the order model so the reason why I mentioned those two is because order has a relationship to customer and to products so it's a one-to-many relationship so let's go ahead and first build out a template so we can actually create a form and start working within that so within our app here in accounts we're gonna create our template and we're gonna call this order underscore form and this template will actually handle the create and update process so I'm gonna copy and paste some code here and all it is is just extending from my main template so it's just inheriting so we're gonna have the header footer and all the functionality that we have in our main template so we'll go ahead and just throw in our template tags here for the blog content and we'll close that out and that is just our template there and in here we'll just set up a blank form and we'll create a button for it so I won't add styling until the end so I'll just keep this very simple for now so submit and the value will just be submit so as far as the name of the button and now we just need to create method types so we'll just do method is gonna be post so whenever we submit it we want it to submit as post data and the action is gonna be the URL that the form submits to and we're actually gonna leave this blank because depending on whether we're on the update or a create page we want it to be sent back to the same URL so if we submit this it'll actually be submitted to the URL that we're gonna be building out right now so in our views we'll just open that up we okay so we close out the models so in our view is we're gonna create a view called create order so just a function based view and we'll say create order and that's gonna be a capital o and we'll just set all this up and we'll return the template so render request and the template is in our accounts and then it's called order underscore form dot HTML and we'll just create the context real quick right here because we are gonna be using that later so I'll just set that up and prep it ok so we have our view here and let's just create a template and then actually link it and see what we have so we have our view and I'll just add one more URL path and we'll do create underscore order and pass in the view here views dot create order and I just pasted that in from here and we'll give it a name of create order or create underscore order again so we'll just keep the convention the same so the view is created the templates created and we have the URL so in our dashboard now let's go ahead and actually create a link so when we click this button will actually be taken to a page so and templates here I have dashboard HTML and that's going to be in my orders table so that's the customers table and right here so let's just link that up and we're gonna use the URL template tags there and in single quote we'll do create underscore order and now everything should be linked up so let's try that and see what we have okay so main template is not working okay so I actually realized that I inherited from the wrong wrong one there and that's actually accounts and main dot HTML so now it should work okay so our template setup let's actually create a form in here and what we're gonna use is something called a model form and this is just a Python way of actually building out our forms and it makes everything really easy to add in a form into a template and we process and save that data so rather than trying to explain it I'll just start building this out so back in our app here we're gonna create a file called forms dot py and that's where our model forms are gonna sit so there's many ways to go about this some people use class-based views for this but I personally love model forms and you'll see why it makes things very easy to work with and you're actually able to understand what you're creating rather than just letting Jango handle everything so we'll make the imports of from Django forms import and model form and that's gonna be capital M in capital F so we have our model form imported and then we're gonna import our models now so we're gonna do from models and that's because it's sitting in the same file so we can use that dot models right there so forms up py and models we're just gonna import all the models so the import actually I'll just import the one for now just to be able to understand it better so we're gonna import the order model and I'll open up models to the right here just so we can see what we're working with and we'll just prep it right here okay so we've made those imports and now we can create the form as a class so we'll do class and then what I like to do is called a model form the name of the model and then I just finish it with form just with the capital F so if I were to create a customer form it would be custom or customer form so that's the convention I use and then we're just going to inherit from model form and close that out and then we're going to do class and then meta and in here we need to specify two fields so a minimum of two fields that we need to create a basic model form so I'm gonna do model is gonna equal to the model name so it needs to know which model are we gonna build a form for and then we need the fields that we're gonna allow so the fields I'm gonna specify or I'm just going to allow all of them so we're going to do underscore underscore and then we're gonna do all underscore underscore and this is saying that go ahead and create a form with all of these fields in it so if I wanted to let's say only use one field I would actually just do a list here and say something like we want customer and we want the product field and that's it so I want all of them so we're just going to do the underscore all method okay so in our views now we've created our form and we call it model form we need to import this before we can render it out in our template so we'll do from forms import and I'll just import that form and now we can use it in our template so or we can pass it in so we'll do form is going to equal to order form and now we can pass it in here through the context dictionary and render it out in our template so in order form within our form tags let's do this so first we're going to set up CSRF token so we'll do these template tags here and this is just a way of sending that data securely so we'll do CS RF underscore token and then we can pass in our form by doing that right there those template tags and we called it form right there so whatever we give it the name or pass it in right here we just need to call it in here and now if I render my template I should see a form with all the fields so we said also we have the customer field the product field status and we can actually submit that data so let's actually process this information and save the item in our in our database so before I do that let's just go ahead and actually submit the form and see what we get so in here we're sending this ask post data and I'll just move this to the right so we're sending this as post data so what I'm gonna say in our view is if request dot method so we're just using this request right here so if the request is equal to post so it's either a post or a get request and by default it's a get request let's go ahead and print out request dot post and I'm just going to say printing post just so we can see this and because our form is being submitted to the URL of the current the current template so our current URL is create orders so when I submit it it's gonna send it back to the same URL and send us to this view instead of a get method we're gonna have a post method so if I save this and I'll refresh it let's go ahead and actually see what happens so let's open up our command prompt and refresh that and let's just set up some data here and we'll say out for delivery and hit submit so that data was just sent to this URL which sent us to this form as a post method and what we got back was this CRS CSRF token right here and then we can see that we have the customers ID the products ID and the status of out for delivery so that just sent our data to that to that view so what we can do now because that data's being sent and I'll just comment this out we can do this now so if the data is post data we actually want to do something with this form so what we can do now is say form is equal to order form and now we can just pass in that request data so that's why I model forms are really cool because we can actually just send that data into the form and as long as the request post data is the same as what the order form was supposed to handle we can just throw that in there and then do if form dot is underscore valid we can just save it so if the form is valid let's do let's just do form dot save and the model form will actually handle the process of saving this information into the database so the form is saved now and before we test this out I actually want us to redirect back to our main template so in here we'll do one more import and we'll just do so this is Django shortcuts and then next to render we'll do a comma and we'll do redirect and now what we can do is say instead of returning us back to that same template let's do turn redirect and send us back to that main template so to our dashboard so we'll just use that URL pattern and now if we submit a form here we'll just uh well see all of our orders so we have these orders here so I'm gonna create one more so let's go to create order and we'll read the counts so our total orders is five so just to see that it's being created we'll give one more to John Doe and we'll set this to dishes and we'll say it's been delivered so if I submit now the order is processed we see one more order in our database and we see that order appear here so that data was set here the form submitted it and sent us back to this view here to that home view so that's how we handled that and now we can actually create an update method and update that item so we're gonna create a link from these update buttons and actually take us to that same page except for this time that form right here will be prefilled with the item that we selected and then we can save it and actually update it so let's just create the update view really quick and we'll keep the naming convention pretty similar here so we'll just do function and we'll just call it update order and we'll just copy the same stuff here and we'll return this here so we'll just do return and we'll make the context and we'll also pass in a form and you'll see what's different in a second but I just want to create that URL path first so let's throw that in and now in our URL pattern we're also just gonna copy and paste this and change up a few things so we'll make some space so we can see everything and in here we'll just do update and we need to make this dynamic so if you were watching this from the last videos you'll understand how we're doing this so it's a string and then we'll just call this primary key and we're gonna use this view here so update and now in our view we just want to pass in that primary key so we call it PK there so because we call the PK we can throw that in and let's just link it out and see what's happening so in our dashboard will create one more link so in all these orders we're gonna create the link to that page now so we'll just use that template tag URL update underscore order and we'll just pass in the ID outside of that quote there we'll just do order ID and make sure everything's working and let's give this a test so back to our dashboard if we do barbecue grill update okay so we're we're being taken to that page now so what we want to do now is pre fill this form so to do that I'll just go back here to do that let's query the item from the view so we'll just do order is going to equal to order objects get and the ID is just gonna be that primary key that we passed in and now what we can do is in our order form we can do instance so this is gonna be the item instance that we're gonna fill out in that form so order form instance is going to equal to that order and now if we go to that page we should see a prefilled form so barbeque grill and there we go so we can actually change this information and then save it so let's go ahead and fill out that save process and then we'll actually save it and update it so the save method is actually going to be almost exactly the same as this right here so we can just paste this in so right here and the only difference here is going to be this right here so if we just pass in a request outpost it's actually gonna create a new item so what we need to do is throw in that instance again so we'll do instance so we're setting that new post data into that instance of an order so if we pass that in this should save it it should save it as that instance and then redirect us back to that template so if we go here and I'll just update the last item what do I do here oops did something there and probably just need to fix all these so instance is going to be order and give me a second just to fix this right here if okay so I just remove that I right there so that should work now okay so let's update this one right here so dishes delivered let's just update the status to pending let's say we made a mistake and we needed to reprocess that order so I just saved it and the status was set to pending so what just happened here is we sent it to the same forum so in order form because we didn't pass in a URL that URL is being sent to this one now instead of that create order so it just takes that same URL sends us as a post method to this view and then it takes in that post data sends it into the forum updates this instance right here saves it in redirects us so the last thing we need to do is just delete an item so to delete an item I'll create a new template and a new view in this should actually be a very simple concept to understand so I'll just create a template for that and we're gonna call this delete dot HTML and I'll just quickly inherit from the main template so we'll just copy this from the order form and we'll close it out so what we want in this template is to ask the user a quick question before they confirm their action so we want to ask them if they want to actually delete that item and give them the option to cancel it so I'll just do the paragraph tag here and I'll paste in my question so I'm gonna ask the user are you sure you want to delete and then we'll list out that item name and underneath there we're gonna have two buttons and one will be to confirm the action and one will be to cancel so this form is gonna first send some post data if we're confirming the action or just a link back to whatever page they came from so the method is going to be post and we're gonna create the first which is gonna be a link and this is gonna say cancel so we don't want to do it and cancel we'll just send us back to where we came from and this link we're gonna send us back to that home template right now so we'll just do URL and then we're gonna do whatever I call that here so I think I call it home yeah so we call that home so we're gonna send it back and if we want to confirm it we're just gonna use the input field and confirm the action and send the data back to here so we'll do submit and the name of that will be confirm and then we'll just create a URL or a view in let's see what this looks like so in this case we're gonna do delete order and we'll pass in the request and we're also going to need a passing a primary key because we need to delete a specific item and we'll return render here and we'll just pass a request and the template is now accounts forward slash delete dot HTML so I'm gonna pass into context and we'll render this out so we'll just we'll just prep this and in our views where our URLs here I'm gonna copy this update order and change some names so we'll do delete and just confirm these so I'll copy that paste that in here and delete ok so let's leave this out in our dashboard and see what we have so far so in our loop here we have our update button and I'm just gonna copy this and create some spacing here and in this link we're gonna throw and delete so we'll just change this to delete and we're passing in the ID there so that's delete okay so now we can see the page so if i refresh this if i go and press barbeque grill one thing I actually did forget to pass an really quick is in our view because we're gonna reference an item we need to pass that item into the view so let's use this convention here and we'll grab the order and we'll throw that in here and then we'll do because we call the item in the template we're gonna pass it in this item but that's gonna be the order so now if I go to that template and we'll go to barbecue grill it's gonna say are you sure you want to delete and right now is just the object number so we actually need to change this in our model field so I'm just gonna quickly update that so we're actually getting back a name so we'll copy this method and down here for the order we'll say product dot name and now we'll see that actually referenced out here so are you sure you want to delete the barbecue grill so if we press cancel we're sent back to this page if we confirm we should delete that item so I need a passing a CSRF token in here into the form so because it's a form let's just go ahead and pass that in so we'll do CSRF underscore token and well write our our logic interview here so what we're gonna do here is we're gonna say if request so we're sending it as post data in our template so that's post and the action is just going to be that same URL so because we're only using this for one page I'm gonna do the URL tag here and we'll just do delete and I called it order in my template solely use that and that'll be delete order and we'll pass in the item ID so if I pass in the item ID so item dot ID and I think that should work if not all just completely clear that URL so if the request dot method is post post what we're gonna do is we're gonna grab this order and we're going to delete it so we'll do order dot delete and then we're gonna return back to our main template so we're gonna or to our home page so we're gonna redirect back to that dashboard so let's try this in that URL paths should work so if I hit confirm that just deleted it so let's delete dishes now confirm there we go and we'll delete it one more and there we go so we're seeing our count go down and we're deleting the item so all of them all I'm gonna do now is actually make these these buttons right here linked out from our customer page and then we'll just style it and prep it for the next part of the series so that handles our crud functionality so if you're part of the series I'll style this template and then we'll be ready for our next video where we're gonna talk about Django filters so we'll be able to search items from our customer page so I'll just go back here and in our customer page we'll just take some of these links so we'll actually go to our dashboard and copy these two and go to our customer page and now we can just change these names so we'll just paste in those two and then we can reference them out from a customer page so if I go here now to our customer page we can hit delete are you sure you want to delete dishes and update you so perfect everything's working let's just style the pages now so let's start with the delete page since we're on that right now what we're gonna do is throw in some bootstrap and I'm going to copy and paste here so in my delete template we're gonna create a row around that so break tag a row column and a card and I want to close that out with three divs so we're gonna close it here so I can indent these and paste in that right there so oops so there we go so that's our row or column and then our card and our delete template should look a little better so if I press delete are you sure you want to delete the dishes now we can add some button styling here so for this we're going to use for the confirm we're gonna do class and that'll be dangerous Oh BTN BTN - danger we want that to be read and to go back we want that to be yellow so we'll do class is gonna be BTN and then BTN - warning and that should look a little better now okay so perfect we can cancel and now I just want to style this page a little bit we're not going to style these form fields but in that order form I do want only I do want to create a row so that looks a little better so we'll just go back to that and order underscore form we'll just paste in some more bootstrap there so we got three divs and we just need to close these three out so I'll indent this and just manually create all three so there's one two and three and we'll make these indented okay so that should look a little better okay perfect so that does it for this video if you're not subscribed already make sure you're subscribed and I'll see you in the next video

Channel: Dennis Ivy

Views: 175,129

Keywords: Programming, Software Developer, Dennis Ivy, Dennis Ivanov, Django, Django Framework, Crash Course, Turorial, CRUD, Create Dpdate Delete, Model Forms, Python

Id: EX6Tt-ZW0so

Length: 25min 35sec (1535 seconds)

Published: Tue Dec 10 2019