Uma escolha numa lista

Tradução automática

Esta página foi traduzida automaticamente do inglês e ainda não foi revisada por um falante nativo; correções são bem-vindas no GitHub. Se algo não bater, vale o original em inglês. O código e os resultados são os mesmos do original, importados dos arquivos testados.

Tarefa: um campo que aceita um valor de uma lista, e uma caixa de sim/não.

# Recipe: a field that takes one value from a list.
paths:
  components: ./components
  migrations: ./migrations

datasources:
  db:
    driver: sqlite
    database: ./data/orders.db

CREATE TABLE orders (
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    size TEXT NOT NULL,
    milk TEXT NOT NULL,
    to_go INTEGER NOT NULL
);

A lista é escrita uma vez, como enum no q:param da ação. Um ui:select ou ui:radio sem opções próprias as pega dali, e o servidor recusa um valor que não está nela. default preenche um campo que ficou de fora. Uma caixa só envia um valor quando está marcada, então type="boolean"default="false" a torna true ou false.

<q:component name="Coffee">
  <q:action name="order" method="POST">
    <!-- enum is the list: the form's select and radios take their options
         from it (UI-9), and the server refuses anything else (ACT-2). -->
    <q:param name="size" required="true" enum="small,medium,large" />
    <q:param name="milk" enum="none,whole,oat" default="none" />
    <q:param name="to_go" type="boolean" default="false" />
    <q:query name="placed" datasource="db">
      INSERT INTO orders (size, milk, to_go) VALUES (:size, :milk, :to_go)
      <q:param name="size" value="{size}" type="string" />
      <q:param name="milk" value="{milk}" type="string" />
      <q:param name="to_go" value="{to_go}" type="boolean" />
    </q:query>
    <q:redirect url="/" flash="A {size} coffee, milk: {milk}{', to go' if to_go else ''}." />
  </q:action>

  <ui:window title="Order a coffee">
    <q:if condition="flash">
      <ui:alert variant="{flashType == 'error' and 'danger' or 'success'}">{flash}</ui:alert>
    </q:if>
    <ui:form on-submit="order" submit="Order">
      <ui:formitem label="Size"><ui:select bind="size" /></ui:formitem>
      <ui:formitem label="Milk"><ui:radio bind="milk" /></ui:formitem>
      <ui:checkbox bind="to_go" label="To go" />
    </ui:form>
  </ui:window>
</q:component>

<q:test name="the options come from the enum" page="/">
  <test:visit />
  <test:expect text="small" />
  <test:expect text="large" />
  <test:expect text="oat" />
</q:test>

<q:test name="an order with the defaults" page="/">
  <test:submit action="order" size="large" />
  <test:expect redirect="/" flash="A large coffee, milk: none." />
  <test:expect table="orders" count="1" where="size = 'large' AND milk = 'none' AND to_go = 0" />
</q:test>

<q:test name="the box, when sent, is true" page="/">
  <test:submit action="order" size="small" milk="oat" to_go="on" />
  <test:expect flash="A small coffee, milk: oat, to go." />
  <test:expect table="orders" count="1" where="to_go = 1" />
</q:test>

<q:test name="a value outside the list is refused" page="/">
  <test:submit action="order" size="huge" milk="soy" />
  <test:expect error="size" message="Must be one of: small, medium, large" />
  <test:expect error="milk" message="Must be one of: none, whole, oat" />
  <test:expect table="orders" count="0" />
</q:test>

tests/order.test.q
  PASS  the options come from the enum
  PASS  an order with the defaults
  PASS  the box, when sent, is true
  PASS  a value outside the list is refused
4 passed, 0 failed

Veja ACT-2 e UI-9.