<form action="#" class="form my-5">
<div class="row">
<div class="col-12 col-md">
<div class="form-group">
<label class=" w-100">
Datum från
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text bg-transparent text-bronze"><i class="fal fa-calendar-alt fa-lg"></i>
</span>
</div>
<input type="date" class="form-control" name="date" value="2018-09-10" placeholder="YYYY-MM-DD" pattern="'\d{4}-\d{2}-\d{2}" >
</div>
</label>
</div>
</div>
<div class="col-12 col-md">
<div class="form-group">
<label class=" w-100">
Datum till
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text bg-transparent text-bronze"><i class="fal fa-calendar-alt fa-lg"></i>
</span>
</div>
<input type="date" class="form-control" name="date" value="2018-12-10" placeholder="YYYY-MM-DD" pattern="'\d{4}-\d{2}-\d{2}" >
</div>
</label>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-md">
<div class="form-group">
<label class=" w-100">
<select class="form-control custom-select" name="" placeholder="Intresseområde">
<option>Intresseområde</option>
<option>Lorem ipsum</option>
<option>Aliquam</option>
<option>Vestibulum</option>
<option>Nunc dignissim</option>
<option>Cras ornare</option>
<option>Vivamus</option>
<option>Praesent</option>
<option>Fusce nibh</option>
<option>Integer vitae</option>
<option>Vestibulum</option>
<option>Ut aliquam</option>
<option>Cras iaculis</option>
<option>Donec quis</option>
</select>
</label>
</div>
</div>
<div class="col-12 col-md">
<div class="form-group">
<label class=" w-100">
<select class="form-control custom-select" name="" placeholder="Händelsetyp">
<option>Händelsetyp</option>
<option>Lorem ipsum</option>
<option>Aliquam</option>
<option>Vestibulum</option>
<option>Nunc dignissim</option>
<option>Cras ornare</option>
<option>Vivamus</option>
<option>Praesent</option>
<option>Fusce nibh</option>
<option>Integer vitae</option>
<option>Vestibulum</option>
<option>Ut aliquam</option>
<option>Cras iaculis</option>
<option>Donec quis</option>
</select>
</label>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-md">
<div class="form-group">
<label class=" w-100">
<div class="input-group rounded-0">
<input type="text" class="form-control" name="text" value="" placeholder="Skriv för att filtrera">
<div class="input-group-append">
<button class="btn btn-outline-primary rounded-0" type="submit">Sök</button>
</div>
</div>
</label>
</div>
</div>
</div>
</form>
<form action="#" class="form my-5">
{{#each rows}}
<div class="row">
{{#each this}}
<div class="col-12 col-md">
{{render (concat "@" component) context merge=merge}}
</div>
{{/each}}
</div>
{{/each}}
</form>
{
"rows": [
[
{
"component": "form-date",
"context": {
"label": "Datum från",
"value": "2018-09-10"
},
"merge": true
},
{
"component": "form-date",
"context": {
"label": "Datum till",
"value": "2018-12-10"
},
"merge": true
}
],
[
{
"component": "form-select",
"context": {
"label_": "Intresseområde",
"label-modifiers": [
"w-100"
],
"placeholder": "Intresseområde",
"options": [
{
"label": "Intresseområde"
},
{
"label": "Lorem ipsum"
},
{
"label": "Aliquam"
},
{
"label": "Vestibulum"
},
{
"label": "Nunc dignissim"
},
{
"label": "Cras ornare"
},
{
"label": "Vivamus"
},
{
"label": "Praesent"
},
{
"label": "Fusce nibh"
},
{
"label": "Integer vitae"
},
{
"label": "Vestibulum"
},
{
"label": "Ut aliquam"
},
{
"label": "Cras iaculis"
},
{
"label": "Donec quis"
}
]
}
},
{
"component": "form-select",
"context": {
"label_": "Händelsetyp",
"label-modifiers": [
"w-100"
],
"placeholder": "Händelsetyp",
"options": [
{
"label": "Händelsetyp"
},
{
"label": "Lorem ipsum"
},
{
"label": "Aliquam"
},
{
"label": "Vestibulum"
},
{
"label": "Nunc dignissim"
},
{
"label": "Cras ornare"
},
{
"label": "Vivamus"
},
{
"label": "Praesent"
},
{
"label": "Fusce nibh"
},
{
"label": "Integer vitae"
},
{
"label": "Vestibulum"
},
{
"label": "Ut aliquam"
},
{
"label": "Cras iaculis"
},
{
"label": "Donec quis"
}
]
}
}
],
[
{
"component": "form-search--filter-search"
}
]
]
}
There are no notes for this item.