Skip to content

Latest commit

 

History

History
89 lines (54 loc) · 3.6 KB

textbox-list.md

File metadata and controls

89 lines (54 loc) · 3.6 KB

Contentment for Umbraco logo

Contentment for Umbraco

Textbox List

Textbox List is a property-editor that uses a data-source to give you a textbox for each item in the data-source.

This property-editor has taken inspiration from the community packages, KeyValue Editor by Chriztian Steinmeier and Multilanguage Textbox by Dave Woestenborghs.

For information about data-sources, please see the documentation for the Data List property-editor.

How to configure the editor?

In your new Data Type, selected the "[Contentment] Textbox List" option. You will see the following configuration fields.

Configuration Editor for Textbox List

The first field is Data source, this is used to provide a list of predefined values to suggest to the user for the textbox list.

The configuration of the data source uses the same approach as the Data List editor, please see the documentation for example data source options.

An extensive list of all the built-in data-sources is available.

For our example, let's choose User-defined List. You will then be presented with configuration options for this data source.

Configuration Editor for Textbox List - data source configuration (for User-defined List)

Once you have configured the data source, press the Done button at the bottom of the overlay. You should notice that the Preview for the data source has been updated.

Configuration Editor for Textbox List - data source configuration (for User-defined List)

The next fields, Default icon and Label style are for the presentation of the icon and label that is associated with each textbox in the list.

When you are happy with the configuration, you can Save the Data Type and add it to your Document Type.

How to use the editor?

Once you have added the configured Data Type to your Document Type, the Textbox List editor will be displayed on the content page's property panel.

Textbox List property-editor - displaying a textbox for each item in the data source

How to get the value?

The value for the Textbox List will be a NameValueCollection object-type.

To use this in your view templates, here are some examples.

For our example, we'll assume that your property's alias is "textboxList", then...

Using Umbraco's Models Builder...

<dl>
    @foreach (var key in Model.TextboxList.AllKeys)
    {
        <dt>@key</dt>
        <dd>@Model.TextboxList[key]</dd>
    }
</dl>

...or if you don't need to loop over the values, you can access them directly like this...

@Model.TextboxList["email"]

Without ModelsBuilder...

The weakly-typed API may give you some headaches, I suggest using strongly-typed, (or preferably Models Builder).

Here's an example of strongly-typed...

<dl>
    @{
        var textboxList = Model.Value<System.Collections.Specialized.NameValueCollection>("textboxList");
        foreach (var key in textboxList.AllKeys)
        {
            <dt>@key</dt>
            <dd>@textboxList[key]</dd>
        }
    }
</dl>