Documentation

Select inputs require you to pass a list of possible values to select.

formFor project [hsx|
    {selectField #userId users}
|]

In the example above the variable users contains all the possible option values for the select.

You also need to define a instance CanSelect User:

instance CanSelect User where
    -- Here we specify that the <option> value should contain a `Id User`
    type SelectValue User = Id User
    -- Here we specify how to transform the model into <option>-value
    selectValue user = user.id
    -- And here we specify the <option>-text
    selectLabel user = user.name

Given the above example, the rendered form will look like this:

<!-- Assuming: users = [User { id = 1, name = "Marc" }, User { id = 2, name = "Andreas" }] -->
<form ...>
    <select name="user_id">
        <option value="1">Marc</option>
        <option value="2">Andreas</option>
    </select>
</form>

If you want a certain value to be preselected, set the value in the controller. For example, to have the first user be preselected in the above example:

action NewProjectAction = do
    users <- query @User |> fetch
    let userId = headMay users |> maybe def (.id)
    let target = newRecord @Project |> set #userId userId
    render NewView { .. }

Radio require you to pass a list of possible values to select. We use the same mechanism as for for selectField.

formFor project [hsx|
    {radioField #userId users}
|]

In the example above the variable users contains all the possible option values for the radios.

You also need to define a instance CanSelect User:

instance CanSelect User where
    -- Here we specify that the <option> value should contain a `Id User`
    type SelectValue User = Id User
    -- Here we specify how to transform the model into <option>-value
    selectValue user = user.id
    -- And here we specify the <option>-text
    selectLabel user = user.name

Given the above example, the rendered form will look like this (omitting classes for brevity):

<!-- Assuming: users = [User { id = 1, name = "Marc" }, User { id = 2, name = "Andreas" }] -->
<form ...>
    <fieldset>
        <div>
          <input type="radio" id="option1" value="1"/>
          <label for="option1">Marc</label>
        </div>
        <div>
          <input type="radio" id="option2" value="2"/>
          <label for="option2">Andreas</label>
        </div>
    </fieldset>
</form>

If you want a certain value to be preselected, set the value in the controller. For example, to have the first user be preselected in the above example:

action NewProjectAction = do
    users <- query @User |> fetch
    let userId = headMay users |> maybe def (.id)
    let target = newRecord @Project |> set #userId userId
    render NewView { .. }