How to fetch data from MySQL using Jquery Ajax and PHP

hey guys in this tutorial we will learn how to fetch data using jquery as x in php and we will not escape any steps so you will understand each and everything so to fetch data we need one php application and everything we will do from scratch will not escape any steps so go to c drive and then go to exam and htdoc and here we will create our project so my project name is php tutorial like this and you can give any name and inside this project we need to create one file and file name is you can call you can give any name php index.php and in this file we will write a code for fetching the data from mysql okay so let's run this application close previous one and localhost and our project name and our project name is php tutorial but our browser are showing blank it doesn't this file doesn't have any code for fetching data so we will write a code to fetch data from mysql so first we need a connection of mysql for that we need one more file let's clear new and text file and you can rename it and its name i'm giving data.php you can give any name data.php and let's drag it here and drop it here and little zoom in so here we will write a code for connect to mysql through php okay and then we will write a query for fetching the data so for that we need a connection so i'm connecting mysqli mysql i underscore connect and this function takes some parameters like hostname username password database port name and socket so port name and socket we don't have we don't need let's remove this and hostname is just put hostname and our host name is localhost lo sorry local host and he username our database username so username is root by default and password password and password is blank because our database doesn't have any password and the last thing is database name so let's copy and paste it here and database name but database name we didn't have any database so let's create a database and we will put it here okay so wait a minute come here and type it localhost and phpmyadmin php my admin like this and create a new database and you can call you can say any database name i am putting a test or okay students or a college and anything let me put some other very nice name which is so let's put it php tutorial hp tutor real but php2 already exists so let me put it up php as ajax tutorial php hx tutorial and then create so now we have a database so this database is we will put it here php hx tutorial 2 to real if you want to check connection are established or not so let's put inside any variable connection and here just simply print it like this and connection so when you run this app run this file which is data.php it will return an array so here you can put data dot php like this but it says error message because the user is in something like so let me check yeah this is user not username so you can let's rename it username to username yeah and refresh so now it's so returning some array of our connection uh hostname ytcp ip and uh lots more thing it it gives us okay so let's put it here like this connection so connection we got okay and now we need a query okay to fetch data for that we need to call the object this is object and query and this query function will take let me query and why is this here and query and query we will write a query or select something but we don't have any table here for fetching data so let's create one table inside this tutorial uh php as x tutorial and uh create a table let me put users and username okay user id name of user and usercity okay and then it's so ids auto incremented so let's click it here and then name is watch r and cd is also archer and 130 and 130 of something you can put any value length of name and city and then save it then we will insert some data some dummy data so click insert and name is rather g and city is something this is my city and uh let's insert it's one more insert so this time is so um [Music] john okay and city is so maybe delhi and go so guys we have uh two tables uh sorry two data two records two users you use a one in user two side is one side is two so this data will fetch and so it here in index.php file so this is index okay so for that we need a query now so select select all star means all from table name and table name is users users okay so let's put inside any variable so let's put it results and let's so print it ctrl s for save and come here and data dot php okay so it's returning some mysqli objects okay and simply we can write a while loop and anything and for its loops whatever you want and you can patch all the data okay so let me put closing uh take a php and here we will add a while loop okay so php like this and put it while wh i live while and while loop stop and while loop why it's putting auto okay because if i'll put something automatically you will not understand so end while end while like this so while loop are starting from here and while loop is starting from here yeah ending from here so this is just or just like a while loop okay if you are using a php something like uh here let me show you example so while and why look like this okay like this this is exactly like this okay so in between we can write our html and something for so for that we have added in this way okay and in between while loop let me put a data and uh this uh object you know we have a scene this is object you can see so object and then call the function which is page underscore a double soc and it will return all the data in array it will convert object to array and it will return it will send all the data so let me put it a print php print printer and data ctrl s was there and refresh so you can see name id is one name is rather g ct is something and id is this is another so it's returning uh just like a [Music] array okay and in between we will write code html for table data we will put all the data in a table so let's put it tr and tr should be close and inside we need a td and td should be closed like this and in between a td we want to our id php echo and data and data is just simply this data and id okay ctrl s for save and let's refresh so it will show one and two two ids and this is for just for user name and this is for city one more time we need to put city okay yeah so now we have our id name user okay all the data's we have if you want to add one more let's copy and oh okay you can change it to [Music] john 2 and something um rock case of something and it will show all the data okay so now we need to write a jquery as x to load this file in in this uh in this file okay in index.php so let me come at index.php and inside we will write html html and html should be closed and in between html let me put head take head text should be close and here is a title tag and title text should be closed and so this ajax tutorial hdx tutorial and after a head tag let me put the body tag and body text should be closed and after a body tag we need a one table of html so let's put it table and table should be close like these and here we need to put it tr and inside the tr we need a td on sorry th you can put the td as well no problem so this is for id so let's copy and paste and paste three times so this is user and username and this is for user city yeah like this and after this tr we need to t body okay t body and in this d body we will put all this data okay all this data means whatever you have in in your mysql database means so this file we will put inside this due using a jquery okay so first we need a jquery so before a body tag here we will add our jquery okay so we will use so jquery cdn jquery cdn like these and click to first link here and let's copy yeah copy this one ctrl c for copy and paste it here and uh some we don't need integrity cross origin is very important if your site is uh in server okay but our site is not in a server licenses you can remove it yeah and here we will write a code of jquery script and script should be closed like this okay so for that we need a jquery is just like uh load the document okay so document dot ready function and function like this okay if dom is ready means everything is ready okay your html is loaded and everything is loaded then we will call the function we will send the data through as x so jquery have a very simple function dollar dot hx okay and this function will send data to your php file okay put it a semicolon and you can put like this yeah so simple and then it will take some properties it's a type type is just like a means of method okay gate and post so i'm sending requests through gate method and url url and url is just simply your file name and our file name is data.php let me show you this is a data.php why it's putting it here yeah data.php whatever data have a data dot php it will this will send a request this function will send a request to this one through get method and data type data type is not important just data type and data type is just simply html okay and then success and call the function like this and if it is if it success okay it will means it if this function will send data send a request to this file and if this file this file is respond okay it will return if this is if it responds success if returns data okay so we can just simply put this data to our here okay so let's put it id and id you can name it any name i am putting data okay and my table of something my data and my table of something and let's copy and paste it here like this id is this is id selector mydatan.html and this is a data so let's copy and paste it here okay and go to here let's remove this data.php and guys as you can see or this is our data from our table but our html table it's not looks like a nice table so we need to put a bootstrap if you don't know you can check out my bootstrap tutorial okay so introduction bootstrap and you can copy this link like this let's copy very simple copy and paste inside a head section here and remove the same thing integrity and cross origin i will teach you what is cross origin okay no problem yeah so bootstrap has been added and simply you need to put a class one class here class and table and our table will be looks like uh like this okay so nice it's looking very nice okay so pretty much we have a done uh if you have any questions and doubts you can write a comment i'm here to help you and if you really like please give a thumbs up and subscribe my channel so thanks for watching bye bye have a nice day

Channel: Tech. Rudranshi

Views: 4,518

Keywords: AJAX, MySQL, data, JQuery, Read, jquery ajax, using ajax in PHP, using PHP, fetch data, PHP Fetch data, retrieve data, from mysql, ajax and php, How to retrieve data

Id: -09M1ut7sWw

Length: 18min 46sec (1126 seconds)

Published: Sat Feb 06 2021