behavior: form

此元素处理元素的 <form> 扩展功能。该行为可以应用于需要“复合值”的任何容器。

行为的预期用例：表单：

• 经典 Web 表单用例 - 定义属性操作时，该行为将使用表单的数据（又名值）对该 URL 执行 HTTP/POST。

• 复合值容器用例 - 表单的值是表单中命名元素（定义了属性名称）的名称/值对的映射。

Elements

默认情况下，这些元素已 behavior:form 应用：

• <form>

Model

任何在表单中定义了 name 属性的 DOM 元素都被视为“可提交”，并参与表单值的形成。

表单的值始终是复合（聚合、映射）JSON 值。

示例，表单的值：

<form>
   First name: <input|text name="first" value="Foo"> 
   Last name: <input|text name="last" value="Bar">
</form>

 是

{
  first: "Foo",
  last: "Bar" 
}

Radio groups and check boxes

具有相同名称的无线电元件组被视为一个组。组的值是单选按钮的 :checked 单个值 - 值属性。

复选框元素的值是其 value 属性的内容。如果未选中复选框，则它具有未定义的值。

因此，表单的价值：

<form>
   Name: <input|text name="firstName" value="Peter">
   Male: <input|radio name="sex" value="male" checked>
   Female: <input|radio name="sex" value="female">
   Adult: <input|checkbox name="adult" value="mature" checked>
   Owns Cadillac: <input|checkbox name="ownsCadddilac" value="yes">
</form>

 是

{
  firstName:"Peter",
  sex: "male",
  adult: "mature",
  ownsCadddilac: undefined
}

Field groups

某些字段可以分组到命名容器中，形成值映射中的子对象：

<form>
   <div name="credentials">
     User name: <input|text name="un" value="Peter">
     Password: <input|password name="pwd" value="12345">
   </div>
   Save login: <input|checkbox name="persistLogin" value="true" checked>
</form>

 生成以下值：

{  
   credentials: { 
     un: "Peter", 
     pwd: "12345" },
   persistLogin: true; 
}

Attributes

这些属性用于 Web 窗体案例：

• action - URL，提交Web表单所需的URL，提交表单数据的接收者;

• target - 可选，将呈现操作 URL 响应的目标帧的名称或 ID;

• method - 浏览器用于提交表单的 HTTP 方法。可能的值为：“post”和“get”。默认值：“post”

• enctype - 对于 method="post" 定义提交的 MIME 格式，可以是：

• "application/x-www-form-urlencoded" - 如果未指定属性，则为默认值;

• "multipart/form-data" - 当表单包含 <input name="..." type="file"> 时使用 。

Events

• "reset" / FORM_RESET 事件 - 为响应表单中的 <button|reset> Click 事件而生成。如果脚本未使用此事件，则表单会将输入值清除为其默认值;

• "submit" / FORM_SUBMIT 事件 - 为响应表单中的 <button|submit> Click 事件而生成。如果脚本未使用此事件，则行为将表单值发送到操作 URL;

• "input" 或 "change" /FORM_VALUE_CHANGED事件 - 为响应表单内输入的“更改”事件之一而生成。该事件将转换为表单元素上的“change”事件。

Methods

• element.form.submit() - 如果表单上定义了表单的 action 属性，则提交表单的内容。

• element.form.reset() - 将输入元素重置为其初始值。

Value

name/value map - 脚本术语中的对象，其名称对应于表单中 DOM 元素的 name 属性。

Form change handling in script

on() subscription

var frm = document.$("form#some");
frm.on("change", function() { var formValue = this.value; ... });
document.on("change", "form#some", function(evt, form) { var formValue = form.value; ... });