Laravel 5.8 - Custom Search in Datatables using Ajax

hello friends in this video tutorial we are going to learn how can we implement custom column search in Louisville 5.8 data table there are some time when in build data table is not satisfy our data searching need for example suppose we want to get only mail data from list then in data table it will return female data also this is because mail word has been come under female word also so at that time and build search not working for this we want to make custom search filter in data table so here we will step by step seen how can we'll make custom search filter in Louisville five point data table by using Ajax now let's start discussing this topic this is our testing database and here we one customer table in which we have already inserted some customer data we will first load this data in data table and after this we will implement custom search filter this is our Louisville 5.8 framework working folder first we want to make database connection so we have opened this dot env file and here we have defined my SQL database configuration like host name set to local host database name set to testing username set to root and password set to blank now we want to make controller so we have go to command prompt and here we have write this command this command will make custom search controller file under controllers folder now we have go-to controllers folder and we have opened this custom search controller file under this first we have right used statement with database class this is for database operation now we want to download your data tables package in this Louisville application so we have go to command prompt and write following command this command will download your data tables package in our eval application it will take some time for download after successfully download of your data tables package and install now we have go to config folder and open app dot PHP file in this file we have to define service provider and alias details this is required for use of utrila Ravel data tables package in this application you now we have go to custom sir controller and under this we have make one index function with request argument this is the root method of this controller class under this method we have right dollar country name variable is equal to database class with table method and under this we have right customer table after this we have ads select method and under this we have right country table column name it will select only country column name data only after this we have right group by method and under this we have right country column name it will select only unique country name from this column for a range country name in alphabetic order so here we have write order by method and under this we have write country column name in ascending order lastly we have right get method it will execute this select query and return data in a ray format which we have store under dollar country name variable now we want to send this data to view file so here we have write return statement with view method and under this first we have write custom search view file name and in second argument we have write compact method and under this we have write country name variable by using this method we can use country name variable for fetch data from this variable now we have go-to resources folder / views folder and open custom search blade dot PHP file in this file we have already loaded jQuery library bootstrap library and jQuery data table library first here we have right select tag with name and ID is equal to filter gender with two option like male and female this filter is for filter male and female customer data after this we have again right select tag with name and ID is equal to filter country by using this select box we can filter customer data by country now we want to fill this select box with data so here we have right at the rate for each expression and under condition we have right dollar country name variable as dollar country variable first we have closed this Louisville expression loop so here we have right at the rate end for each between this expression we have right option tag with value is equal to open and closed laravel expression and between this we have right dollar country variable with country column name as object it will print country name in value attribute same way we want to print country name in option text so here also we have right larval expression and between this we have right dollar country variable with country column name as object it will fill this select box with country list for filter data table data here we have right button type is equal to button name and ID is equal to filter by click on this button data table data will be filter same way for reset data table data here we have right button type is equal to button name and ID is equal to reset by click on this button data table data will be reset below this here we have make one table with ID is equal to customer data here ID attribute we will use as selector in jQuery code in this table we have make six table column like customer name gender address city postal code country on this table we will initialize jQuery data tables plugin now we have moved to write jQuery code so here first we have make function with name fill data table with two argument like filter gender is equal to blank and filter country is equal to blank under this function we have right data table variable is equal to dollar with table ID customer data with data table method this method will activate jQuery data table plug-in on this customer data table under this method we have right first option processing set to true this option will enable the display of a processing indicator when the table is being processed in second option we have right server side set to true this option will switch client-side processing to server side processing in third option we have right Ajax and under this we have right URL option which has been set to laravel expression and between this expression we have right root method and under this we have right custom search dot index it will send Ajax request to index method of custom search controller after this we want to send filter gender and filter country data also so here we have right data option and here we have defined filter gender and filter country data has been send with Ajax request below this we have right columns option which has been used to define table column details under this array we have right data option set to customer name and name set to customer name here we have defined customer table column details for gender table column data here we have add new node with data option set to gender and name option set to gender column name same way for display address table column data here we have add new node with data option set to address and name option set to address after this for display city column data here we have add new node with data option set to city table column name and in name option set to city for display postalcode table column details here we have add new node with data option set to postal code and name option set to postal code lastly we want to display country table column data so here we have add new node with data option set to country table column name and in name option set to country now we have moved to write PHP code so we have go to index method of custom search controller and here we have write if statement and under condition we have write request method with Ajax method this condition will be true if it has received Ajax request suppose this condition true then it will execute if block of code under this block we have right if statement and under condition we have right not empty function with dollar request variable with filter gender variable if this variable has some value then it will execute if block of code under this block we have right dollar data variable as equal to database class with table method and under this we have right customer table it will make select query after this we have right select method and under this we have defined table column like customer name gender address city postal code and country now we have right where method and under this we have right gender table column name and dollar request with filter gender object it will add wear condition under select query for at another we're conditioned here we have right where method with country and dollar requests with filter country object it will add we're condition for filter data based on country table column lastly we have right get method it will execute select query and return result in array format but suppose filter gender variable has no value then it will execute else block of code so under this block we have right dollar data variable as equal to database class with table method and under this we have right customer table after this we have right select method and under this we have defined table column like customer name gender address city postal code and country lastly we have right get method it will execute select query and return result in array format now we have rightt return statement with data tables method this method will make new instance of data table from source after this we have right of method and under this we have right dollar data variable lastly we have right make method with arguments set to true it will return unsaved model instance now we have again go to custom search blade dot PHP file and here we have called fill data table function so when page has been load this function has been called it will load data in data table for custom search here we have right dollar with button ID filter with click event so when we have click on filter button then this code will execute under this we have right filter gender variable is equal to dollar with select box ID filter gender with value method it will store filter gender select box value under this filter gender variable below this we have right filter country variable is equal to dollar with select box ID to date with value method it will store filter country select box value under this filter country variable now we have right if statement and under condition we have right filter gender variable value is not equal to blank and filter country variable is not equal to blank that means both variable must have value if both variable has value then it will execute if block of code under this block we have right dollar with table ID customer data with data table method with destroy method it will destroy data table after this we have called fill data table method with 2 argument like filter gender and filter country it will load custom search filter data in data table based on search query but suppose above condition false then it will execute else block of code and here we have right alert statement with message like both field is required this message will be pop-up now we want to reset data table data after custom search filter for this here we have right dollar with button ID reset with click event so when we have click on reset button this code will execute under this first we have right dollar with select box ID filter gender with value method with blank value it will clear filter gender select box value after this we have right dollar with select box ID filter country with value method with blank value it will clear value of select box with ID filter country now we have right dollar with table ID customer table with data table method with destroying method it will destroy data table data after destroying of data we have called fill data table function without any argument it will load latest all customer data in jQuery data table plugin now we want to set route of index method of custom search controller so we have go-to routes folder web dot PHP file here we have right root class with resource method with two argument in first argument we have right custom search and in second argument we have right custom search controller this code will set route of index method of custom search controller now we want to run laravel application for this we have go to command prompt in command prompt here we have right PHP artisan serve command it will start Louisville server and return base URL of Louisville application now we have check output in browser friends here we have right lura ville base URL slash custom search and here on web page we can see customer table data in jQuery data table plug-in here we can perform operation like data sorting searching pagination and many more now we want to get male customer data in United States so here we have select mail from gender select box and United States from country filter and click on filter button after click on filter button we can see United States mail customer details on web page without refresh of web page and here we can see jQuery data table functionality like pagination sorting is working we have only removed default search text box for customer search same way we want to get female customer details of Germany country so we have select female from filter gender select box and Germany from filter country select box and click on filter button after click on filter button we can see female Germany customer details on web page in dateable without refresh of web page now we have not select any one option and click on filter button so this way we can implement custom search filter in Louisville 5.8 data table if you are a new learner of Louisville framework with data table then this video tutorial will help you to learn how make custom search in Louisville 5.8 data table 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: 31,146

Keywords: custom search, custom search in datatable, custom search jquery datatable, custom search laravel, custom search datatables laravel, laravel 5.8 tutorial, laravel custom search, laravel datatables custom search, datatables custom search, datatables laravel, datatables laravel 5.8, datatables filter, laravel datatables custom filter, laravel datatables dropdown filter, custom filter datatable laravel

Id: XmUH049dk9I

Length: 24min 8sec (1448 seconds)

Published: Fri Jul 19 2019