Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
cto
g1
Commits
61aef51b
Commit
61aef51b
authored
May 22, 2020
by
S Anand
Browse files
ENH: $().formhandler() exposes $().data('formhandler') data & methods
parent
69ffcde7
Pipeline
#124455
failed with stage
in 3 minutes and 2 seconds
Changes
3
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
docs/formhandler.md
View file @
61aef51b
...
...
@@ -128,6 +128,7 @@ e.g., to render the export button somewhere else, use
contents with the export button. (It searches within the table container for
`.navbar-export`
first, and if not found, searches everywhere.) Available
targets are:
-
`tableTarget`
-
`countTarget`
-
`pageTarget`
...
...
@@ -139,6 +140,7 @@ targets are:
**Advanced**
: Each component's template string can be over-ridden. For example,
`data-search-template="<input type='search'>"`
will replace the search template
with a simple input. Available template strings are:
-
`tableTemplate`
-
`table_gridTemplate`
-
`countTemplate`
...
...
@@ -148,11 +150,11 @@ with a simple input. Available template strings are:
-
`filtersTemplate`
-
`searchTemplate`
-
`rowTemplate`
, which can be a string template or function
-
function accepts an object with these keys:
-
`row`
: row data
-
`index`
: row index
-
`data`
: the dataset from
`src`
-
string template can use the above variables
-
function accepts an object with these keys:
-
`row`
: row data
-
`index`
: row index
-
`data`
: the dataset from
`src`
-
string template can use the above variables
Features to be implemented:
...
...
@@ -172,6 +174,30 @@ Features to be implemented:
-
`editmode`
is fired on the source when the Edit button is clicked and table changes to edit mode.
## $.formhandler data
When you run
`$(...).formhandler()`
on an element, you can access
FormHandler-related data and methods via
`$(...).data('formhandler')`
. This
returns an object with these keys:
-
`data`
: data currently displayed by the component (as an array of objects)
-
`meta`
: metadata returned by the FormHandler (e.g.
`meta['fh-data-count']`
has the total # of rows)
-
`args`
: args passed to the FormHandler
-
`options`
: options passed to this component
-
`isEdit`
:
`true`
if the component is editable
-
`isAdd`
:
`true`
if new rows can be added to the component
-
`notify`
:
`notify('message')`
displays a notification on this component
For example:
```
js
$
(
'
.formhandler
'
).
formhander
()
var
data
=
$
(
'
.formhandler
'
).
data
(
'
formhandler
'
)
data
.
data
// data displayed by component
data
.
meta
// metadata returned by the FormHandler
data
.
args
// args passed to the FormHandler
```
## $.formhandler examples
### Render from a FormHandler
...
...
src/formhandler.js
View file @
61aef51b
...
...
@@ -123,7 +123,9 @@ export function formhandler(js_options) {
col_defaults
:
col_defaults
,
isEdit
:
false
,
isAdd
:
false
,
templates
:
default_templates
templates
:
default_templates
,
notify
:
notify
.
bind
(
this
,
$this
,
template
),
failHandler
:
failHandler
.
bind
(
this
,
$this
,
template
)
}
// Store template_data in $this
$this
.
data
(
'
formhandler
'
,
template_data
)
...
...
test/test-formhandler.html
View file @
61aef51b
...
...
@@ -1090,6 +1090,48 @@
})
})
$
(
'
.fhdata
'
).
formhandler
()
.
on
(
'
load
'
,
function
()
{
var
data
=
$
(
'
.fhdata
'
).
data
(
'
formhandler
'
)
// `data`: data currently displayed by the component (as an array of objects)
t
.
equals
(
data
.
data
.
length
,
data
.
meta
.
limit
)
t
.
deepEquals
(
Object
.
keys
(
data
.
data
[
0
]),
_
.
map
(
data
.
meta
.
columns
,
'
name
'
))
// `meta`: metadata returned by the FormHandler (e.g. `meta['fh-data-count']` has the total # of rows)
t
.
equals
(
data
.
meta
.
offset
,
0
)
t
.
equals
(
data
.
meta
.
limit
,
100
)
t
.
ok
(
data
.
meta
.
count
>
100
)
t
.
ok
(
Array
.
isArray
(
data
.
meta
.
columns
))
t
.
ok
(
'
name
'
in
data
.
meta
.
columns
[
0
])
t
.
ok
(
'
type
'
in
data
.
meta
.
columns
[
0
])
t
.
ok
(
'
hide
'
in
data
.
meta
.
columns
[
0
])
t
.
ok
(
'
hideable
'
in
data
.
meta
.
columns
[
0
])
t
.
ok
(
'
sort
'
in
data
.
meta
.
columns
[
0
])
t
.
ok
(
'
filters
'
in
data
.
meta
.
columns
[
0
])
// `args`: args passed to the FormHandler
t
.
equals
(
data
.
args
.
_format
,
'
json
'
)
t
.
equals
(
data
.
args
.
_limit
,
100
)
t
.
equals
(
data
.
args
.
_meta
,
'
y
'
)
t
.
ok
(
Array
.
isArray
(
data
.
args
.
c
))
// `options`: options passed to this component
t
.
ok
(
typeof
data
.
options
.
add
,
'
boolean
'
)
t
.
ok
(
typeof
data
.
options
.
pageSize
,
'
number
'
)
// `isEdit`: `true` if the component is editable
// `isAdd`: `true` if new rows can be added to the component
t
.
equals
(
typeof
data
.
isEdit
,
'
boolean
'
)
t
.
equals
(
typeof
data
.
isAdd
,
'
boolean
'
)
// `notify`: `notify('message')` displays a notification on this component
data
.
notify
(
'
message
'
)
t
.
equals
(
$
(
'
.fhdata .alert
'
).
get
(
0
).
childNodes
[
0
].
textContent
.
replace
(
/^
\s
+/
,
''
).
replace
(
/
\s
+$/
,
''
),
'
message
'
)
// Undocumented: but expose failHandler to allow subclassing
t
.
equals
(
typeof
data
.
failHandler
,
'
function
'
)
t
.
end
()
})
</script>
</body>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment