57: How to create a search field with PHP and MySQLi | PHP tutorial | Learn PHP programming

today we're going to learn how to do a search field inside a website and this from the gas requested of me so we're going to do that today and as you guys can see running from here I have a very basic demo that we're going to build today now what do you guys want it was a way to search for content inside your website I got a lot of requests from you guys doing you know searching for images or articles or users so what I'm going to do today is I'm going to search for articles inside this website here now before you guys start asking well you know what about searching for images well the way we're going to do today is the exact same way if you were to search for images or users or posts or something you might have inside a website it's the exact same way you're going to do it so doing it this way it's also going to teach you how to search for images if you were to do that so before we get started coding I want to show guys what exactly we won't be building inside my website here inside the demo I have a search field at the top where you can type something in and so it for it inside my front page I have the title of the page which right now's the front page I have all the articles inside the website listed underneath here and as you guys can see I only have two articles inside my website and I could easily do more but just for the example here I thought two would be plenty so the idea here is that me as a user inside this website here let's say I'm inside a really beautiful website which doesn't look as ugly as this one but it hasn't searched we let the top of the page now what I want to do here is I want to search for something inside this website now what we're going to search in is going to be up to us right now I just set the limit to you know being searching for articles inside the website and the only thing you guys need to do in order to actually you know tell the website what is it actually search for whether it being you know content inside pages or articles or images it's going to depend on what you have inside your database and what you allow for people to actually search for again we're going to get to that when we do the coding but just to let you guys know you can do whatever you want so what we have here is two articles and I want to search for maybe the title of one of these articles maybe I want to search for some kind of recipe so I'm going to type recipe inside the search field and I click search and then we get one article now do you notice that you can actually click this article because this is the search page and we want to know what exact is inside this full article now right now our next step and it you know a lot of text inside the article if there were a lot more text and you just want to give people you know a preview and then when they click the article they can see an entire article then this is the way to do it so what I did here was I allow people to actually click on this article and it opens up an article page that has the full article inside of it okay now of course we should have a menu inside this website so we can actually go quickly back to the front page or have the search field available at the top inside the header I didn't do that for this demo here but it's basically just the same concept so I could also go inside my search field and say what if I want to search for a and author inside one of these articles I could actually search for Daniel do notice I'm not typing Daniel with a big D but they're also down here does actually have Big D when i click search it still finds the article inside the search page so we're going to go ahead and make sure that the user connected search for the title the content the date it was actually posted and the user who posted it okay so we're going to do a pretty decent search field that's not really complicated but you know still complicated enough so we can actually get decent results out of it so what I'm going to do is I'm going to go ahead and open up our page you know this is the actual page that we have created right now inside my coding document there's nothing inside the index file other than just the basic HTML file setup inside this website here the first thing we're going to do is create a database connection so what I'm going to do so I'm going to go and create a new document I'm going to save it inside my root folder I'm going to save it as DBH dot PHP notice I'm not creating any kind of sub folders for you know database files or that sort of thing so if you guys want you can just go ahead and do that you don't have to do the directory exactly as I'm doing it now inside this database file I'm going to go and open up a PHP code and I'm going to go and create a database connection so I'm going to go and say we have a variable called Khan I'm going to set it equal to my sqli on the score connect parentheses semi-colon and we could just create variables up here let's actually go and do that so we're going to create a variable for the server address so we're going to say DB server or we just server because it doesn't really make sense to say DB server equal to localhost like so I'm just going to copy paste this a couple of times so we're going to say four times so we have four of these inside the second one we're going to go ahead and say we have a username we have a password and we have a database name now we're going to go ahead and change the actual values of these variables we're going to go out and state a user name is going to be root because that's the username for my local host we're going to get the password to nothing because that's the password from my local host again if you guys have different values in here you guys need to change it according to your database my database name is going to be DB PHP search just to give it some kind of name that matches somewhat what we're going to do in this episode again you guys can name it whatever you want to I'm just giving it this name here inside my variable connection down here I'm going to go ahead and include these parameters or these variables which has created inside the function so we're going to say we have a server we have a username we have a password and we have a database name like so so now we have a database connection and we can actually go and include this connection inside our front page so I'm going to go to the top here I'm going to open up my PHP tags like so and we're going to say include single quotes DB eight dot PHP so now I have a database connection at the top of our page now the next thing I want to do is include a style sheet because so we'll need to include a statute at some point just to make it look somewhat nice inside the process so we don't look at something really ugly that potentially will work but you know it looks somewhat nice so I'm going to go and create a new document I'm going to save it inside the root folder as well call it stylist CSS and I'm going to go ahead and link to this down seed inside my index file so underneath my title inside my head tag I'm going to go and say we have a link which is a style sheet the type is @ x /c SS and the hyper reference is going to be style dot CSS so just a very basic link so now that we have this one thing I would like to do in order to make this easier when we have to create this website is create a header the PSP file and take all the header content and put it inside this one file because then we can just link to it which makes a lot easier if you have to make changes so I'm going to go and copy everything from the beginning body tag I'm going to delete it then I'm going to create a new document paste it in and save it in some a root folder as header dot PSP inside my index page we now need to link to head of the PSP so we're just going to go and copy the include tag we have it on top of the head of the PHP file paste it in and instead say we want to include the header dot PHP so now by doing this we automatically get the head of the PSP inside the next file and we automatically get the database connection inside the header meaning that we're linking to both of these so now that we have this we need to go ahead and start creating the actual form we're going to use in order to create this search field the very first thing I'm going to do is I'm going to go and say we have a form I'm going to open up the form tags and we have an input which is going to be a text type the name is going to be search and we're going to go and I'm a placeholder called search like so and now we have that the next thing you need to create is a button so I'm going to go underneath here and create a button that's going to have a type set to submit and I'm going to go ahead and give it a name called submit again you guys could potentially name it something differently than just submit because it's not really a good name for it we could call it submit search let's actually go and do that so we're going to say submit search inside the form tag we're going to go and tell it which kind of action we want and we need to set a method so I'm going to say action which is going to be the document to reload once we click the submit button or the search button which is going to be a file called search dot PHP again search the PSP is going to get a search page that we load up with all the search results inside the website once you do this we need to make sure we include the method which I'm going to set as a post method like so and that's basically what we need for the search form now the next thing we need to do is actually get all the articles inside the website showing inside the front page now right now we don't have any articles inside our database we don't even have a database yet so the next thing we want to do is create this database I'm going to go and go inside my database which is my PHP myadmin again you guys should know how to do this by now if you don't then there's a tutorial at the beginning of this series here showing you guys how to install PHP myadmin I'm going to go and go into PHP myadmin go to databases on the top here I'm going to create a new database and just to check what we called it inside our DPH the PSP you call the DB PSP search at least I did so I'm going to go ahead and copy this name inside my database create the database and now we have the database but without any kind of see a pulse in it so to create these tables I'm going to go ahead and go inside the SQL tab up in the top here I'm going to click it and then we need to create the actual tables and the articles that goes inside the tables again there's other ways to create it inside PHP myadmin I think it's good practice to type it in manually inside the SQL tab up here so we're going to do that so inside this field here going to go ahead and we'll fit them all I'm going to consume into the gas can actually see it the next thing we're going to do is when we go and create a table sometimes I say create space table space I'm going to say article which is going to be the name of this table space treinta C's semicolon then inside the parentheses we're going to go ahead and write in all the different columns we're going to add inside the table so the first one is going to be an ID we're just going to be a unique number for each article that's actually inside this table so we're going to set this one to a integer type which has 11 different numbers inside of it then we're going to say space not null space primary key and then we're going to set it to our two underscore increment which means that each time we get a new article inside this table it's automatically going to increase the ID by one comment the next one we're going to get is the title of the actual article now I decided to name this a bit differently so we should probably not call this one ID we're going to go and call it a underscore ID the a just stands for article so there's nothing special about the a it's just a way for us to name the actual columns inside the article table so I'm going to go and create a new column down here I'm going to call it a on the score title I'm going to set this as a vodka type I'm going to set the limit inside the parentheses to 256 again you guys could choose to set this as a text type if you wanted to then there's no limit on the actual characters they can actually type for the title I'm going to set this one to not null the next line I'm going to go and create one called text which is going to be the actual content of the article so I'm going to say not test but text like so I'm going to set it to a text type because we just want it to be an infinite amount of text then we're going to set it to not null comment next line now I'm going to go ahead and copy the second column we created called title paste it in underneath here and we're going to go and change the title to author so we can actually get the name of the actual person who wrote this article now the last one we're going to do is the date so we do actually need to get a date for the actual post so we're going to set a underscore date again the reason I'm doing a underscores because if I were to just write dates it would actually highlight a different color which means that we're actually doing one of these types over here so by writing a underscore we avoid getting this weird color so this type is going to be a date-time format which is a very specific format that has to look like the date-time format inside SQL and again we're going to get to that once we create the insert statements to actually insert articles inside this table the next thing I'm going to do is set it to not null and now that we did this we can actually go ahead and create all the different inserts we need inside this table here let's like to go ahead and create a the actual table by saying we want to click go underneath here and as you guys can see now we have a table called article if I go inside the article you guys can see that we have no data inside the actual article we just have the rows in here so I'm going to go ahead and go inside my database again I'm going to go to the top where we have the SQL tab and then we're going to go ahead and insert the actual articles so I'm going to say insert into article which is the table we just created I'm going to go and say parentheses values parentheses semicolon I'm just going to go to move down values there so it looks a bit nicer a bit more structured so we can actually see what's going on and inside the article parentheses up here I'm going to go and insert the column names of article so the first one we had was the ID we don't have to insert that inside article here because it's auto increment it we don't need to do anything with it so the second one was the title of the actual article so going to the a underscore title comma space then we're going to say a on the score text which watch the second one then we're going to say a on the score author comma a on the score date then we're going to go to move down to values I'm going to go ahead and insert the values inside these two things here now I do actually have two text next to me here all the different texts are used inside my demo I'm going to go ahead and leave a link in the description in case you guys want to have the exact same text as me maybe you don't you can just write in your own values I'm just going to go and use the same text as I used in my demo so inside the values I'm going to go ahead and say we have a I'm going to go and say single quotes and inside the single quote is what we're going to insert the actual value of the actual title of the first post or the first article so I'm going to go ahead and say we call this 150 great summer recipes which I like I just said I just copied from my text next to me comma single quotes and then the text inside of it was there are many recipes you can create for the summer which involves grilling boiling frying and toasting I know it doesn't really make a lot of sense the text but you know it's just some kind of text we can have inside of here now the third value is going to be the author name so I'm going to go and say comment space and we're going to write single quotes inside the single quotes I'm going to go and say we have a admin because why not let me just insert any kind of name one or two it could also be my name or Susan or something space and then the last one is going to be the date time and remember the date time has a very specific format that we need to insert so the first thing is going to be the year going to go to say 2017 - then we're going to go and set the month which is going to be 11 - then I'm going to say 25 which is going to be the 25th of November I'm going to say space because now I need to insert the actual time and not the date so we're going to go ahead and say we have 12 which is the hours : we're going to go and set the minutes to 23 : and then the seconds so we're going to go and say 11 so this is what we need to insert now I'm just going to go and copy what we created here paste it underneath it and I'm just going to go ahead and change the second insert to something else again I have all the text next to me here so I'm just going to go and copy in the values I'm going to go and insert into my database here so the second title is going to be a series of computer software you know just add something and the text is going to be the following I'm just going to insert it here like so in this article you learn about some of the software used on computers disable basic software more advanced software used by developers as an example I'm going to change the also down here to Daniel Nelson which is my name you guys can type in your own name if you want to and I'm just going to going to change the data over here so it isn't the exact same date now again because we have seconds over here the likelihood of an article having the exact same name and the date is going to be very unlikely which is going to make sense a bit later when we do actually need to open up back to the article inside a separate page so we need to make sure that any article in here does not have the same title and does not have the same date okay having said that the articles could have the same names but it should not have the same date done so I'm going to go and insert this data inside my database I'm just going to go and say go and as you guys can see we get no errors inside my article we have two columns down here I'm just going to zoom out for you guys that we have two rows in here with the stuff we just inserted okay so now that we have some data inside the database we can actually start spitting it out inside our front page and this is all the data we're going to use in this episode like I said this could be a table that had something recording images for the users it could be something regarding posts or maybe user data you know the actual users listed inside the website so you can change this into whatever you want to it doesn't have to be an article like I did here so going back to our coding here I'm going to go and go back to the index file and the first thing I'm going to do is I'm going to go underneath the form and I'm going to go and create a h1 tag which is going to have the actual title of the actual page so I'm going to say this the front page just have something I'm going to go underneath here I'm going to create a h2 tag that says all articles and then we need to actually list all the articles underneath here so I'm going to go and go underneath and create a dip box that will contain all the articles that we get from the database which in this case is just going to be two articles and I'm going to go ahead and give this div a class because we will need to style this at one point so I'm going to set a class attribute and I'm going to set the name to article - container inside this container we're going to go and open up our PHP code with a couple of PHP tags and inside the PHP tags we're going to go ahead and write a select statement in SQL that would go into the database and select some data so I'm going to go and create a variable call it SQL so the equal to double quotes and we're going to go and say select all from articles I think it was article in single and not plural yeah it is and now that we have this we're just going to close out this line of code underneath it we're going to go ahead and actually run this line of code inside the database and get some kind of result from it so we're going to go ahead and say we have a variable called result I'm going to set it equal to MySQL I underscore query parentheses and inside these parentheses we first of all need the connection for the actual database which we include it inside out header inside the DBA to the PHP we call this variable come combat and then we need to have the actual SQL sentence or the SQL statement that we need to query inside the database which is up here so I'm just going to copy in my variable called SQL and now that we have this we're going to go ahead and check if we had any kind of results from this select statement so underneath a I'm going to go and say they have a variable called query results with a big bar just to make it somewhat neat it's equal to my SQL i underscore num underscore rows parentheses which is going to check how many rows of results we get from this quarry up here now if the query up here was written correctly we should get two results from the database because there are two articles so I'm going to go and say that we should actually run the result over here and see how many results did we get which would be two by now underneath iam going to create a if statement like so and inside the if statement I'm going to go ahead and say well if we had some kind of results from this check up here that were above zero meaning that we had some kind of result then we should run whatever code inside the if statement and the code inside the if statement is going to be a while loop that simply keeps spitting out all the different articles we have inside the database so as long as we have results from the database it's going to keep spitting it out like so inside the condition we're going to go ahead and say that we have a variable called row which is equal to my SQL I underscore fetch underscore s sock parentheses which is going to be the one that contains all the data from the actual results inside the database so I'm going to go and say we have a quarry up here that we run called dollar sign result and I'm going to insert it inside the parentheses of this dollar sign row down here so now that we have this we should essentially get all the results in the database and now I just need to tell it what we need to write inside the website so the first thing I'm going to do is I'm going to go to an echo some kind of string which is going to be a dip box that contains all the stuff we get from the database I'm just going to go and close this one off as well like so and inside this dip box we want to write a h3 tag which is a head of three I'm going to close it off as well like so and inside the h3 we need to get the actual data from the database that had the title of the actual article so I'm going to go and say well now we're switching from a string to PHP code so we're going to go and say double quotes to cancel out the echo string and inside the double cross I'm going to say punctuation two times because now we want to write some kind of PHP code and we're going to go and write dollar sign row brackets and inside the brackets we're going to go ahead and write the name of the actual column they want to spit out in this case is called a on the score title which means that now should actually get the title inside our front page if it were to just go ahead and copy what we have here pasted on underneath here like so I'm going to golden tint it from title to text so we get the text from the article we're going to change the h3 tags to simple paragraph tags because it looks better and I'm going to go and copy this one more time actually two more times the second one is going to have not but the date and the third one is going to have the author like so so now we should be getting some kind of results inside our index file if we were to go inside my index page refresh you guys can see you get some stuff in here first of all we have a search bar up here that we forgot to include some kind of sections at the button we're going to do that but we get the front page we get all the article title here and get each article from inside the database this is one article and this is the second one so now we need to style it to look somewhat nice and when we start is we don't need to sell anything else inside the website because we're just going to reuse the same styling so just to get over with we're going to do that right now inside my form we're going to go and give it some kind of text first we're going to say search inside the button here just we have the text refreshed as you guys can see now get the text up here inside my stylesheet we're going to go and start off by saying that we want to have some kind of styling for the body because we need to change the background color the entire website just to make the articles pop out more so we're going to say if you have a body tag curly brackets and we want to set the background color to hash tag f3f3f3 semicolon then we want to set all the font to Arial of some sort so if we get some kind of text that doesn't look very ugly so I'm going to set the font family to Arial and then we're going to go to style one of the classes we created inside our index page which is the one called article container which is going to be the one that contains all the Articles that spit out from the database so going back inside our style sheet we're going to say article - container curly brackets and inside the curly brackets we're going to set it with - 900 pixels we're going to set a background color to white which is going to be FFF and we're going to go ahead and set a padding just to get some you know some kind of border around all the articles so it doesn't touch the side of the browser so we're going to say padding I'm going to go ahead and set it to 30 pixels just to have kind of border underneath the article container class we're going to go inside the article box you know the one that contains the actual post inside our index file well we didn't actually create that yet so let's actually go and do that inside the div tag inside the wild statement here we're going to go and give it a class name so going to set equal to single quotes I'm going to go and call this one article - box then we're going to go install this one so we can get some you know some spacing away from the articles when they list underneath each other if you guys see inside the website you can't really see when the first article stops and when the next one starts so we need to create that spacing so going to say they have a class called article that's box we're going to set a padding bottom to 30 pixels we're also going to go and set a width to make sure that the width of the article goes all the way to no the left side and right side of the article container actually I don't think we actually need this but you can just write it just to have it so now that we have this let's actually go ahead and style the input and the button we have inside the search field so I'm going to go and say we have a input inside the website it has a padding which is going to be 0 pixels from top and bottom and 20 pixels from left and right just to to make sure the text when we type inside the search field doesn't touch the sides of the search field so inside the input here we're also going to go and include a new width we're going to set it to 300 pixels we're going to set a new height which is going to be 40 pixels and we're going to go and set a font size to 22 we're going to go and copy this and we're going to go ahead and do this for the button as well so we're going to say instead of input we're going to say button and we're going to go and remove the padding because we don't need that we're going to go and change the height to 44 pixels because the input is going to have a default border that we don't have inside the button so we're going to go and include a height that's slightly higher just to make it match up the weight should not be 300 because that's way too much we're going to set to 100 and this is basically all the styling need for an entire website let's actually go and refresh the page and as you guys can see it changes the entire page layout so now we have the articles down here that are actually separated so we have some spacing in between and we can access you the textbooks on what nice now the next thing we need to do is when we do actually go inside our code or inside the website inside our index file and we click search inside the search field something needs to happen we need to go in to the search page which is the search that PHP file we included up here and do something with the actual search string that we typed inside the search field so what I'm going to do is I'm going to go and create a new document I'm going to save it in some a root folder and I'm going to go and call it search dot PHP again this is just a search page where we're also going to have all the code that is related to the actual search function now the first thing we're going to go and write in here is going to be the title of the actual page so I'm going to go and say to have an h1 tag just like with this inside the index file where we created the front-page tag here so we're going to go and write we have a search page underneath the h1 tag we're going to go and include the article container then include it inside the front page because you need to have some kind of container for all the articles or if you actually get the search results so why not just use the same one again you guys can change it if you want to this is just my demo so I'm going to do it this way when it comes to styling now inside this file we also need to make sure we include the header the PSP because the header has some information we need to attach the actual database connection and the style sheet so we're going to go and go to the top of our site here and we're just going to go and copy what we have inside our index file up here and paste it at the top so to actually get the entire header so now we should automatically get the database connection and the link to the stylesheet inside the article container we're going to go and start writing some PHP code so I'm going to open up my PHP tags close them off again and inside the PHP tags the first thing we're going to do is when go and create a each statement that says if we actually clicked the submit button from the search form so we did actually call this one submit test search I believe so we're going to say inside the if statements inside the condition is set parentheses dollar sign underscore post brackets and inside the brackets you want to search for submits - search like so so now if we did actually get to this webpage and we did actually click the search button then it's going to go and run the code inside the if statement inside the if statement we're going to go ahead and create a variable which is going to be the variable that contains the information we typed in inside the search form so we're going to say we have a variable called search I'm going to set it equal to my sqli on the score real underscore escape underscore string and I'm doing this at least this function here because we want to make sure when they use to type something inside the search form that they don't try to do any kind of SQL injection inside our database so we need to make sure that the data we get from the user is safe anytime we get anything from the user we need to make sure we escape some kind of weird characters inside what they typed in because we don't want them to mess with our database okay so inside of here inside the parentheses we're going to go and include the database connection which was variable con comma and the second parameter is going to be the actual thing that the user typed in from the index file or inside the index page so we're going to go ahead and say they have a dollar sign underscore post brackets and then we call this one let's actually go and see what we called it we called it search so we're going to go and say we have a post method called search like so so now that we got the actual search words that the user typed in let's actually go ahead and go underneath here and type the SQL sentence we're going to go to inquiry inside the database because we need to actually search the database for what the user actually typed in so we're going to go and create a variable we're going to call SQL for the equal to double quotes closer with a semicolon now inside the double course we're going to go and create a select statement we're going to say select now I'm just going to go and say we select everything from the article table inside the database you could just say you want to search for the title or you know something else we do actually to make sure include from in here there we go and after you get the table name that we actually want to search then we're going to go and create a where statement because we're going to tell it that we want to search a specific column for the keyword that the user typed in inside the search field so the column I'm going to go out and check here is going to be the one we called a on the score title so first of all we're going to check if the title from any kind of article inside our article table it has the keyword that you use to search for now typically in the past we would actually go and set it equal to single quotes and then the actual variable up here we called search like so but because you want to search for part of the title you know for an actual keyword and not the entire title name we need to do a slightly different so I'm going to go and say we don't want to set it equal to instead we're going to go and write a keyword called like so we're going to go and say we have some kind of word that needs to sound like something inside the title now in order to do this we're going to go and say single quotes and then we need to type the actual search word they want to search for now before we do this you need to actually include these percentage symbols around the variable name so we're going to go and write two of them and then copy the variable name inside in between these percentage signs or the symbols so now that we did this we're now checking the title if it has any kind of key word like the word the user typed in inside the search field okay now this is not enough because we also want to search the text inside the article so what I'm going to do here is I'm going to go and say space one say or we have I'm just going to copy this we have here a another title but we have a text inside this article that is like the search that the user actually searched for so we're just going to go and keep copying this and again if I didn't want the user to search for the author then I'm just not going to include the author inside this you know string we're creating here now I'm just going to go and keep copying this I'm just going to go and say we have an or statement I'm going to copy it afterwards or paste it in afterwards I'm going to change the text to author I'm going to copy it in again or paste it in again I'm going to change it from text to date so now we're essentially checking everything inside the article for the search word that the user typed in okay so now that we have this we can go ahead and run the actual SQL statement inside the database we're going to actually quarry it inside the database so we're going to go and say we have a double sign result that is equal to my SQL I underscore query parentheses and then we're going to go and say we're going to go ahead and take the database connection which is called dollar sign come comma and then the actual query or the actual SQL sentence we're going to query inside the database which is dollar sign SQL so now that we did this we need to check again if we had any kind of results so I'm going to go and say we have a variable called query results without the s and with a big are equal to my SQL I on the school num underscore Rose parentheses semicolon now inside of here we're going to go and get the result because you need to take the result that we have up here if we have any kind of results from the result variable we have up here so if there's any kind of articles that matches what we search up here then it's going to go ahead and fetch them okay well at least check how many of them there are because there can be more than one result which is a neat thing about doing it this way so not only have this we're going to go and create an if statement now this if statement inside the condition is going to check if the curl result has more than one or more than zero results from the database because if there are no results then we need to give some kind of error mess so going to say if it's greater than zero then is to do something inside the code here if there's no results that we're going to go and create an else statement that says there well we just need to echo this out like so there are no results matching your search like so so now we have this kind of error message we can go ahead and go inside the if statement and write the code that we need to know to actually get out the results so what I'm going to do here is I'm going to go ahead and say we have a while loop and again we're doing this very much like we did in the front page we're just going to go ahead and insert the results inside a variable called row so we're going to say dos on row because we're only running this code if it is actually haven't result and if we do we're going to insert it inside this variable here so we're going to go and say it is equal to my SQL i underscore fetch s sock parenthesis and again we're going to go and check the result up here and get all the data from the database inside the while loop we're going to go ahead and copy what we have inside the index file then we've created this echo that had you know the actual dip box with the data inside of it so I'm just going to go and copy it insert it inside my while loop here and save it so now if we were to go inside my website refresh it and search for something I can go and search for any kind of keyword to have inside these articles so if I say we want to search for summer which is down here I can write summer search and now I guys can see we get a search result ok we could also go ahead and echo out if we were to go on top of the body call it the actual check here that if we have any kind of results from the check up here to Tex how many rows we got we can actually go ahead and copy this variable go underneath the if statement say echo there are space then we're going to go and say we have a PHP variable called core results punctuation double quotes results actually space and dem results because then it's actually telling the user how many results there are from the actual search they made we're going to go and copy this or save this go inside our browser refresh and as you guys can see it says there are one result so not only did this let's actually go and create the actual article page that opens up in a new page when you click the actual article down here so what I'm going to do is I'm going to go ahead and go down to our echo inside the actual article that it spits out and echo out a link around the actual div that links up to the actual article so I'm going to say we have a anchor around the dip box so I'm just going to go to open up the anchor tag before and close the anga tag right after we're going to go and set a hyper reference inside the anchor tag which is going to be equal to single quotes and inside the single quotes we're going to go and link to a page we haven't created yet called article dot PHP then we're going to go and say we want something else inside the URL so we're going to say question mark and now we need to decide what exactly is going to go and use in order to open up a specific article from our database now when we did actually create the database I mentioned that we needed to make sure that there were no titles or dates that matched up with another article you know you know one of these could match up but not both so we can't both have a date and a title that matches with another article because when we want to open an article we need to make sure we open up the article that has a specific title and a specific date so I'm going to go and say after the question mark here that we want to open up an article that has a title set equal to the result we get from the database called title down here so I'm just going to go and copy the code remember you want to close off the string and open up PHP code and then afterwards you want to open up the string again so we need to double quotes around it I'm going to paste it in like so and we do actually need to take this single quote in front of it here in front the equal sign delete it and move it behind the actual PHP code here so we have double quote single quote at the end here okay so don't mess up double quotes in single quotes need to look like this after this after the double quote and before the single quote we're going to go ahead and say and/or the ampersand symbol we want to have a date that is equal to the date down here so again I'm going to go and copy the date and paste it in right before the single quote and right after the equal sign like so so now we're going to go and create the actual article page so I'm going to open up a new document I'm going to save it as article dot PHP and inside of here we're just going to go and copy the index file so we're just going to copy everything from here and paste it in we're going to go to the top and we're going to go and delete the search form because I don't see why we should have a search form inside the article page so let's just delete it I'm going to change the name from front-page to article page and I'm just going to go ahead and delete the h2 tag it because you don't need to say all articles so now we just have the article container and we need to make sure we select an article that has the search criteria we typed in inside the link we just created now just to show you guys if you go back to our front page i refresh the site if I search for summer click search you guys can see we now have a link if I click the link you guys can see it open up all the articles inside our database this is going to limit it because inside the URL right now does actually have the parameters that we can use node to narrow down which article we want to get from the database so going back inside the article the PHP file we're going to go ahead and go inside the PHP text before you start doing all the code here and I'm going to go ahead and get the actual data from the URL so I'm going to say we have a variable called title which is equal to and we're going to go and copy a piece of code inside our search field which was the one that prevented users from actually messing up our database which is up here inside the search variable I'm going to copy it and paste it right after so now we need to change the sir criteria from search inside the post method to because when we created the the actual link inside our search page you guys consider the title equal to the title so the title here is the keyword before the equal sign okay so just to make sure you guys understand this is not going to be a post method as well this is going to be a get method because when we go inside the browser we can actually see the search result inside the URL meaning that this is going to be a get method not a post method because the post method we can't see inside the URL okay that's the difference between the two so now that we have this one we can actually go and copy it paste underneath here and change it from dates or from title to date and change it inside the get method as well so now that we have this we can actually go inside our select statement we want to select everything from article where a underscore title the column is equal to single quotes then we want to get the variable called title and a underscore date is equal to single quotes dollar sign date so now we should only be getting one article from the database okay so now that we have this I do actually think we're done so let's actually go ahead and go back to the website go back to the front page so to test is let's search for something else in summer let's like to go to search for Daniel because we have the name down there I'm going to say Daniel okay we got one article which is nice let's actually go back again and search for the dates because I want to search for any kind of article that's written in 2017 so I'm going to say 2017 and now you guys can see you get to article results and it does access a there are two results okay I can go out and click on one of these articles and as you guys can see it opens up one article inside a separate page depending on what's inside the UL so this is how we can create a search field inside a website now again this is a basic example of a search field I hope you guys found this useful and it wasn't too long and I'll see you guys next time or

Channel: Dani Krossing

Views: 210,075

Keywords: php search field tutorial, php search function tutorial, php search system tutorial, how to create a php search, how to create a php search system, how to create a php search function, php search website, php search website content, search website content using php, search website content in php, how to create a search field in php, how to create a php search bar, how to create a search feature with php and mysql, how to create a search field with php and mysqli, PHP tutorial

Id: lwgG_uIJYQM

Length: 46min 15sec (2775 seconds)

Published: Wed Feb 22 2017