activerecord-hackery--ransack/getting-started/sorting/index.html

18 lines
53 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en" dir="ltr" class="docs-wrapper docs-doc-page docs-version-current plugin-docs plugin-id-default docs-doc-id-getting-started/sorting">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="generator" content="Docusaurus v2.0.0-beta.21">
<link rel="alternate" type="application/rss+xml" href="/ransack/blog/rss.xml" title="Ransack documentation RSS Feed">
<link rel="alternate" type="application/atom+xml" href="/ransack/blog/atom.xml" title="Ransack documentation Atom Feed"><title data-rh="true">Sorting | Ransack documentation</title><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:url" content="https://activerecord-hackery.github.io/ransack/getting-started/sorting/"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="docusaurus_version" content="current"><meta data-rh="true" name="docusaurus_tag" content="docs-default-current"><meta data-rh="true" name="docsearch:version" content="current"><meta data-rh="true" name="docsearch:docusaurus_tag" content="docs-default-current"><meta data-rh="true" property="og:title" content="Sorting | Ransack documentation"><meta data-rh="true" name="description" content="Sorting in the View"><meta data-rh="true" property="og:description" content="Sorting in the View"><link data-rh="true" rel="icon" href="/ransack/img/favicon.ico"><link data-rh="true" rel="canonical" href="https://activerecord-hackery.github.io/ransack/getting-started/sorting/"><link data-rh="true" rel="alternate" href="https://activerecord-hackery.github.io/ransack/getting-started/sorting/" hreflang="en"><link data-rh="true" rel="alternate" href="https://activerecord-hackery.github.io/ransack/getting-started/sorting/" hreflang="x-default"><link rel="stylesheet" href="/ransack/assets/css/styles.1d70fab6.css">
<link rel="preload" href="/ransack/assets/js/runtime~main.cc01bd68.js" as="script">
<link rel="preload" href="/ransack/assets/js/main.c5b1ea80.js" as="script">
</head>
<body class="navigation-with-keyboard">
<script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){var t=null;try{t=localStorage.getItem("theme")}catch(t){}return t}();t(null!==e?e:"light")}()</script><div id="__docusaurus">
<div role="region"><a href="#" class="skipToContent_fXgn">Skip to main content</a></div><nav class="navbar navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Navigation bar toggle" class="navbar__toggle clean-btn" type="button" tabindex="0"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/ransack/"><div class="navbar__logo"><img src="/ransack/./logo/ransack-h.png" alt="Ransack Logo" class="themedImage_ToTc themedImage--light_HNdA"><img src="/ransack/./logo/ransack-h.png" alt="Ransack Logo" class="themedImage_ToTc themedImage--dark_i4oU"></div></a><a aria-current="page" class="navbar__item navbar__link navbar__link--active" href="/ransack/">Documentation</a><a class="navbar__item navbar__link" href="/ransack/blog/">Blog</a></div><div class="navbar__items navbar__items--right"><a href="https://github.com/activerecord-hackery/ransack" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_lCJq"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a><div class="toggle_vylO colorModeToggle_DEke"><button class="clean-btn toggleButton_gllP toggleButtonDisabled_aARS" type="button" disabled="" title="Switch between dark and light mode (currently light mode)" aria-label="Switch between dark and light mode (currently light mode)"><svg viewBox="0 0 24 24" width="24" height="24" class="lightToggleIcon_pyhR"><path fill="currentColor" d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"></path></svg><svg viewBox="0 0 24 24" width="24" height="24" class="darkToggleIcon_wfgR"><path fill="currentColor" d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"></path></svg></button></div><div class="searchBox_ZlJk"><div class="navbar__search searchBarContainer_NW3z"><input placeholder="Search" aria-label="Search" class="navbar__search-input"><div class="loadingRing_RJI3 searchBarLoadingRing_YnHq"><div></div><div></div><div></div><div></div></div><div class="searchHintContainer_Pkmr"><kbd class="searchHint_iIMx">ctrl</kbd><kbd class="searchHint_iIMx">K</kbd></div></div></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div class="main-wrapper docsWrapper_BCFX"><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_sjWU" type="button"></button><div class="docPage__5DB"><aside class="theme-doc-sidebar-container docSidebarContainer_b6E3"><div class="sidebar_njMd"><nav class="menu thin-scrollbar menu_SIkG"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/ransack/">Introduction</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret menu__link--active" aria-expanded="true" href="/ransack/getting-started/simple-mode/">Getting started</a></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/ransack/getting-started/simple-mode/">Simple mode</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/ransack/getting-started/advanced-mode/">Advanced Mode</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/ransack/getting-started/configuration/">Configuration</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/ransack/getting-started/search-matches/">Search Matchers</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link menu__link--active" aria-current="page" tabindex="0" href="/ransack/getting-started/sorting/">Sorting</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/ransack/getting-started/using-predicates/">Using Predicates</a></li></ul></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" href="/ransack/going-further/associations/">Going further</a></div></li></ul></nav></div></aside><main class="docMainContainer_gTbr"><div class="container padding-top--md padding-bottom--lg"><div class="row"><div class="col docItemCol_GujU"><div class="docItemContainer_Adtb"><article><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Z_bl" aria-label="Breadcrumbs"><ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList"><li class="breadcrumbs__item"><a aria-label="Home page" class="breadcrumbs__link" href="/ransack/"><svg viewBox="0 0 24 24" class="breadcrumbHomeIcon_OVgt"><path d="M10 19v-5h4v5c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-7h1.7c.46 0 .68-.57.33-.87L12.67 3.6c-.38-.34-.96-.34-1.34 0l-8.36 7.53c-.34.3-.13.87.33.87H5v7c0 .55.45 1 1 1h3c.55 0 1-.45 1-1z" fill="currentColor"></path></svg></a></li><li class="breadcrumbs__item"><span class="breadcrumbs__link">Getting started</span><meta itemprop="position" content="1"></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active"><span class="breadcrumbs__link" itemprop="name">Sorting</span><meta itemprop="position" content="2"></li></ul></nav><div class="tocCollapsible_ETCw theme-doc-toc-mobile tocMobile_aoJ5"><button type="button" class="clean-btn tocCollapsibleButton_TO0P">On this page</button></div><div class="theme-doc-markdown markdown"><h1>Sorting</h1><h2 class="anchor anchorWithStickyNavbar_LWe7" id="sorting-in-the-view">Sorting in the View<a class="hash-link" href="#sorting-in-the-view" title="Direct link to heading"></a></h2><p>You can add a form to capture sorting and filtering options together.</p><div class="language-erb codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_biex"><pre tabindex="0" class="prism-code language-erb codeBlock_bY9V thin-scrollbar"><code class="codeBlockLines_e6Vv"><span class="token-line" style="color:#393A34"><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filters</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">id</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filtersSidebar</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">header</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filters-header</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filters-header-content</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">h3</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain">Filters</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">h3</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">header</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filters-content</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> search_form_for </span><span class="token erb language-erb ruby language-ruby variable" style="color:#36acaa">@q</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"></span><br></span><span class="token-line" style="color:#393A34"><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">class</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;form&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"></span><br></span><span class="token-line" style="color:#393A34"><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">url</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> articles_path</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"></span><br></span><span class="token-line" style="color:#393A34"><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">html</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">{</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">autocomplete</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;off&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">autocapitalize</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;none&#x27;</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">}</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby keyword" style="color:#00009f">do</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">|</span><span class="token erb language-erb ruby language-ruby">f</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">|</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">form-group</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">label </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:title_cont</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> t</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">(</span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;Filter_by_keyword&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">)</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">search_field </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:title_cont</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> render partial</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;filters/date_title_sort&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">locals</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">{</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">f</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> f </span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">}</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">form-group</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">label </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:grade_level_gteq</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> t</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">(</span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;Grade_level&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">)</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"> &gt;=</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">search_field </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:grade_level_gteq</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">form-group</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">label </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:readability_gteq</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> t</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">(</span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;Readability&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">)</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"> &gt;=</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">search_field </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">:readability_gteq</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">form-group</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">i</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby variable" style="color:#36acaa">@articles</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">total_count </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"> articles</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">i</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">form-group</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">hr</span><span class="token tag punctuation" style="color:#393A34">/&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">div</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">filters-header-content</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> link_to request</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">path</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">class</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;form-link&#x27;</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby keyword" style="color:#00009f">do</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;</span><span class="token tag" style="color:#00009f">i</span><span class="token tag" style="color:#00009f"> </span><span class="token tag attr-name" style="color:#00a4db">class</span><span class="token tag attr-value punctuation attr-equals" style="color:#393A34">=</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag attr-value" style="color:#e3116c">far fa-undo icon-l</span><span class="token tag attr-value punctuation" style="color:#393A34">&quot;</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">i</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> t</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">(</span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;Clear_all&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">)</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby keyword" style="color:#00009f">end</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%=</span><span class="token erb language-erb ruby language-ruby"> f</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">.</span><span class="token erb language-erb ruby language-ruby">submit t</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">(</span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;Filter&#x27;</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">)</span><span class="token erb language-erb ruby language-ruby punctuation" style="color:#393A34">,</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby symbol" style="color:#36acaa">class</span><span class="token erb language-erb ruby language-ruby operator" style="color:#393A34">:</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby string-literal string" style="color:#e3116c">&#x27;btn btn-primary&#x27;</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">&lt;%</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb ruby language-ruby keyword" style="color:#00009f">end</span><span class="token erb language-erb ruby language-ruby"> </span><span class="token erb language-erb delimiter punctuation" style="color:#393A34">%&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token tag punctuation" style="color:#393A34">&lt;/</span><span class="token tag" style="color:#00009f">div</span><span class="token tag punctuation" style="color:#393A34">&gt;</span><br></span></code></pre><div class="buttonGroup__atx"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_eSgA" aria-hidden="true"><svg class="copyButtonIcon_y97N" viewBox="0 0 24 24"><path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg class="copyButtonSuccessIcon_LjdS" viewBox="0 0 24 24"><path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div><h2 class="anchor anchorWithStickyNavbar_LWe7" id="sorting-in-the-controller">Sorting in the Controller<a class="hash-link" href="#sorting-in-the-controller" title="Direct link to heading"></a></h2><p>To specify a default search sort field + order in the controller <code>index</code>:</p><div class="language-ruby codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_biex"><pre tabindex="0" class="prism-code language-ruby codeBlock_bY9V thin-scrollbar"><code class="codeBlockLines_e6Vv"><span class="token-line" style="color:#393A34"><span class="token variable" style="color:#36acaa">@search</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> Post</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">ransack</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">params</span><span class="token punctuation" style="color:#393A34">[</span><span class="token symbol" style="color:#36acaa">:q</span><span class="token punctuation" style="color:#393A34">]</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">sorts </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token string-literal string" style="color:#e3116c">&#x27;name asc&#x27;</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">if</span><span class="token plain"> </span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">sorts</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">empty</span><span class="token operator" style="color:#393A34">?</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token variable" style="color:#36acaa">@posts</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">result</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">paginate</span><span class="token punctuation" style="color:#393A34">(</span><span class="token symbol" style="color:#36acaa">page</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> params</span><span class="token punctuation" style="color:#393A34">[</span><span class="token symbol" style="color:#36acaa">:page</span><span class="token punctuation" style="color:#393A34">]</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token symbol" style="color:#36acaa">per_page</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token number" style="color:#36acaa">20</span><span class="token punctuation" style="color:#393A34">)</span><br></span></code></pre><div class="buttonGroup__atx"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_eSgA" aria-hidden="true"><svg class="copyButtonIcon_y97N" viewBox="0 0 24 24"><path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg class="copyButtonSuccessIcon_LjdS" viewBox="0 0 24 24"><path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div><p>Multiple sorts can be set by:</p><div class="language-ruby codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_biex"><pre tabindex="0" class="prism-code language-ruby codeBlock_bY9V thin-scrollbar"><code class="codeBlockLines_e6Vv"><span class="token-line" style="color:#393A34"><span class="token variable" style="color:#36acaa">@search</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> Post</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">ransack</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">params</span><span class="token punctuation" style="color:#393A34">[</span><span class="token symbol" style="color:#36acaa">:q</span><span class="token punctuation" style="color:#393A34">]</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">sorts </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">[</span><span class="token string-literal string" style="color:#e3116c">&#x27;name asc&#x27;</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token string-literal string" style="color:#e3116c">&#x27;created_at desc&#x27;</span><span class="token punctuation" style="color:#393A34">]</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">if</span><span class="token plain"> </span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">sorts</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">empty</span><span class="token operator" style="color:#393A34">?</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token variable" style="color:#36acaa">@posts</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">=</span><span class="token plain"> </span><span class="token variable" style="color:#36acaa">@search</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">result</span><span class="token punctuation" style="color:#393A34">.</span><span class="token plain">paginate</span><span class="token punctuation" style="color:#393A34">(</span><span class="token symbol" style="color:#36acaa">page</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> params</span><span class="token punctuation" style="color:#393A34">[</span><span class="token symbol" style="color:#36acaa">:page</span><span class="token punctuation" style="color:#393A34">]</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><span class="token symbol" style="color:#36acaa">per_page</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token number" style="color:#36acaa">20</span><span class="token punctuation" style="color:#393A34">)</span><br></span></code></pre><div class="buttonGroup__atx"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_eSgA" aria-hidden="true"><svg class="copyButtonIcon_y97N" viewBox="0 0 24 24"><path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg class="copyButtonSuccessIcon_LjdS" viewBox="0 0 24 24"><path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div></div><footer class="theme-doc-footer docusaurus-mt-lg"><div class="theme-doc-footer-edit-meta-row row"><div class="col"><a href="https://github.com/activerecord-hackery/ransack/edit/main/docs/docs/getting-started/sorting.md" target="_blank" rel="noreferrer noopener" class="theme-edit-this-page"><svg fill="currentColor" height="20" width="20" viewBox="0 0 40 40" class="iconEdit_eYIM" aria-hidden="true"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page</a></div><div class="col lastUpdated_vbeJ"></div></div></footer></article><nav class="pagination-nav docusaurus-mt-lg" aria-label="Docs pages navigation"><a class="pagination-nav__link pagination-nav__link--prev" href="/ransack/getting-started/search-matches/"><div class="pagination-nav__sublabel">Previous</div><div class="pagination-nav__label">Search Matchers</div></a><a class="pagination-nav__link pagination-nav__link--next" href="/ransack/getting-started/using-predicates/"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Using Predicates</div></a></nav></div></div><div class="col col--3"><div class="tableOfContents_bqdL thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#sorting-in-the-view" class="table-of-contents__link toc-highlight">Sorting in the View</a></li><li><a href="#sorting-in-the-controller" class="table-of-contents__link toc-highlight">Sorting in the Controller</a></li></ul></div></div></div></div></main></div></div><footer class="footer footer--dark"><div class="container container-fluid"><div class="row footer__links"><div class="col footer__col"><div class="footer__title">Docs</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/ransack/">Documentation</a></li></ul></div><div class="col footer__col"><div class="footer__title">Community</div><ul class="footer__items clean-list"><li class="footer__item"><a href="https://stackoverflow.com/questions/tagged/ransack" target="_blank" rel="noopener noreferrer" class="footer__link-item">Stack Overflow<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_lCJq"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div><div class="col footer__col"><div class="footer__title">More</div><ul class="footer__items clean-list"><li class="footer__item"><a class="footer__link-item" href="/ransack/blog/">Blog</a></li><li class="footer__item"><a href="https://github.com/activerecord-hackery/ransack" target="_blank" rel="noopener noreferrer" class="footer__link-item">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_lCJq"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a></li></ul></div></div></div></footer></div>
<script src="/ransack/assets/js/runtime~main.cc01bd68.js"></script>
<script src="/ransack/assets/js/main.c5b1ea80.js"></script>
</body>
</html>