Clean up parameter inclusion logic and update demos to use GET where appropriate, rather than hiding from my bad design choices

document example
This commit is contained in:
carson 2020-05-14 15:40:08 -07:00
parent a3c9cf6b6a
commit b80858e90a

View File

@ -4,6 +4,40 @@ layout: demo_layout.njk
## Dependent Select
In this example we show how to make the values in one `select` depend on the value selected in another `select`.
To begin we start with a default value for the `make` select: Audi. We render the `model` select for this make. We
then have the `make` select trigger a `GET` to `/models` to retrieve the models options and target the `models` select.
Here is the code:
```html
<div>
<label >Make</label>
<select name="make" kt-get="/models" kt-target="#models" kt-indicator=".kutty-indicator">
<option value="audi">Audi</option>
<option value="toyota">Toyota</option>
<option value="bmw">BMW</option>
</select>
</div>
<div>
<label>Model</label>
<select id="models" name="model">
<option value="a1">A1</option>
...
</select>
</div>
```
When a request is made to the `/models` end point, we return the models for that make:
```html
<option value='325i'>325i</option>
<option value='325ix'>325ix</option>
<option value='X5'>X5</option>
```
And they become available in the `model` select.
{% include demo_ui.html.liquid %}