Una opción de una lista

Traducción automática

Esta página se tradujo automáticamente del inglés y todavía no la revisó un hablante nativo; las correcciones son bienvenidas en GitHub. Si algo no coincide, vale el original en inglés.

Tarea: un campo que toma un valor de una lista, y una casilla de sí/no.

# 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
);

La lista se escribe una sola vez, como enum en el q:param de la acción. Un ui:select o un ui:radio sin opciones propias las toma de ahí, y el servidor rechaza un valor que no está en ella. default completa un campo que falta. Una casilla envía un valor solo cuando está marcada, así que type="boolean" default="false" la convierte en true o 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

Ver ACT-2 y UI-9.