Fix table filtering clash

demos/datatable/Project.toml

@@ -0,0 +1,6 @@
+[deps]
+DataFrames = "a93c6f00-e57d-5684-b7b6-d8193f3e46c0"
+Genie = "c43c736e-a2d1-11e8-161f-af95117fbd1e"
+GenieFramework = "a59fdf5c-6bf0-4f5d-949c-a137c9e2f353"
+Stipple = "4acbeb90-81a0-11ea-1966-bdaff8155998"
+StippleUI = "a3c5d34a-b254-4859-a8fa-b86abb7e84a3"

demos/datatable/app.jl

@@ -0,0 +1,20 @@
+module App
+
+using GenieFramework
+using DataFrames
+@genietools
+
+@app begin
+  NO_OF_ROWS = 10_000
+  DATA = sort!(DataFrame(rand(NO_OF_ROWS, 2), ["x1", "x2"]))
+  ROWS_PER_PAGE = 10
+
+  @out df = DATA
+  @out dt = DataTable(DataFrame([]), DataTableOptions(DATA))
+
+  @out pagination = DataTablePagination(rows_per_page = ROWS_PER_PAGE, rows_number = NO_OF_ROWS)
+  @out loading = false
+  @in filter = ""
+end
+
+end

demos/tablefilter/Project.toml

@@ -0,0 +1,6 @@
+[deps]
+DataFrames = "a93c6f00-e57d-5684-b7b6-d8193f3e46c0"
+Genie = "c43c736e-a2d1-11e8-161f-af95117fbd1e"
+GenieFramework = "a59fdf5c-6bf0-4f5d-949c-a137c9e2f353"
+Stipple = "4acbeb90-81a0-11ea-1966-bdaff8155998"
+StippleUI = "a3c5d34a-b254-4859-a8fa-b86abb7e84a3"

demos/tablefilter/app.jl

@@ -0,0 +1,42 @@
+module App
+
+using GenieFramework
+using DataFrames
+@genietools
+
+@app begin
+  NO_OF_ROWS = 1000
+  DATA = sort!(DataFrame(rand(NO_OF_ROWS, 2), ["x1", "x2"]))
+  ROWS_PER_PAGE = 10
+
+  @out df = DATA
+  @out dt = DataTable(DATA) # DataTable(DataFrame([]), DataTableOptions(DATA))
+  @out pagination = DataTablePagination(rows_per_page = ROWS_PER_PAGE, rows_number = NO_OF_ROWS)
+  @out loading = false
+  # @in filter = ""
+  @in dfilter = ""
+
+  # @onchange isready begin
+  #   dt = DataTable(DATA[1:ROWS_PER_PAGE, :])
+  #   filter = ""
+  # end
+
+  # @event request begin
+  #   loading = true
+  #   state = process_request(DATA, dt, pagination, filter)
+  #   dt = state.datatable
+  #   pagination = state.pagination
+  #   loading = false
+  # end
+
+  # @onchange filter begin
+  #   pagination.page = 1
+  #   state = process_request(DATA, dt, pagination, filter)
+  #   dt = state.datatable
+  #   pagination = state.pagination
+  # end
+end
+
+@page("/", "ui.jl")
+
+end

demos/tablefilter/ui.jl

@@ -0,0 +1,10 @@
+# table(:dt, paginationsync = :pagination, @on("request", :request), loading = :loading, filter = :filter, title = "Random data")
+Stipple.table(:dt, class="table-white-row", pagination=:pagination, dense=true, hide__pagination=false, filter=:dfilter,
+  template(var"v-slot:top-right"="",
+    textfield("", hint="Search by any keywords", :dfilter, borderless="", dense="", debounce="300", placeholder="Search", [
+      template(var"v-slot:append"=true,
+        icon("search")
+      )]
+    )
+  )
+)

demos/tables/Project.toml

@@ -1,10 +1,6 @@
 [deps]
 DataFrames = "a93c6f00-e57d-5684-b7b6-d8193f3e46c0"
 Genie = "c43c736e-a2d1-11e8-161f-af95117fbd1e"
-GenieBuilder = "c9453c14-af8a-11ec-351d-c7c9a2035d70"
-GenieDevTools = "4e5d9629-6565-4102-a9ff-45c707eb060e"
 GenieFramework = "a59fdf5c-6bf0-4f5d-949c-a137c9e2f353"
 Stipple = "4acbeb90-81a0-11ea-1966-bdaff8155998"
-StipplePlotly = "ec984513-233d-481d-95b0-a3b58b97af2b"
 StippleUI = "a3c5d34a-b254-4859-a8fa-b86abb7e84a3"
-Tables = "bd369af6-aec1-5ad0-b16a-f7cc5008161c"

demos/tables/app.jl

@@ -1,40 +1,43 @@
+module App
+
 using GenieFramework
 using DataFrames
 @genietools
 
-
 @app begin
-  NO_OF_ROWS = 10_000
+  NO_OF_ROWS = 1000
   DATA = sort!(DataFrame(rand(NO_OF_ROWS, 2), ["x1", "x2"]))
   ROWS_PER_PAGE = 10
 
   @out df = DATA
-  @out data = DataTable(DataFrame([]), DataTableOptions(DATA))
+  @out dt = DataTable(DataFrame([]), DataTableOptions(DATA))
   @out pagination = DataTablePagination(rows_per_page = ROWS_PER_PAGE, rows_number = NO_OF_ROWS)
   @out loading = false
   @in filter = ""
 
   @onchange isready begin
-    data = DataTable(DATA[1:ROWS_PER_PAGE, :])
+    dt = DataTable(DATA[1:ROWS_PER_PAGE, :])
     filter = ""
   end
 
-  @event :request begin
-    @show "requestt"
+  @event request begin
     loading = true
-    state = process_request(DATA, data, pagination, filter)
-    @show state
-    data = state.datatable
+    state = process_request(DATA, dt, pagination, filter)
+    dt = state.datatable
     pagination = state.pagination
     loading = false
   end
 
   @onchange filter begin
+    loading = true
     pagination.page = 1
-    state = process_request(DATA, data, pagination, filter)
-    data = state.datatable
+    state = process_request(DATA, dt, pagination, filter)
+    dt = state.datatable
     pagination = state.pagination
+    loading = false
   end
 end
 
-@page("/", "ui.jl")
+@page("/", "ui.jl")
+
+end

demos/tables/ui.jl

@@ -1 +1 @@
-table(:data, paginationsync = :pagination, @on("request", :request), loading = :loading, filter = :filter, title = "Random data")
+table(:dt, paginationsync = :pagination, @on("request", :request), loading = :loading, filter = :filter, title = "Random data")

src/Tables.jl

@@ -244,9 +244,10 @@ function table( fieldname::Symbol,
                 datakey::String = "$fieldname.data",
                 columnskey::String = "$fieldname.columns",
                 filter::Union{Symbol,String,Nothing} = nothing,
+                paginationsync::Union{Symbol,String,Nothing} = nothing,
                 kwargs...) :: ParsedHTMLString
 
-  if filter !== nothing
+  if filter !== nothing && paginationsync !== nothing # by convention, assume paginationsync is used only for server side filtering
     filter_input = [ParsedHTMLString("""
     <template v-slot:top-right>
       <q-input dense debounce="300" v-model="$filter" placeholder="Search">
@@ -266,6 +267,7 @@ function table( fieldname::Symbol,
       Symbol("row-key") => rowkey,
       :fieldname => fieldname,
       (filter === nothing ? [] : [:filter => filter])...,
+      (paginationsync === nothing ? [] : [:paginationsync => paginationsync])...,
       kwargs...
     ])...
   )
@@ -443,7 +445,10 @@ export process_request
 function process_request(data, datatable::DataTable, pagination::DataTablePagination, filter::AbstractString = "")
   event = params(:payload, nothing)
 
-  if event !== nothing && isa(get(event, "event", false), AbstractDict) && isa(get(event["event"], "name", false), AbstractString) && event["event"]["name"] == "request"
+  if event !== nothing &&
+    isa(get(event, "event", false), AbstractDict) &&
+      isa(get(event["event"], "name", false), AbstractString) &&
+        event["event"]["name"] == "request"
     event = event["event"]["event"]["pagination"]
   else
     event = Dict()