PHP Tutorial (& MySQL) #21 - Showing Errors

okay then so we've created our form validation now in the PHP and at the minute we're echoing these errors if there are in here is at the top of the page up here now we don't really want to do that we want to echo out those errors in the form itself underneath the form field which has an error so let's go about doing that first of all we need to somehow store the error in a variable so that we can output that variable down here in the template right so instead of echoing this right here I'm going to store each one of these in a variable now I'm not going to store each one in its own unique variable what I'm going to do is create a variable at the top called errors and I'm going to set this equal to an array now this array is going to be an associative array we'll use the array keyword just to mix it up a little bit and then inside what I'm going to do is create a position for each one of these things we have one for email one for the title and one for the ingredients so the keys are going to be email title and ingredients so the email to begin with is going to be an empty string because we don't have an error to begin with so there's gonna be nothing in here when the PHP first starts we're just kind of creating this value ready in the array just in case there is an error with the email of the title which we're going to do second so that's going to be an empty string to begin with as well and then thirdly the ingredients which will also be an empty string to begin with so we have this array now of errors but there's no errors at the minute all we're going to do now is update each of these positions the values of these positions with the error down here so in this case this is the email so I'm going to grab the errors and update the email pocket if you like from the errors and that is going to be equal to this string right here now I'm going to do the same thing for the title so we'll say errors and then in brackets or square brackets rather the title and that is going to be equal to this string and then finally we have the ingredients so again errors and we're updating the ingredients and that is going to be equal to this drink so hopefully all that makes sense we're just making an errors array with empty values at the minute so no errors to begin with and then if we have any errors it's going to update those positions right here in the array so now we can output those to the form so what I'm going to do underneath each input field is another div a separate div and that div is gonna have a class of read - text just so it stands out a little bit and there is mainly read on a web page right so let's do our PHP tags right here because we're going to output some dynamic content here all we're going to do is echo and we want the error here for the email so we'll get the errors and we want the email position okay so we're echoing out that error right there now I'm going to just copy this dude and paste it down beneath the title and also the ingredients and then we just need to update these things the title and the ingredients right all right so I'm gonna save this and I'm gonna go over here and refresh then I'm going to type nothing to begin with I'll just submit and now we can see all of these things here ok I'm going to refresh once again in fact let me just go to add and then refresh because I don't think we've caught any changes let me try this again submit okay we still get those errors up there I've just remembered why that is we have more than one type of error we have this error right here but we also have these errors at the top if the field is empty so again I'm just going to update this so that the errors position becomes the string rather than just directly echo it out okay so we want the title being updated over here and set that equal to this string and then finally the ingredient so let's grab that and paste that up here as well okay cool so now what updating both of those areas if it's empty or if there's a problem with the type of data we're getting back so now fingers crossed if we go to this page and we don't enter in any information click Submit now we get those errors right here cool so if we type in something that's not valid and I'm going to submit and now we can see email must be a valid email address okay now we could do the title we'll say Mario Supreme and we'll do an ingredient which is not valid so something like this and then press submit you can see we don't get an error here under the ingredients but we get this updated area down here so this all seems to be working ok so you'll notice even though this was valid when it comes back it's missing and even when it's not valid it still shouldn't be emptied we should be able to amend that value so I want to persist the data that the user types in and keep it here when the page comes back to us so we can just update them all right rather than knows values being deleted so to do that we just need to output the title variable don't we the ingredients variable and the email variable down in the template because remember that's the data we're getting back that the user typed in so let's try and doing that what I'm gonna do is for the value of each input and I'm gonna say that is equal to and then we need some PHP so let's do that we're going to echo out the variable that we need so in this case it's going to be the email variable because remember up here we say email is equal to this okay so we're grabbing that from the form when the user enters it in and we're setting it equal here so we should be able to output it to the template right let's do the same thing for the other fields then we'll test it so let me come down here and change this to title and finally come down here and we'll change this one as well to ingredients and what I'm gonna do is save that and I'm just gonna refresh the page or rather go to the same address again and we should get an error you see here that's not what we expected right undefined variable undefined variable title undefined variable ingredients so it's saying to a slot you come to this page and you want the value of these input fields to be this variable however this variable is undefined at this moment in time but why is that because we define them up here don't we alright well think about it when we first go to the page we've not yet submit the form and we're trying to load these variables now they've not been set yet because we've not submit the form this code here only ever runs once the form has been submitted not setting these variables until we have a form submission so the first time we come to here we're going to get these undefined variable errors and that's not very good so what we should do is initialize our variables up here to be empty strings to begin with so that the first time a user lands on the page then we output those variables we're just outputting empty strings inside these different input fields right so they'll be blank then when you user click Submit we're updating those variables over here and then when the template is sent back to the user it's updated in these values with those variables I hope that makes sense so what we're going to do just above errors is create or initialize these variables and I'm going to say that the title is equal and it's a little trick if we're setting all of them to the same value which we are doing here we're setting them all to a blank string we can just say the title is equal to the email which is equal to the ingredients and that is going to be equal to an empty string so we're setting them all here to an empty string ok so to begin with that should work so I'm going to go to add again and now we don't get those areas we just get empty strings but this time if I type in Shawn and pizza title Irv something like this which is totally not valid ingredient something similar then we're going to get errors on all of these some but you see now these values they persist they stay on the form so that's a better user experience I'm going to update these now the net ninja Cody at UK I'm gonna make a valid title I'll call it the ninja supreme I'm going to keep this one the same submit it notice the errors of God here now but we have this error still here but it still stays now I'm going to update this with something that is valid tomato cheese and tofu and submit and now we get nowhere is sell my friends this now is all working that's really good we've done our validation work explain any errors and what also showing the data that they initially typed in so we're not deleting it each time around we're persisting that data now I think the next step would be to redirect the user if all this form is valid like it is now and they'll submit it then we should redirect them back to the home page to show them that yeah it's been done ok afterwards we're going to save the data to a database and then we direct them to the home page but for now I just think redirect them because that says to me yet we've accepted this form now I'm taking you back to the home page so we're going to do that my friends in the very next video one extra thing you want to do before a close off this video is add on the HTML special chars function around these different values that we output to the browser we're doing it inside this value attribute but it doesn't matter we still should do this when we're outputting information that a user has input themselves because you never know that could be malicious code and we want to escape any of those special characters so make sure whenever you're outputting anything to the browser we always use this let me do this down here as well and enclose those in brackets and then finally the ingredients and close that in brackets down here as well cool so that is better now we're echoing these out but we're enclosing them in HTML special chars

Channel: The Net Ninja

Views: 52,920

Keywords: php, tutorial, php tutorial, php tutorial for beginners, mysql, mysql tutorial, mysql tutorial for beginners, sql, sql tutorial, php for beginners, learn php, php mysql, php and mysql, php errors, error, errors, error handling, error catching, php form, form, forms, form errors

Id: firSTs1bEEY

Length: 10min 44sec (644 seconds)

Published: Wed Feb 20 2019