<div class="row" id="oneFieldContainer_{{ $inputCounter }}">
    <div class="col-6">
        <div class="form-group">
            <input type="text" class="form-control text-center" placeholder="{{ trans('messages.Form Field Text') }}"
                name="inputs[{{ $inputCounter }}][label]">
        </div>
    </div>
    <div class="col">
        <div class="form-group form-group-float">
            <select class="form-control select-field-type" name="inputs[{{ $inputCounter }}][input_type]"
                id="select-field-type-{{ $inputCounter }}">
                <option value="text" selected>{{ trans('messages.Text') }}</option>
                <option value="number">{{ trans('messages.Number') }}</option>
                <option value="textarea">{{ trans('messages.Long text') }}</option>
                <option value="file">{{ trans('messages.File') }}</option>
            </select>
        </div>
    </div>
    <div class="col-2 demo-checkbox" id="demo-checkbox-{{ $inputCounter }}" style="display: none">
        <div class="demo-checkbox">
            <input type="checkbox" id="md_checkbox_{{ $inputCounter }}" name="inputs[{{ $inputCounter }}][calculated]"
                class="filled-in chk-col-danger" />
            <label for="md_checkbox_{{ $inputCounter }}">Auto Calculated</label>
        </div>
    </div>
    <div class="col-1">
        <i class="fa fa-trash" style="cursor: pointer;font-size: 1.5em"
            onclick="deleteoneFieldContainer({{ $inputCounter }})"></i>
    </div>
</div>

<script type="text/javascript">
    $('#select-field-type-{{ $inputCounter }}').change(function() {
        if ($(this).val() == 'number') {
            $("#demo-checkbox-{{ $inputCounter }}").show();
        } else {
            $("#demo-checkbox-{{ $inputCounter }}").hide();
        }
    })
</script>
