Search Sign Document Simple

Functionality sign search document online

here's the other one one is Prakash metallian welcome back to done in Tech in this particular video I'm gonna talk about how you can create search functionality for your SharePoint list bitching JavaScript so this is the kind of solution which I've already created and we want to create the exact same kind of solution so what the solution is doing this is my list when I have some data in number of columns and what this particular search is doing for us is we have a search failure when we select the column name on the basis of which we want to search and then we have a search text when we put a specific text which we want to search so let's suppose that I have a full name column here and if I select a full name from here and then type a name here which we want to search it suppose Prakash and click on search data related to that particular name coming up here so remember that we have searched to full name that's why the data are coming up coming only from that particular column so you can apply this particular search on multiple columns whichever column you want let's talk about that how we can treat that so first of all what you need to do is create a custom list here and put some me concers and then tree some text field here so I will rename my title as a first name so let me clear create last name here and then one is for country and one I'm gonna create for designation so this will be kind of a developer list so let me just go to my list setting here and change the title has first name click OK and now quick edit my list here I have data with me already you have created access it here as well just pick the data from here and just paste it like that alright and exit quick edits so now I have my data with me and first name last names country and designation so I have treat search according to that so now what I need to do is first of all I have to add a continent or web bird or a script where part of Health Forum back part in this particular library which I can do by using going to our classic mode so how to go in a classic mode just go near this setting there is advanced setting it's like tears and you have new experiences and classic experience I'm gonna select trust experience and now if I go to this particular setting option here it can edit this page and I can add a webpart from here so I'm gonna have a coordinator web part here and here I'll paste my code so let's talk about now that what our code will look like and all these thing I have already created a custom code for you guys and talk about this in detail that's what ex this code is doing so then you can create according to that so first of all I'll talk about HTML part I have created a search field when I'm creating a drop-down so I will put my on the column name first name last name country designation here so it will be like first name and then it will be like last name we have our country list and then we have resignation and in the option value section what I need to provide is I'll just talk about I have to provide the internal name of these columns so how can I get the internal name of this column just go to your list setting and in the column section if I go in my first name and click on this you will see in the last year the field name is title which obtained into earlier so the first name will be my title and likewise I'll do for all these column last name would be my this and then I think the country will be as just like that because it is see her world so country will be country and then we have a resignation will be the same I guess so and here is our designation so now I have all these filled with internal names [Music] remember that I've created this particular section right now now I have to create a search text then search button and Clear button alright so then we have our search text which is input type search input type text and the ID search text all right and then we have a button and two button basically one is search button one is clear button and on the on click of this particular button I am returning a search function and a clear functions so this is my HTML part which is done so and I will call the search function and a clear function here in my script tag since this is our just a tag which we defined by using script and I have a function search and I'm function clear which we have defined here when a person's click on this particular search button this search function will be called on the clear one this function will be caught all right so when a person's click on search so this particular function milk or and what this function is doing I have created two variable here one is SP that is such text and on to that particular search text variable I am getting the ID of this particular input box which will be our in search text box I am getting the value of this particular search text box here and storing it on my SP variable then I have a CD variable which is my column drop-down and getting the value of this select drop-down remember here is my ID column drop down and it's getting the value of my all these options tank or dropped off values and storing it on my CD and then I have a variable URL which is blank right now and I'm putting a conditions if s T that means our this search text box is not equal to empty that means we have some data on this particular one then it will go inside my if section and there is another section which is comparing CD that means our column drop down a column drop on value is equal to so I have to define the values here so what values will occur here is all these column values so I'm comparing if I'm selecting let's suppose any of this name and this belongs to this then a search will work alright so what I'm going to do is I'm going to put all these column name here like give seed is equal to title or CD is equal to lastname Oh series 1 to N so title is our first name because I have renamed the title column that's why the internal name is tight layer and then I have designation now if CD is equal to title or last name or country or designation any one of them then in the URL section there will be a filter ID one so why I am saying this filter ID one is and just show you in my code section yeah so right now you have your absolute URL which is going to my whole identity SPX in the list so let's suppose if I put put a filter here on the basis of header you will see there is a query stream passing here and what it is filtering is the filter ID one is the first name first name is our title that's what showing its title here and the filter venue is Heather so there is two parameters one is filter one is our predator-filled one and filter value one all right so if you see there in the URL first is filter ID one which will be our static one and then I am appending a CD here so let's suppose that if a person select full name here that our filter ID 1 equal to will be our full name and then printer value 1 B 1 will be our SD that means our text value so these will be appended to our URL and then we are redirecting to window store location dot enter if all item not SPX and then there will be a question mark which is per query string and then we will append this particular URL after that one I know if you are getting some problem on understanding this just spend some time on this particular code you'll be able to understand what I'm talking about so let me just tell you one more time what I am doing is I am storing my such textbox value on my SD and drop down value in CD then I'm comparing if my SP that means search text box is not equal to an empty then it will go to my if section and will compare the drop down value if the drop down value is among them either title last name country and designation then it will it will append the filter field one value and filter when do one into a URL and then window dot location dot H ref will append all I - not a specs which is all this one there you can see overwriting dot aspx there is a query string question mark then plus the URL well they will be appended here so it will search or filter according to that the values would be there M in this is not true in the S section what I'm doing is URL filter name plus CD plus filter value then my st and in the location rotor h type all I don't know ta expressive RL this multi value will select and do almost the same task it in case this wheel are not matching in your selecting something else this will will work for you guys so it is pretty much the same code above when an tween same task and once it is completed you will have your filter values in this such section here and if a person's click on the Clear button then the window deduction director I set up returning over item dot aspx which means it is a resetting our list so now we are done with that code section it's time to deploy the code in my library have already created a continental web part so just go at it so section and paste your entire code here my hope it should work for us so if I click on clear the URL is now clear and let's suppose I want to search spaces on the country and then I'm putting a name like UK and searching the data and it is searching the data basis on this country you can see there is a filter option here and now we have our data related to yoga country here and now we can clear a list from here and can search the first name last name country anything let's suppose I'm searching your first name then if I search rather it will return me the Hatter having the first name so this is the way you can create you know the filtering option or search option for your list using a few line of JavaScript code I hope it was helpful for you guys if you liked this video don't forget to subscribe my channel and like and share the videos thank you so much for watching learn tag stay tuned