Skip to content
Snippets Groups Projects
Commit d6beb47a authored by Manon Bourgognon's avatar Manon Bourgognon
Browse files

update: some attributes details added

parent d60ef008
No related branches found
No related tags found
1 merge request!83update: some attributes details added
source/_static/images/import_documentation/img-core-examples/nested-field.png

11.6 KiB

......@@ -133,7 +133,7 @@ Define the ``class`` of the ``div`` containing the submit button.
``confirmation-message``
~~~~~~~~~~~~~~~~~~~~~~~~
**Migrated to the :ref:`validation-mixin <validation-mixin>` page in version 0.16**
**Migrated to the** :ref:`validation-mixin <validation-mixin>` **page in version 0.16**
.. _autocomplete-field-sf:
``autocomplete-[field]``
......
......@@ -85,7 +85,7 @@ solid-link
- ``data-src``: The resource you want to use in your view. Often
used to show more details about this resource, by adding the
``bind-resource`` attribute to a component.
``bind-resource`` attribute to a component (more details about ``bind-resources`` below).
Example:
......@@ -151,17 +151,14 @@ accordingly.
More informations about this in the :ref:`sib-auth documentation<bind-user>`.
Navigate with an event
~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~~~~~~~~~~~~~~
To trigger a route change through javascript, you can trigger a
``requestNavigation`` event anywhere on the DOM.
The detail part must have at least one of these two parameters:
* ``route``: the name of the route to activate
* ``resource``: a resource that will be
passed to all elements with the ``bind-resources`` attribute. If no
route name is given, the router tries to find a route that has a
``rdf-type`` that matches the type of the resource.
* ``resource``: a resource that will be passed to all elements with the ``bind-resources`` attribute. If no route name is given, the router tries to find a route that has a ``rdf-type`` that matches the type of the resource.
Events
------
......
......@@ -33,3 +33,51 @@ In a ``solid-widget``, you have access to these values:
NB: Do not forget to define your custom template in a ``<template>``
tag. Otherwise, your widget will not be declared properly.
Attributes
----------
``data-holder``
~~~~~~~~~~~~~~~
Special attribute which can be inserted in a ``<solid-form>`` or an ``<input>`` within a ``<solid-widget>``.
It associates the ``value`` of the concerned ``field`` in the widget.
If this attribute is combined with ``data-src="${value}"`` the value of the field is directly editable.
``data-src="${value}"``
~~~~~~~~~~~~~~~~~~~~~~~
It allows to link the ``id`` of a data, to insert it automatically as ``data-src`` of a ``<solid-form>``.
It cannot be used without ``data-holder`` attribute.
The example below illustrates the input widget with and without ``value="${value}"``
(input's ``value="${value}"`` is equivalent to solid-form's ``data-src="${value}"``) :
.. code:: html
<solid-form
data-src="../data/list/users.jsonld"
fields="email"
widget-email="custom-form-widget-1"
></solid-form>
<solid-widget name="custom-form-widget-1">
<template>
<input type="text" data-holder />
</template>
</solid-widget>
<solid-form
data-src="../data/list/user-1.jsonld"
fields="email"
widget-email="custom-form-widget-2"
></solid-form>
<solid-widget name="custom-form-widget-2">
<template>
<input type="text" data-holder value="${value}" />
</template>
</solid-widget>
.. figure:: ../../_static/images/import_documentation/img-core-examples/data-holder-in-solid-widget.png
:alt: solid-widget with and without value="${value}" attribute
......@@ -35,6 +35,27 @@ Attributes
with the attribute ``bind-resources``) but you need to display
another field of this source.
The example below illustrates how to use nested-field attribute.
The ``profile`` value is an ``id`` of another resource, it will automatically fetch the ``city``, ``phone``, ``website`` values to display them.
The second solid-display shows another way to display the values from a nested resource with dot ``.``.
.. code:: html
<solid-display
data-src="data/list/user-1.jsonld"
nested-field="profile"
fields="city, phone, website"
></solid-display>
<solid-display
data-src="data/list/user-1.jsonld"
fields="profile.city, profile.phone, profile.website"
></solid-display>
.. figure:: ../../_static/images/import_documentation/img-core-examples/nested-field.png
:alt: nested-field attribute use
.. _extra-context:
``extra-context``
~~~~~~~~~~~~~~~~~
......
......@@ -23,9 +23,11 @@ Attributes
By default, all the fields of the resource are displayed.
To not show any fields, put an empty fields (eg.
``<solid-display fields />)``
``<solid-display fields />)``.
By default, all displayed fields are inserted into a ``<div>``
By default, all displayed fields are inserted into a ``<div>``.
It is possible to use the dot ``.`` to display data from a nested resource.
**Sets**
......@@ -41,7 +43,7 @@ Attributes
fields="fullName(first_name, last_name), email"
></solid-display>
You can customize the group widget, see the :ref:`Sets widgets <reference>` page for more info.
You can customize the group widget, see the :ref:`reference widgets <reference>` page for more info.
**Strings**
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment