XForms/只读
< XForms
表单经常需要显示用户无法编辑的字段。以下程序演示了此功能。
这在 XForms 中使用绑定和样式表来完成。
可以使用单个绑定语句将单个字段（或字段组）标记为只读。例如，假设你有一组与向 IT 部门远程员工运送物资相关的字段。账单地址无法更改，只能更改物品的收货人。
模型中的以下单行将使 BillToAddress 的所有子元素变为只读
<xf:bind nodeset="/PurchaseOrders/BillToAddress" readonly="true()" />
请注意，由于 CSS 的原因，此绑定下的所有字段都将被标记为只读。这是你可能希望在应用程序中以逻辑方式对只读数据元素进行分组的一个很好的理由。
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Demonstration of Read-Only Binding</title>
<link rel="stylesheet" type="text/css" href="table-form.css" />
<xf:model>
<xf:instance xmlns="" src="PurchaseOrder.xml" />
<!-- the following line sets all the data input fields under this node to be read-only -->
<xf:bind nodeset="/PurchaseOrder/BillToAddress" readonly="true()" />
</xf:model>
</head>
<body>
<xf:group ref="/PurchaseOrder/BillToAddress">
<xf:label class="box-label">Billing Address :</xf:label>
<xf:input ref="OrganizationName">
<xf:label>Organization Name: </xf:label>
</xf:input>
<xf:input ref="LocationStreetFullText">
<xf:label>Street: </xf:label>
</xf:input>
<xf:input ref="LocationStreetFullText2">
<xf:label />
</xf:input>
<xf:input ref="LocationCityName">
<xf:label>City:</xf:label>
</xf:input>
<xf:input ref="LocationStateName">
<xf:label>State:</xf:label>
</xf:input>
<xf:input ref="LocationPostalID">
<xf:label>Postal Code:</xf:label>
</xf:input>
</xf:group>
<xf:group ref="/PurchaseOrder/ShipToAddress">
<xf:label class="box-label">Shipping Address :</xf:label>
<xf:input ref="PersonName">
<xf:label>Person Name: </xf:label>
</xf:input>
<xf:input ref="LocationStreetFullText">
<xf:label>Street: </xf:label>
</xf:input>
<xf:input ref="LocationStreetFullText2">
<xf:label />
</xf:input>
<xf:input ref="LocationCityName">
<xf:label>City:</xf:label>
</xf:input>
<xf:input ref="LocationStateName">
<xf:label>State:</xf:label>
</xf:input>
<xf:input ref="LocationPostalID">
<xf:label>Postal Code:</xf:label>
</xf:input>
</xf:group>
</body>
</html>
<PurchaseOrder xmlns="">
<BillToAddress>
<OrganizationName>MegaCorp IT Dept.</OrganizationName>
<LocationStreetFullText>123 Main St.</LocationStreetFullText>
<LocationStreetFullText2>Mailstop 47</LocationStreetFullText2>
<LocationCityName>Anytown</LocationCityName>
<LocationStateName>Minnesota</LocationStateName>
<LocationPostalID>55123</LocationPostalID>
</BillToAddress>
<ShipToAddress>
<PersonName>John Jones</PersonName>
<LocationStreetFullText>123 Main Street SE</LocationStreetFullText>
<LocationStreetFullText2>Apartment 123</LocationStreetFullText2>
<LocationCityName>Anytown</LocationCityName>
<LocationStateName>Minnesota</LocationStateName>
<LocationPostalID>55123</LocationPostalID>
</ShipToAddress>
</PurchaseOrder>
/* a stylesheet for tabular XForms input field alignment */
@namespace xf url("http://www.w3.org/2002/xforms");
/* give the input form labels and the fieldset legend a bold sans-serif font */
label {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: small;
}
xf|group {
border: black solid 2px;
padding: 5px;
width: 300px;
}
/* the labels are right-aligned in a 150px wide column */
xf|input xf|label {
width: 150px;
margin: 3px;
text-align: right;
}
/* the input values are left aligned */
xf|value {
text-align: left;
}
/* vertical area between input boxes */
input {
margin: .2em;
}
/* each input is a row in the group table */
xf|input {
display: table-row;
}
/* each label within an input is a cell in the input row */
xf|input xf|label {
display: table-cell;
}
/* each value (pseudo-element) is also a cell in the input row */
xf|input::value {
display: table-cell;
}