Laravel Live Data Search with Sorting & Pagination using Ajax

hello friends in this video tutorial we are going to make simple Louisville live my SQL data search application with sorting and pagination feature using Ajax in previous tutorial we have already learned how to sort column data in ascending or descending order with pagination using Ajax in Louisville in that application we have add one more feature like live table data search because there are many viewers requested us to add live data search feature in Louisville sorting and pagination application so here we have published video tutorial on Louisville framework by adding live my SQL data search functionality in existing Louisville sorting with pagination application so in this part we will not discuss larval data sorting and pagination feature using Ajax but we will add search functionality in existing code for this we have go to blade dot PHP file and in this file we have to define text box for Anders search query so here we have right input type is equal to text name and ID is equal to search user can search his or her query under this text box rique now we have moved to write jQuery code so here in previous tutorial on Louisville sorting with pagination we have already make one function for fetch data with sorting and pagination now we have modified this function so this fetch data function has three argument now here we have add one more query argument for search data in this function we have used Ajax requests for fetch data from my SQL database using get data method option so here in Ajax URL option we have add query argument in URL get data method so query value also passed to server for search data alert below this function we have write dollar document with on method under this method we have write key up event with textbox ID search so when we have typed something in textbox then this block of code will execute under this first we have right query variable is equal to dollar with textbox ID search with value method this code will fetch value of search text box below this we have right column name variable is equal to dollar with hidden field ID hidden column name with value method this code fetch value of column name from this hidden field after this we have right sort type variable is equal to dollar with hidden field ID hidden sort type with value method this code will fetch value of sorting type from this hidden field for get current page number we have right page variable is equal to dollar with hidden field ID hidden page with value method this method will return page number from this hidden field hallo once we have store query column name sorting type and page details in local variable now we have called fetch data function and pass all variable value as argument Kord this function will return data according to search query column sorting with pagination link without refresh of webpage blart once data has been searched and their large number of data on webpage and we have to go next page of filter data so we will click on pagination link so here also we have to add query option and pass in to fetch data function very for this year we have write query variable is equal to dollar with textbox ID search with value method this method will get value from this textbox and store under query variable after getting query details now we have passed this value in to fetch data function so here we have write query variable as fourth argument date same way we want to sort search data so we have go to this jQuery block of code this code is for sorting class here also we have right query variable is equal to dollar with textbox ID search with value method this method will get value from this textbox and store under query variable after getting query details now we have passed this value in to fetch data function so here we have write query variable as fourth argument now we have goto pagination controller fetch data method this method has received Ajax request for searching sorting and data pagination so here also we have to add data searching code here we have right dollar query variable is equal to dollar request variable with get method under this method we have right query here we have store search query details under this dollar query variable below this we have right dollar query variable is equal to string replace function with three argument like blank space percentage and dollar query variable Speight this function will replace blank space with percentage from given string here we can see PHP script for data sorting and pagination now here we have adware method with three argument like ID column name like statement with dollar query variable this code will add where clause with like search query here we have add or wear method with post title table column with like statement with dollar query variable this method will add or operator for search data in post title table column trips for search data in post description table column we have right or we're method and under this we have right post description table column with like statement with query variable so this way we have add search data filter code in our existing code now this code will work for all three feature like data searching data sorting and data pagination now we have check output in browser friends here first we have refreshed this page after refresh of webpage we can see on text box above tabular data for search data and below this we can see data in table format with 20 pagination link here we want to search post related to array so here we have type array in text box after type of array in text box below we can see table data has been changed and display only that post in which array word is present below table we can see pagination has been reduced from 20 to 3 now we want to go to next page so we have click on next page link after click on next page link then table data has been changed here also at display post data in which array word is coming so here live data search with pagination has been working in Louisville now we want to check live data search with column sorting is working or not so here we want to sort the search filter data according to ID column sorting so here we have click on ID table column after click on table column whole table data has been sort according value of ID here we can see post data has been sort with word come array so we can see live data searching working with column sorting in ascending or descending order with pagination using Ajax if you have any query or input regarding this video tutorial please comment your query or input in comment box or if you like 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: 14,069

Keywords: laravel ajax search pagination, laravel pagination with search, laravel ajax search, laravel ajax pagination, laravel ajax sorting, laravel live search, live search in laravel, pagination in laravel, data sorting in laravel, paginate, live search, ajax search, ajax sorting, ajax pagination, pagination search using ajax in laravel, laravel ajax

Id: 2U1t9f-64_4

Length: 11min 6sec (666 seconds)

Published: Mon Nov 19 2018