Learn More





DNN Community Blog

The Community Blog is a personal opinion of community members and by no means the official standpoint of DNN Corp or DNN Platform. This is a place to express personal thoughts about DNNPlatform, the community and its ecosystem. Do you have useful information that you would like to share with the DNN Community in a featured article or blog? If so, please contact .

The use of the Community Blog is covered by our Community Blog Guidelines - please read before commenting or posting.

Configurable Custom Input Type - Advanced Dynamic Data / Dynamic Content Creation (400)

Very often you'll create a custom input-type (like a select-value-from-json-feed) and then want to provide the web-designer with additional configuration options - like specifying the web service which will deliver the json-feed. Here's how…

Note that this is very advanced stuff, not for beginners. We label it as level 400. 

There's a Demo App for that

To make it easier, there's an App which demonstrates this.


Basically we'll assume you already know how to create a custom input-type. Now all we need to add is:

  1. A definition of what can be configured in a field (a new content-type with the fields)
  2. A way to connect this definition with the UI to configure fields
  3. The place to store this configuration as field-metadata (describing how the field should behave)
  4. And a way to pass on the configuration to the UI when the field is being used

Defining the Configuration Possibilities (Step 1/2)

As with everything in the EAV of 2sxc, we'll create a content-type which lets 2sxc know what can be saved. So let's start:

Step 1 - Create the Configuration Content-Type

Go to the data-administration and switch to advanced-mode (ctrl+click) and change the scope to System, just like you did when you defined your content-type - if you don't know about this, read either the initial blog explaining how to create simple custom input-fields or this blog describing scopes.  Now: create a NEW content-type with the name "@" and the exact name of the input-type in lower-case. Make sure it's in the System-Scope (see following image)


Step 2: Add the fields which the web-designer should pre-configure

Now add the fields etc. just like you would otherwise

Step 3: Connecting your Config-Content-Type to the Field-Definitions

You don't have to do anything - because this connection happens through the content-type name. You'll notice that 2sxc/EAV will automatically pick this up. So if you have a field of type "number" with input of type "number-tosic-fromlist" then you only have to ensure that the content-type for configuring this is called "@number-tosic-fromlist" and has a System-scope. 

So then when you edit a field it will also show you your fields - like this:

Step 4: Using the Configuration in your UI

The EAV will automatically retrieve this information and provide it to the edit-UI, so all you need to know is where to pick it up in your JavaScript code. Here's what you must know;

1. The configuration consists of multiple config-items - like
a. "All" - which contains things like the label for this field, the description and the default value.
b. "String" - or "Number" or whatever content-type you have - again consisting of setting especially made for this data-type
c. "string-yourcompany-whatever" containing the specific settings
d. "merged" - a JavaScript object containing a mix of all these settings, with top priority for the most specific. So if both "String" and "string-yourstuff" contain a value "InputType", then merged.InputType would contain the one value of "string-yourstuff"
2. Inside your AngularJS controller, you can access these settings through $ - check out the pic:

So basically that's it. It's probably best if you take a look at the demo-app number-tosic-fromlist to understand the code and everything a bit better. 

Love from Switzerland,

Daniel Mettler grew up in the jungles of Indonesia and is founder and CEO of 2sic internet solutions in Switzerland and Liechtenstein, an 20-head web specialist with over 800 DNN projects since 1999. He is also chief architect of 2sxc (see forge), an open source module for creating attractive content and DNN Apps.

Read more posts by Daniel Mettler


There are currently no comments, be the first to post one.

Comment Form

Only registered users may post comments.


2sic Daniel Mettler (124)
Aderson Oliveira (15)
Alec Whittington (11)
Alex Shirley (10)
Andrew Nurse (30)
Anthony Glenwright (5)
Antonio Chagoury (28)
Ash Prasad (21)
Ben Schmidt (1)
Benjamin Hermann (25)
Benoit Sarton (9)
Beth Firebaugh (12)
Bill Walker (36)
Bob Kruger (5)
Brian Dukes (2)
Brice Snow (1)
Bruce Chapman (20)
Bryan Andrews (1)
cathal connolly (55)
Charles Nurse (163)
Chris Hammond (203)
Chris Paterra (55)
Clinton Patterson (28)
Cuong Dang (21)
Daniel Bartholomew (2)
Dave Buckner (2)
David Poindexter (3)
David Rodriguez (2)
Doug Howell (11)
Erik van Ballegoij (30)
Ernst Peter Tamminga (74)
Geoff Barlow (6)
Gifford Watkins (3)
Gilles Le Pigocher (3)
Ian Robinson (7)
Israel Martinez (17)
Jan Blomquist (2)
Jan Jonas (3)
Jaspreet Bhatia (1)
Jenni Merrifield (6)
Joe Brinkman (269)
John Mitchell (1)
Jon Henning (14)
Jonathan Sheely (4)
Jordan Coopersmith (1)
Joseph Craig (2)
Kan Ma (1)
Keivan Beigi (3)
Ken Grierson (10)
Kevin Schreiner (6)
Leigh Pointer (31)
Lorraine Young (60)
Malik Khan (1)
Matthias Schlomann (15)
Mauricio Márquez (5)
Michael Doxsey (7)
Michael Tobisch (3)
Michael Washington (202)
Mike Horton (19)
Mitchel Sellers (28)
Nathan Rover (3)
Navin V Nagiah (14)
Néstor Sánchez (31)
Nik Kalyani (14)
Peter Donker (52)
Philip Beadle (135)
Philipp Becker (4)
Richard Dumas (22)
Robert J Collins (5)
Roger Selwyn (8)
Ruben Lopez (1)
Ryan Martinez (1)
Salar Golestanian (4)
Sanjay Mehrotra (9)
Scott McCulloch (1)
Scott S (11)
Scott Wilkinson (3)
Scott Willhite (97)
Sebastian Leupold (80)
Shaun Walker (237)
Shawn Mehaffie (17)
Stefan Cullmann (12)
Stefan Kamphuis (12)
Steve Fabian (31)
Timo Breumelhof (24)
Tony Henrich (3)
Torsten Weggen (2)
Vicenç Masanas (27)
Vincent Nguyen (3)
Vitaly Kozadayev (6)
Will Morgenweck (37)
Will Strohl (163)
William Severance (5)
Try Evoq
For Free
Start Free Trial
a Demo
See Evoq Live
Need More Information?