All Projects → annkissam → Rummage_phoenix

annkissam / Rummage_phoenix

Licence: mit
Full Phoenix Support for Rummage. It can be used for searching, sorting and paginating collections in phoenix.

Programming Languages

elixir
2628 projects

Projects that are alternatives of or similar to Rummage phoenix

Rummage ecto
Search, Sort and Pagination for ecto queries
Stars: ✭ 190 (+31.94%)
Mutual labels:  search, sort, pagination, sorting
React Grid Table
A modular table, based on a CSS grid layout, optimized for customization.
Stars: ✭ 57 (-60.42%)
Mutual labels:  search, sort, pagination
Queryql
Easily add filtering, sorting, and pagination to your Node.js REST API through your old friend: the query string!
Stars: ✭ 76 (-47.22%)
Mutual labels:  sort, pagination, sorting
spring-boot-jpa-rest-demo-filter-paging-sorting
Spring Boot Data JPA with Filter, Pagination and Sorting
Stars: ✭ 70 (-51.39%)
Mutual labels:  pagination, sorting, sort
Filterable
Filtering from incoming params in Elixir/Ecto/Phoenix with easy to use DSL.
Stars: ✭ 83 (-42.36%)
Mutual labels:  phoenix, pagination, sorting
List.js
The perfect library for adding search, sort, filters and flexibility to tables, lists and various HTML elements. Built to be invisible and work on existing HTML.
Stars: ✭ 10,650 (+7295.83%)
Mutual labels:  search, sort, pagination
Table Dragger
Turn your old table to drag-and-drop table with columns and rows sorting like magic!
Stars: ✭ 704 (+388.89%)
Mutual labels:  sort, sorting
Query
Query adds tools to aid the use of Ecto in web settings.
Stars: ✭ 23 (-84.03%)
Mutual labels:  sort, phoenix
Sorty
Fast Concurrent / Parallel Sorting in Go
Stars: ✭ 74 (-48.61%)
Mutual labels:  sort, sorting
Algorithms
Minimal examples of data structures and algorithms in Python
Stars: ✭ 20,123 (+13874.31%)
Mutual labels:  search, sort
C
Collection of various algorithms in mathematics, machine learning, computer science, physics, etc implemented in C for educational purposes.
Stars: ✭ 11,897 (+8161.81%)
Mutual labels:  search, sort
Sortingalgorithm.hayateshiki
Hayate-Shiki is an improved merge sort algorithm with the goal of "faster than quick sort".
Stars: ✭ 84 (-41.67%)
Mutual labels:  sort, sorting
Cassandra Lucene Index
Lucene based secondary indexes for Cassandra
Stars: ✭ 584 (+305.56%)
Mutual labels:  search, sorting
Go
Algorithms Implemented in GoLang
Stars: ✭ 7,385 (+5028.47%)
Mutual labels:  search, sorting
Sieve
⚗️ Clean & extensible Sorting, Filtering, and Pagination for ASP.NET Core
Stars: ✭ 560 (+288.89%)
Mutual labels:  sort, pagination
Quadsort
Quadsort is a stable adaptive merge sort which is faster than quicksort.
Stars: ✭ 1,385 (+861.81%)
Mutual labels:  sort, sorting
Javascript
A repository for All algorithms implemented in Javascript (for educational purposes only)
Stars: ✭ 16,117 (+11092.36%)
Mutual labels:  search, sort
Vue Table Dynamic
🎉 A dynamic table with sorting, filtering, editing, pagination, multiple select, etc.
Stars: ✭ 106 (-26.39%)
Mutual labels:  pagination, sorting
Graphql To Mongodb
Allows for generic run-time generation of filter types for existing graphql types and parsing client requests to mongodb find queries
Stars: ✭ 261 (+81.25%)
Mutual labels:  sort, pagination
Gridjs
Advanced table plugin
Stars: ✭ 3,231 (+2143.75%)
Mutual labels:  sort, pagination

Rummage.Phoenix

Build Status Hex Version hex.pm downloads Hex docs docs MIT licensed

Rummage.Phoenix is a support framework for Phoenix that can be used to manipulate Phoenix collections and Ecto models with Search, Sort and Paginate operations.

It accomplishes the above operations by using Rummage.Ecto, to paginate Ecto queries and adds Phoenix and HTML support to views and controllers. For information on how to configure Rummage.Ecto visit this page.

The best part about rummage is that all the three operations: Search, Sort and Paginate integrate seamlessly and can be configured separately. To check out their seamless integration, please check the information below.

NOTE: Rummage is not like Ransack, and doesn't intend to be either. It doesn't add functions based on search params. If you'd like to have that for a model, you can always configure Rummage to use your Search module for that model. This is why Rummage has been made configurable.


Search, Sort and Paginate seamlessly in Phoenix!

phoenix all together


Installation

This is available in Hex, the package can be installed as:

  • Add rummage_phoenix to your list of dependencies in mix.exs:

    def deps do
      [
        {:rummage_phoenix, "~> 1.2.0"}
      ]
    end
    

Blogs

Current Blogs:

Coming up next:

  • Using Rummage.Phoenix 2
  • Using the Rummage Search hook
  • Using the Rummage Sort hook
  • Writing a Custom Rummage.Ecto Hook
  • Writing a Custom Rummage.Phoenix HTML helper
  • Using Rummage with other Libraries: Kerosene
  • Using Rummage with other Libraries: Scrivener

Configuration (Optional, Not the preferred way to set default_per_page)

Rumamge.Phoenix can be configured globally with a default_per_page value (which can be overriden for a model). This is NOT the preferred way to set default_per_page as it might lead to conflicts. It is recommended to do it per model as show below in the Initial Setup section. If you want to set default_per_page for all the models, add it to model function in web.ex

  • Add rummage_phoenix config to your list of configs in dev.exs:

    config :rummage_phoenix,
      Rummage.Phoenix,
      default_per_page: 5
    

Usage (The screenshots correspond to version 0.6.0, soon there will be screenshots for version 1.0.0)

Initial Setup

  • Use Rummage.Controller in to controller module:
defmodule MyApp.ProductController do
  use MyApp.Web, :controller
  use Rummage.Phoenix.Controller

  # More code below....
end
  • Change the index action in the controller:
def index(conn, params) do
  {query, rummage} = Product
    |> Rummage.Ecto.rummage(params["rummage"])

  products = Repo.all(query)

  render conn, "index.html",
    products: products,
    rummage: rummage
end
  • if using Search feature, define a search path in the router.ex (no need to define the action):
scope "/", MyApp do
  pipe_through :browser # Use the default browser stack

  get "/", PageController, :index
  resources "/products", ProductController
end

Doing this itself will allow you to search, sort and paginate by updating params on the request. Please check the screenshots below for details

Using Rummage.ViewHelpers

  • Use Rummage.View in to a view module:
defmodule MyApp.ProductView do
  use MyApp.Web, :view
  use Rummage.Phoenix.View

  # More code below...
end

Note: If you get a "MyApp.Router.Helpers is not available" exception, you can provide your router with:

defmodule MyApp.ProductView do
  use MyApp.Web, :view
  use Rummage.Phoenix.View, helpers: MyApp.Web.Router.Helpers

  # More code below...
end

or through the config:

config :rummage_phoenix, Rummage.Phoenix, [
  default_helpers: MyApp.Web.Router.Helpers,
]

Note: If the path helper name is incorrect, you can specify it with:

defmodule MyApp.ProductView do
  use MyApp.Web, :view
  use Rummage.Phoenix.View, struct: "special_product" # will become special_product_path

  # More code below...
end
  • Pagination:

Add this at the bottom of index.html.eex to render Rummage pagination links (Make sure that you pass rummage to the views from the index action in the controller) :

<%= pagination_link(@conn, @rummage) %>

Reload and this is how your page should look:

phoenix pagination

  • Sorting:

Replace table headers on the index.html.eex with sort links (Make sure that the headers are actual columns in the table in the database.)

Replace this:

  <th>Name</th>
  <th>Price</th>
  <th>Category</th>

With:

  <th><%= sort_link @conn, @rummage, [field: :name, ci: true] %></th>
  <th><%= sort_link @conn, @rummage, [field: :price] %></th>

OR for Sort by associations:

  <th><%= sort_link @conn, @rummage, [field: :name, name: "Category Name", assoc: ["category"]] %></th>

Reload and this is how your page should look with sortable links instead of just table headers:

phoenix sorting

NOTE: Currently working on adding better elements to the views, soon the text arrow in the sort links will be replaced by an icon

  • Searching:

Add a search form in the index.html.eex with searchable fields:

<%= search_form(@conn, @rummage, [fields:
[
  name: %{label: "Search by Product Name", search_type: "ilike"},
  price: %{label: "Search by Price", search_type: "eq"},
], button_class: "btn",
]) %>

OR for Search by associations:

<%= search_form(@conn, @rummage, [fields:
[
  name: %{label: "Search by Category Name", search_type: "ilike", assoc: ["category"]}
], button_class: "btn",
]) %>

Reload and your page should look somewhat like this: phoenix searching

  • ALL TOGETHER:

The best part about Rummage is that all the three hooks/operations integrate seamlessly without affecting each other's functionality and therefore, you have a page looking somewhat like this:

phoenix all together

More Screenshots

Before rummage

before pagination

After Pagination:

  • Default pagination:

after pagination

  • Custom pagination params:

custom pagination params custom pagination page

After Pagination View:

  • Default after pagination

  • Custom pagination params phoenix pagination

After Sort:

custom sort params asc custom sort page asc

custom sort params desc custom sort page desc

After Sort View:

phoenix sorting

After Search:

custom search params custom search page

After Search View:

phoenix searching

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].