DerDu/SPHERE-Framework

<div class="form-group {{ ElementGroup }}">
    {% if( ElementLabel is not empty ) %}
        <label>{{ ElementLabel }}{% if( Required is not empty ) %}<span class="text-danger"> *</span>{% endif %}</label>
    {% endif %}
    {% if( ElementIcon is not empty ) %}
    <div class="input-group">
        <span class="input-group-addon">
            {{ ElementIcon }}
        </span>
        {% endif %}
        <textarea id="TextArea-{{ ElementHash }}" name="{{ ElementName }}" class="form-control{% if( ElementClass is not empty ) %} {{ ElementClass }}{% endif %}{% if( DisableLineFeed is not empty ) %} DisableLineFeed{% endif %}" placeholder="{{ ElementPlaceholder }}"
                  rows="{{ ElementRows }}"
                  {% if( Disabled is not empty ) %}disabled{% endif %} {% if( Required is not empty ) %}required{% endif %}
                  {% if( TabIndex is not empty ) %}tabindex="{{ TabIndex }}"{% endif %}
                  {% if( MaxLength is not empty ) %}maxlength="{{ MaxLength }}"{% endif %}
        >{{ ElementValue }}</textarea>
        {% if( MaxLength is not empty ) %}
            <span class="TextAreaMaxLengthInfo text-muted small pull-right">
                <span class="TextAreaMaxLengthCounter">{{ MaxLength }}</span> Zeichen verfügbar
            </span>
            <script type="text/javascript">
                //noinspection JSUnresolvedFunction
                executeScript(function() {
                    Client.Use('ModAlways', function () {
                        var TextArea = jQuery('textarea#TextArea-{{ ElementHash }}')
                        var maxLength = TextArea.attr('maxlength');
                        TextArea.parent('div').find('.TextAreaMaxLengthCounter').html(maxLength - TextArea.val().length);
                        TextArea.on('input propertychange', function () {
                            var maxLength = $(this).attr('maxlength');
                            var disableLineFeed = $(this).hasClass('DisableLineFeed');
                            if (disableLineFeed) {
                                $(this).val($(this).val().replace(/\r?\n/gi, ' '));
                            }
                            if ($(this).val().length > maxLength) {
                                $(this).val($(this).val().substring(0, maxLength));
                            }
                            $(this).parent('div').find('.TextAreaMaxLengthCounter').html(maxLength - $(this).val().length);
                        })
                    });
                });
            </script>
        {% endif %}
        {{ ElementFeedbackIcon }}
        {% if( ElementIcon is not empty ) %}
    </div>
    {% endif %}
    {{ ElementFeedbackMessage }}
</div>