freenet-router

Subversion Repositories:
[/] [trunk/] [freenet-router/] [var/] [www/] [freenet-router/] [Framework/] [Resources/] [templates/] [simpleForm.twig] - Rev 2
Compare with Previous - Blame - Download
{% set datepickers = [] %}
<script>
    function sendForm() {
        showLoading();
        tinymce.triggerSave();
        $.post("{{ form.action|raw }}", $("#{{ form.name }}").serialize())
                .done(function(data) {
                    $("#{{ form.name }}").replaceWith(data);
                    $("#btnSendFormAjax").feedback("Data odeslĂĄna.", {duration: 3000, right: true});
                    hideLoading();
                });
        return false;
    }
    /* inicializace tinyMCE */
    $(function() {
        $("form textarea").each(function() {
            var id = $(this).attr('id');
            if (id != '')
            {
                textareaToTinymce(id);
            }
        });
        tinymce.init({
            selector: "textarea",
            entity_encoding: "raw",
            forced_root_block: '',
            convert_urls: false,
            plugins: [
                "link image code"
            ],
        });
        
        
    });
</script>
<form class="form-horizontal" action="{{ form.action }}" method="{{ form.method }}" name="{{ form.name }}" id="{{ form.name }}" enctype="multipart/form-data">    
    {% for group in form.groups %}   
    <div class="page-header">
        <h4>{{ group.caption }}</h4>
    </div>
        {% for field in group.fields %}
            {% if field.type != "hidden" %}
    <div class="form-group">
        <label class="control-label col-lg-3" for="{{ field.name }}">{{ field.caption }}</label>
        <div class="col-lg-9">
                        {% if field.type == "select" %}
            <select class="form-control input-sm" id="{{ field.name }}" name="{{ field.name }}">
                <option value="">Vyberte hodnotu</option>
                                {% for key, value in field.options %}
                <option value="{{ key }}" {% if field.value == key %}selected="selected"{% endif %}>{{ value }}</option>
                                {% endfor %}
            </select>
                        {% elseif field.type == "text" %}
            <input class="form-control input-sm {{ field.class}}" id="{{ field.name }}" name="{{ field.name }}" type="text" placeholder="{{ field.caption }}" value="{{ field.value }}" {% if field.readOnly %}readonly="readonly"{% endif %}/>
                        {% elseif field.type == "textarea" %}
            <textarea class="form-control" id="{{ field.name}}" name="{{ field.name }}" style="width: 100%" {% if field.readOnly %}readonly="readonly"{% endif %}>{{ field.value }}</textarea>
                        {% elseif field.type == "password" %}
            <input class="form-control input-sm" id="{{ field.name }}" name="{{ field.name }}" type="password"/>
                        {% elseif field.type == "file" %}
            <input class="form-control input-sm" id="{{ field.name }}" name="{{ field.name }}" type="file"/>
                        {% elseif field.type == "date" %}
            <input class="form-control input-sm" id="{{ field.name }}" name="{{ field.name }}" type="text" value="{{ field.value }}"/>
                            {% set datepickers = datepickers|merge([field.name]) %}
                        {% elseif field.type == "datetime" %}
            <div class='input-group date {{ form.name }}_datetimepicker' data-date-format="YYYY-MM-DD hh:mm">
                <input class="form-control input-sm" id="{{ field.name }}" name="{{ field.name }}" type="text" value="{{ field.value }}"/>
                <span class="input-group-addon input-sm"><span class="glyphicon glyphicon-calendar"></span></span>
            </div>
                        {% elseif field.type == "checkbox" %}
            <input class="form-control input-sm" id="{{ field.name }}" onclick="if ($(this).is(':checked')) {
                        $('#{{ field.name }}_hidden').val(1);
                    } else {
                        $('#{{ field.name }}_hidden').val(0);
                    }" name="checkbox_{{ field.name }}" type="checkbox" {% if field.value == true %}checked="checked"{% endif %}/>
            <input class="form-control input-sm" type="hidden" id="{{ field.name }}_hidden" name="{{ field.name }}" value="{% if field.value%}1{% else %}0{% endif %}"/>
                        {% endif %}
        </div>
    </div>
                {# <div class="form-error" style="text-align:left;color:red;">{{ errors.get(field.name) }}</div> #}
            {% else %}
    <input name="{{ field.name }}" type="hidden" value="{{ field.value }}"/> 
            {% endif %}
        {% endfor %}
    {% endfor %}

    {% if form.submittedButton %}
    <div class="form-group">
        <div class="col-sm-offset-3 col-lg-9">
                {% if form.ajax == false %}
            <input class="btn btn-sm btn-default" type="submit" value="Odeslat"/>
                {% else %}
            <input class="btn btn-sm btn-default" type="button" id="btnSendFormAjax" value="Odeslat" onclick="sendForm();
                    return false;"/>
                {% endif %}
        </div>
    </div>
    {% endif %}
</form>

<script>
    
{% for datepicker in datepickers %}
    $("#{{ datepicker }}").datepicker({
        dateFormat: "dd.mm.yy",
        changeMonth: true,
        changeYear: true
    });
{% endfor %}


    $('form[name="{{ form.name }}"] legend').bind('click', function() {
        $(this).parent().find("table").toggle();
    });

{% for key, criticalField in form.criticalFields %}
    $("#{{ key }}").bind("change", updateForm);
{% endfor %}

    function updateForm() {
        console.log("updateForm");
        var postData = "name={{ form.name }}&" + $('form[name="{{ form.name }}"]').serialize();
        $.post("{{ updateFormUrl|raw }}", postData, function(data) {
            $('form[name="{{ form.name }}"]').replaceWith(data);
        });
    }
    
    $(function(){
        /* inicializace datetimepickeru */
        $(".{{ form.name }}_datetimepicker").datetimepicker({
            language: 'cs'
        });
    });
</script>