Feature Request: Move display template into it's own concept

Nov 10, 2013 at 2:06 PM
I was thinking -- it might be easier to create forms in a much easier manner if the display template was separate from the form fields. Have you thought about adding a display and edit template concept that uses tokens to place the fields? Maybe even with different display and edit forms based on security role?
Coordinator
Nov 27, 2013 at 8:14 AM
You don't have to use the templates on the form item level - you can also define templates in the module settings, then they are valid for all items. These templates will be overwritten by templates that have been entered at the form item level.

Best wishes
Michael
Jul 22, 2014 at 11:02 AM
I was thinking about this and I am not sure it will help. Consider a complex form where I have multiple sections, maybe a few "expand/collapse" areas, some with 2 columns, some with 4 columns, etc. Right now, this is almost impossible to do with the per item template. What I end up doing right now is creating the HTML by hand in note pad, and then very carefully breaking it up into unique item templates for every form field -- its a lot of work. It would be really cool if we could leverage something like bootstrap (or any other ui framework) and create custom layouts in an easier manner. My thought was to create a concept called "Form Template" that could be used like this below (note: we would still need to create individual form items just like we do today, this would just allow a complete override of the layout in one single step)
<fieldset>

    <!-- Form Name -->
    <legend>Form Name</legend>
    <!-- Select Basic -->
    <div class="form-group">
        <label class="col-md-3 control-label" for="[FIELD_SELECTBASIC_INPUT_ID]">[FIELD_SELECTBASIC_LABEL]</label>
        <div class="col-md-9">
            [FIELD_FIELD_SELECTBASIC_INPUT class="form-control"]
        </div>
    </div>

    <!-- Text input-->
    <div class="form-group">
        <label class="col-md-3 control-label" for="[FIELD_TEXTINPUT1_INPUT_ID]">[FIELD_TEXTINPUT1_LABEL]</label>  
        <div class="col-md-3">
            [FIELD_TEXTINPUT1_INPUT placeholder="Some Text" class="form-control input-md"]
        </div>

        <!-- Multiple Radios (inline) -->
        <label class="col-md-3 control-label" for="[FIELD_RADIO1_GROUP_ID]">Inline Radios</label>
        <div class="col-md-3"> 
            <label class="radio-inline" for="[FIELD_RADIO1_INPUT_ID]">
                [FIELD_RADIO1_INPUT]
            </label> 
            <label class="radio-inline" for="[FIELD_RADIO2_INPUT_ID]">
                [FIELD_RADIO2_INPUT]
            </label> 
        </div>
    </div>
    
    <div class="form-group">
        <label class="col-md-3 control-label" for="[FIELD_TEXTINPUT2_INPUT_ID]">[FIELD_TEXTINPUT2_LABEL]</label>  
        <div class="col-md-3">
            [FIELD_TEXTINPUT2_INPUT placeholder="Some More Text" class="form-control input-md"]
        </div>

        <label class="col-md-3 control-label" for="[FIELD_TEXTINPUT3_INPUT_ID]">[FIELD_TEXTINPUT3_LABEL]</label>  
        <div class="col-md-3">
            [FIELD_TEXTINPUT3_INPUT placeholder="Event More Text" class="form-control input-md"]
        </div>
    </div>

    <!-- Textarea -->
    <div class="form-group">
        <label class="col-md-3 control-label" for="[FIELD_TEXTAREA1_INPUT_ID]">[FIELD_TEXTAREA1_LABEL]</label>  
        <div class="col-md-9">                     
            [FIELD_TEXTAREA1_INPUT class="form-control input-md"]
        </div>
    </div>

    <!-- Button (Double) -->
    <div class="form-group">
        <label class="col-md-3 control-label" for="button1id"></label>
        <div class="col-md-8">  
            [BUTTON_SUBMIT Text="Ok" class="btn btn-success"]
            [BUTTON_CANCEL Text="Cancel" class="btn btn-danger"]
        </div>
    </div>

</fieldset>
Which would then render something like this: Link to bootply sample
Coordinator
Jul 28, 2014 at 1:10 PM
Thanks for your input.

There are modules on the market that have features like this and that allow the creation of complex forms. Guess why they are not for free.

This module is useful to create a simple form in an easy way, a bit more than DNN Feedback, but not at the level you propose. It should help people without HTML/CSS knowledge to create a more customized feedback or contact or whatever simple form, and it has some tools included to help the designer to adjust the layout. The next (major) version will improve templating, but most probably, it will never reach this stage. The main goal is to keep it simple.

Best wishes
Michael