formio-sfds
Version:
The Form.io theme for sf.gov
29 lines (26 loc) • 2.43 kB
HTML
<html lang="en">
<head>
<title>Datagrid with select | formio-sfds examples</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="/sfgov/forms.css">
</head>
<body>
<div class="formio-sfds">
<div class="container p-2">
<h1 class="h3 mb-4">
<a href="/">formio-sfds@10.0.0</a> /
Datagrid with select
</h1>
<sfgov-form
data-form="{"components":[{"type":"datagrid","input":true,"label":"Enter the relevant information for each ADU.","reorder":false,"addAnotherPosition":"bottom","defaultOpen":false,"layoutFixed":false,"enableRowGroups":false,"initEmpty":false,"tableView":false,"defaultValue":[{"proposedUnitType":""}],"key":"proposedAdUs","components":[{"label":"Select the unit type","widget":"choicesjs","tableView":true,"data":{"values":[{"label":"Studio","value":"Studio"},{"label":"1 Bedroom","value":"1Bedroom"},{"label":"2 Bedroom","value":"2Bedroom"},{"label":"3 Bedroom or more","value":"3Bedroom"}]},"validate":{"required":true},"key":"proposedUnitType","type":"select","input":true,"searchThreshold":0.3},{"label":"Square footage","mask":false,"spellcheck":true,"tableView":false,"delimiter":false,"requireDecimal":false,"inputFormat":"plain","validate":{"required":true},"key":"proposedSquareFootage","type":"number","decimalLimit":0,"input":true}]}]}"
data-options="">
</sfgov-form>
</div>
</div>
<script src="https://unpkg.com/formiojs@4.14.8/dist/formio.full.min.js"></script>
<script src="/dist/formio-sfds.standalone.js"></script>
<script src="/dist/examples.js"></script>
</body>
</html>