Adding combo-box component and binding to dynamic data sources

For using a combo-box for editing definition lists you have to configure the Details Pane Template accordingly.

Since DPE 2.8.25, we have removed the need to specify "source=legacyController.definitionSource" in the configuration, it will automatically use the definition source if the field is a known definition field.

At the moment, we use dynamic sources only for definitions.

Combo box Configuration Example

The user selects the value of definition list fields from a list of values. For some fields the user has the possibility to enter any value.
The user can also quickly find the desired value from the list by typing in some text.
(Please replace XXX by the desired field name)

Code

XML

{{combo-box model=editModel field="XXX"}}

Allowing free text, too

In addition to selecting and finding the desired value the user can enter any value that is not inside the definition list if canCreate property is set to true in the configuration as follows:
(Please replace XXX by the desired field name)

Code

XML

{{combo-box model=editModel field="XXX" canCreate=true}}

Full configuration example

In this full example we have included a combo box with free text for the definition list field Author and another one without free text for the definition list field Language.
Also notice that we have added the value when the Details Pane is not in edit mode (read-only mode) so that the user can visualize the values after saving his changes.

Code

XML

{{#form-container legacyController=legacyController}}
    {{#if editable}}
        {{#responsive-grid-area}}
            <div data-col="sm-4 xs-12 valign-sm-center valign-xs-bottom">
				{{label-helper value=editModel.Language label="Language:"}}
			</div>
            <div data-col="sm-8 xs-12 valign-center" class="editable-field">
				{{combo-box model=editModel field="Language"}}
			</div>

            <div data-col="sm-4 xs-12 valign-sm-center valign-xs-bottom">
				{{label-helper value=editModel.Author label="Author:"}}
			</div>
            <div data-col="sm-8 xs-12 valign-center" class="editable-field">
				{{combo-box model=editModel field="Author" canCreate=true}}
			</div>
        {{/responsive-grid-area}}
    {{else}}
        {{#responsive-grid-area}}     
            <div data-col="sm-4 xs-12 valign-sm-center valign-xs-bottom">
				Language:
			</div>
            <div data-col="sm-8 xs-12 valign-center">
				{{model.Language}}
			</div>

            <div data-col="sm-4 xs-12 valign-sm-center valign-xs-bottom">
				Author:
			</div>
            <div data-col="sm-8 xs-12 valign-center">
				{{model.Author}}
			</div>
        {{/responsive-grid-area}}
    {{/if}}
{{/form-container}}

Available definition fields

In DigaSystem all these definition fields should be configured without free text (no canCreate property in the combo box).
Except for Author, Editor, Broadcast, Motive and Distribution, which can be configured with free text by default.

You can set the parameter distinct="true" on the combo-box for the fields "Author" and "Editor", which will lead to reading the values from existing ones in the database table instead of reading them from definition lists.

Column	Section	Column	Section
Intensity	0	Era	17
Category	1	Playtime	18
Presenter	2	Target	19
Production	3	Instrumentation	20
Seasonal	4	Carrier	21
Program	5	Fading	22
Speaker	6	Language	23
Style	7	Priority	24
End	8	Product	25
Tempo	9	ProductGroup	26
Customer	10	MediumType	27
ExtDevice	11	SendRights	28
Project	12	Author	29
Container	13	Editor	30
MusicFormat	14	Broadcast	31
MusicType	15	Motive	32
Mood	16	Distribution	33