Live Data Search in Codeigniter using Ajax JQuery

hello friends in this video tutorial we are going to discuss how to can research my SQL table data by using Ajax encode ignitor framework we have already make video tutorial on this topic by using PHP script but now we have make same feature by using CodeIgniter framework if you have developed any web application by using codeigniter framework then in that application search feature is required for filter MySQL data at that time you have used this tutorial in which you can filter or search MySQL table data and you can get result on web page without page refresh because here we have use Ajax at front-end for send search requests to CodeIgniter controller and it will search day two and return fill today to two Ajax requests and it will display on web page now let's start discussing this topic so here we have testing database and in this we love customer table in this table we have already inserted data we will search or filter this data by using Ajax in CodeIgniter application this are CodeIgniter application folder first we want to make database so we have go to config folder database dot PHP file under this far we have defined database credential like hostname set to localhost username set to root password set to blank and database name set to testing after making database connection now we have open auto load dot PHP file and in libraries we have add database so when codeigniter application run then this library will automatically load it now we have go to control a folder and in this we have already make Ajax search dot PHP controller we will use this controller to handle load and search data requests under this controller first we have make index method so when we have directly write base URL with this controller name then it will call this index method under this method we have write dollar this with load class object with view methods and under this we have write Ajax search view file so when index method will call then it will load Ajax search view file with customer data in table with search text box now we have go to view folder and open Ajax search dot PHP file and in this file we have already included query and bootstrap library URL on this page first we have write input type is equal to text with attribute name is equal to search text and it is equal to search text this simple textbox for search customer data from table so user can enter their search request under this text box below this we have division tag with attribute it is equal to result under this tag we will display customer data in table format for load customer data in table formats so we have goldich query code part and here we have make load data function with query argument this function will fetch data from customer table based on query and display on the division tag with attribute result in table formats if query value is blank then it will load whole table data under this function we have right Ajax request for fetch data so under this first we have right URL option set to base URL function with Ajax search controller fetch method here we have send request to Ajax search controller fetch method in second option we have right method and under this we can define which method we should for sent data so here we have used post method in third option we have right data and under this we can define query variable so here we have send query variable as data to server lastly we have write success callback function this function will be called if request completed successfully and it will receive data from server under this function we have write dollar with division tag it result with HTML methods and under this we have write data here it will received customer data in table format and it will display that day to under division tag with attributes result after this here we have called load data function without query argument that means when page has been loading this function will called it will load whole customer table data now we have go to Ajax search controller and here we have make fetch method this method will received Ajax requests for fetch data under this method first we have defined two variable like dollar output and query with blank value after this we have right dollar this with load object with model methods and under this we have right Ajax search model this code will load Ajax search model under this function below this we have write if statement and under condition we have write dollar this with input object with post methods and under this we have write query variable this condition will check if this query variable value is said then it will execute if block if this variable has value that means user has enter any search query in text box so under if block we have write dollar query variable is equal to dollar this with input class object with post method with query variable now we have go to Ajax search model and here we have make fetch data method with dollar query argument under this first we have right dollar this with database class object with select method with star this code will make query like select star after this we have right dollar this with database class object with from method and under this we have right customer table this code will make query like select star from customer table below this we have right if statement and under condition we have right dollar query variable value is not equal to blank if this condition true then it will execute if block under this block we have right dollar this with database class object with like method and under this we have two argument like customer name column and dollar query variable this code will make search query for search data in customer name table column same way we have write dollar this with database class object with all like method with two argument in first argument we have write address table column and second argument we have write dollar query variable this code will add all statement in search query and it will also search data in address table column also for search data in city table column we have right dollar this with database class object with all like methods and under this we have write city column name and dollar query variable same way for search data in postcode table column we have right dollar this with database class object with all like methods and under this we have right postal code table column and dollar query variable lastly for search data in country table column we have right dollar this with database class object with all like methods and under this we have right country table column and dollar query variable so this block of code will make search query' for search day two in above all table column and when user enter query in text box then also this block of code will execute now here we have write dollar this with database class object with order by methods and under this we have write customer a table column and descending order this code will make query for select customer data in descending order based on value of customer a table column lastly we have write returns statement with database class object would get method this method will run select query returned the results now we have go to Ajax search controller fetch method and here we have write dollar data variable is equal to dollar this with Ajax search model with fetch data method with dollar query variable here this code will called Ajax search model fetch day - method based on value of dollar query variable and it will return customer data result based on value of dollar query variable which store in dollar data variable now we have write dollar output variable and in this variable we have a pend a CH tml table definition with table column like customer name address city postal code and country after this we have right if statement and under condition we have right dollar date variable with name rose method value greater than zero this name Rose method will return number of rows by query and if it is more than zero then it will execute if block otherwise it will execute else block suppose number of rows is equal to zero then it will execute else block and under this block we have write dollar output variable and under this we have a pen table row HTML coded with no data farm message but suppose it will return more than 0 number of row then it will execute if block of code and under this block we have write for each loop and under this we have write dollar date variable with result method as dollar row variable this result method returns the query result is an array of objects which we can access by dollar o variable in for each loop under this loop we have a write dollar output variable and in this variable we have a penned a CH tml code like open and close table row tag between thus we have right open and closed tabled data tag and between this we have right dollar o customer name object which print customer name data after this we have right open and closed table data tag and between this we have right dollar row address object which display address data under this column same way for city data we have type open and close tabled day to and between this we have right dollar rogue city object which print City data below this we have again type open and close table data tag and between this we have right dollar O postcode object which will print postcode table column data and lastly for country data we have right open and close table data tag and between this we have right dollar a country object which will display country data so this way we have store customer table day two under dollar output variable in table formats now we want to send to Ajax request for this we have write echos statement and after this we have write dollar output variable this way we can send data to Ajax request now friends in in browser we have write base URL and after this we have write Ajax search then it has load customer data in table format with search text box now we have entered something in text box then it does not search or filter data for search and filter data we have to go to Ajax search view file and here we have write dollar with text box it search text with key up method so when we have typed something in text box then code will execute under this method we have write search variable is equal to dollar this with value method this code will fetch textbox value and store in this variable below this we have write if statement and under condition we have write search variable value is not equal to blank if this condition true then it will execute if block and under this block we have right load data function with search variable as argument so here this slow data function will filter customer data based on value of this search variable but above condition false then it will execute else block of code and under this block we have called load data function without argument so here it will display all data from customer table without filter so here our code is ready so we have saved this code in check output in browser friends first we have a refresh page and here we can see customer data in table format with text box so when we have rightt Germany in text box then it has returned all data whose country is Germany without refresh of webpage same way we have enter Paul in search text box then it has returned customer data whose names start with Paul when we have removed text from search text box they're knitters display whole customer table data so this way we can search all table column data without refresh of webpage because we have use Ajax if you do not want to use query data tables plugin then you can also use this type of search feature for search data from table if you have any query regarding this video tutorial part please comment your query in comment box and if you liked this video tutorial please share with your friends or even you can also share on social media also if you want to get more update regarding our video tutorial please subscribe our YouTube channel forget more update regarding release of future video lastly keep watching our YouTube channel thanks for watching this video tutorial

Channel: Webslesson

Views: 44,199

Keywords: codeigniter ajax live search, ajax live search, codeigniter live search, live search in codeigniter, ajax codeigniter search, ajax search in codeigniter, search with ajax, codeigniter ajax search, codeigniter ajax search filter, search code in codeigniter, search data from database in codeigniter

Id: F_eRdrKCPWY

Length: 16min 57sec (1017 seconds)

Published: Sat Mar 10 2018