Search And Sort In Ruby On Rails 6 With The Rails Ransack Gem

hello everyone my name is dean and welcome back to another ruby on rails tutorial today we're going to be covering the ransack gem and we're going to be using this to create a search field as well as the ability to sort a couple different fields so i'm going to be creating a very basic application it's going to have some articles an article is going to have a title and it's going to have a body and you're going to be able to search through both the title and the body as well as sort both of them in alphabetical or reverse alphabetical order and then hopefully in part two we'll cover and that's my phone going off because i'm completely unprofessional but in part two hopefully we'll cover uh searching and sorting through an article's comments so it'll be through an association uh and then in part three hopefully we can cover some more advanced custom search queries like if you were to you know search through ip addresses that are stored as like an inet type in a postgres database so if that's something you're interested in consider subscribing so you get those videos that's going to do it for me let's go ahead and let's jump into some code okay so let's go ahead and let's get started by adding the ransack gem to our rails application and i'll have a link to the github in the video description or you can just search for the ransack gem on google and i'll just add this over here so i'll say gem ransack and then i'm also going to be using the faker gem and this is just for some test data so i'll just say gem faker and then i'll just run a bundle command over here to install both of these gems once that's done what we can do is we can type let me actually full screen this we can say zoom in rails g scaffold and we'll generate some articles and this is just so we have some something to test with we'll give each one a title and we'll also give them a body of type text and that's just so we have something to search through we'll go ahead and we'll run this generator and then once that's done we can then run a rails db colon migrate command to create these tables now we can exit out of this clear our terminal now that's done we can actually just go ahead and start up our rails server again let me zoom out a little bit and then let me come over to the uh routes.rb file and what i'll do is i'll say route 2 2. uh let me zoom in articles index and i'll save that and that should take us to the home page as soon as it finishes compiling so now we can create our articles say this is a test article written idea i'm just doing that so i have something unique there and then we have that one now i'd like to have a larger test set to test our ransack gem with and for that we'll be using the faker gem so for this we can come over to db seeds and then what we can do is we can say articles dot create and we'll give it a title and we'll say this title is equal to faker lorem.sentences we'll just pass it a number colon1 and then what we can do is we can put a comma after this and we'll give this a body of faker aurum.sentences let's actually do lorem.paragraph with a sentence count of five something like that and then up here we'll just say 50. times do i don't think we'll need x but we'll just do it just in case and then we can tab this all over and we can stop the server and we can run a rails oops a rails db colon seed command oh and articles was uninitialized i think it might just be article let me just check it's been a minute since i've worked with rails article.new it is article articles so get rid of this s and then we'll run our oops our rails db colon seed command again and now the database should be seeded so if i run rails c i say article dot all see there should be a whole bunch here so article.count returns 51. cool so that takes care of that so now we'll start up our server we can refresh the page and we should see a whole bunch of stuff here it looks like some of this is in quotes for the titles but that's okay that's just because the data was generated in a weird way but that's fine so what i'd like to do now is i'd like to add in some of these ransacked fields and over on the repo for it it shows you some examples the first thing it tells you to do is to go over to the controller so we'll do that we'll come up here we'll come over to app controllers there's my phone going off because i'm completely unprofessional and then we'll say at q for query is equal to article dot ransac we'll pass it in the params of the query and instead of saying article.all we'll say at q dot result and we want it to be distinct say distinct true and this just matters if you're searching by both the title and the body and let's say you search for the word the and they both have the in it you might get multiple results so this way it just only returns it once instead of returning it twice so now that we have that out of the way the next thing it'll tell us to do uh it does also cover pagination right here if that's something you're into we're not going to cover pagination but hopefully if i scroll down far enough it should tell us what we need in our view so in our view it tells us to add the search form for so what we're going to do is we're going to come into views articles index.html and then right below this title what i'll do is i'll just say render i don't know we'll render a partial we'll say render articles slash search form.html.erb something like that and then we can come over here say new file underscore search underscore form.html.erb and then we can copy this or i guess we can just type it out so we'll just say search form for at q do f i'll say end and then we need one for each field so we have a title so say f dot label for the title contains now there's a whole bunch of different options here you can tell it if it contains the word if it starts with the word if it ends with the word there's a whole table here if i scroll down far enough let me full screen this and try and find the list yeah right here so you have equals if it doesn't equal if it matches with the like similar to how you do your database queries if it matches any matches all you know less than greater than not null not empty is null greater than any starts with all of so all of these things you can add to the end and you would just say instead of asterisk you could say title and body and then you would you know put this at the end and say underscore not underscore end underscore all i'll show you how to do that in a minute here but basically what we do is we uh where did i leave the search form we add in the label and we just say the labels for the title and whatever we're going to do with it and then we can say f dot search field because we want to be able to type in it i'll say title cont or contains and then we could say f dot label for the body contains and then f dot search field for the body contains we'll save that and we come over here refresh and now we have two search forms so we can do is we can search for something let's say test and we probably need a submit button too f dot submit something like that so you can hit search and you can see here it just returns test i can also search for a and will return basically everything because a lot of things are going to have an a in it but let's search for i don't know whatever this word is because i can't imagine this is a very popular word and yeah you only get one result and we can also search for this rerum and if i backspace that i'm guessing there's an instance of this in each of the bodies which it looks like there is so that's sort of very quickly how you can do two different search forms but of course if you're in google it just has one that you search both of these with right i think the way you do that here is you do something like f dot label we'll say this is for title or body contains i'll say f dot search field title or body contains i don't know if this is the right syntax but worst case scenario just errors out on us so we can leave all this blank and then let's find something that appears in both um let's see this will appear in both because there's an instance there and one there so we'll say tempor and now if i search you can see it's either one of those so what you could do is you could get rid of both of these and just leave your title or body contains now you just have one search field and of course instead of doing this what you can just say is you know search articles dot dot and that'll give you your title and then you might want to give this a placeholder so you can say placeholder is just going to be search something like that you don't even need this label if you don't want it and then you can say i don't know test which returns just the test article and we can also just search for dean which will just return this one because of course it's not seeded with my name but you sort of get the idea how you can add these together to create more complex query fields now the other thing you can do is you can actually sort these results as well and if we come back over to our ransack gem here and we come down a little bit i think it's going to be a sort link is what it's called yeah something like this so we'll just grab this i think and we'll put this on the index page so instead of the title what we'll say is we'll say a oops we will have some ruby code and then we'll say sort link i want to sort at queue i'm going to sort by the title we'll just say this is title so this is the actual word so right here we have body so we'll be putting body in quote and then we have the symbol which is the the title or down here it'll be the body so that it knows what to pass back and then we can also pass it a default order so let's say we want to sort this alphabetically i'll just say default order is going to be i guess that would be ascending right and then let me close my parentheses make sure all this is okay that looks correct to me so let's test this with just the title for now now you can see there's a little link here and if i click this it'll order these in alphabetical order and i think the test article is up top because it's probably ordering these symbols after it but you can see here v o l v o l v l v i t i comes before o so it's after it here uh because we're sorting in descending order and then if we scroll down we'll slowly get towards the beginning of the alphabet and we can do the same thing with the body so if we come over to the body we replace this title the the table heading and it's important to note we're doing this on the headings we're not doing it down here for each article because this just works on the entire collection and it just calls a article.sort by whatever call when you when you click on it so we'll do is we'll say sort link we'll sort by the query again this time we'll pass in the body say this is and we can even change it so we can say this is like article content right and then for this we'll say default order is going to be in descending order and of course it can't sort both of these so one of them is going to take precedence right so if we get rid of this default order and re refresh the page and make sure i only go to slash articles or i can even just go to the root path you can see here it's once again going to be sorting in a seemingly arbitrary way so let's click this w comes after v and then there's a b i think on initial load it's actually sorting i don't even know if it is sorting so i don't know if the default order is actually working here unless it's the default order after i click it which it could be so if i save this and then i click this yeah so it's the default order after you click it it's not initially sorted good to know so we'll say default order for this is asc and then for this one it'll be desc so we can search by this and then sort by this and we can search for just articles written by me and that's sort of the gist of how the ransack gem works now of course there's some extra functionality that you can get out of this by adding in custom queries or custom sort logic so one example i have of this if i start up this other server that i have right here instead so let me close the server i've been showing you i'll start this one up and then i'll navigate to localhost port 3000. so you can see on this server i have a name which is just a url because i was lazy i seated it in the same way i did the other one then i have an ip address and these are actually notoriously difficult to sort just because if you cast this to an integer by getting rid of the dots you might lose some information because there's zeros that are sort of implied here and it can just be a pain but this actually sorts just fine when i click on it you can see it goes all the way through and i think there's actually one here that is the same number twice so two one nine two one nine and you can see that 1 2 8 comes before 142 and this is all being done with a specific type of data over in this pg admin table which you might be able to see this ip is actually of type inet and i'm sorting the inet data type through one of the models through a more advanced query and the sort links for it are also a little bit customized of course because it's it's sorting by the ip address and that's all stuff that we can cover in i guess probably part three of this video because i'd also like to cover how you would sort by let's say like the comments of an article so through an association i think the associate association sort will probably be part two of this series but that's going to do it for me let's go ahead and let's cut to the a outro video okay so that's gonna do it for part one in this small tutorial series hopefully this video helped hopefully you learned something and you can apply this to your own applications uh in general i think the ransack gem is pretty helpful it's very quick to set up something like this and it does scale well and once we cover some of the more advanced topics you'll be able to use it just like you would any other search field just with a little bit of help to get that boilerplate stuff you know out and up there very quickly for that rapid prototyping that rails is known for but that's going to do it for me thank you so much for watching i will see you in the next video [Music] you

Channel: Deanin

Views: 1,504

Keywords: deanin, deanin tutorials new, Search, Sort, Ransack Search, Ransack Sort, Rails Ransack, Rails Ransack Search, Rails Ransack Sort, Ruby On Rails, Ruby On Rails 6, Rails Ransack Gem, Ransack Gem, Search And Sort, Ransack Searching, Ransack Sorting, Sorting Ransack, Searching and Sorting Ransack, Ransack Searching And Sorting, Ransack Tutorial, Ransack Rails Tutorial, Ransack Tutorial Rails, Rails Ransack Tutorial, Rails Searching Tutorial, deanin tutorials, deanin rails, dean

Id: qWObWACNY9g

Length: 17min 46sec (1066 seconds)

Published: Mon Jun 21 2021