XForms/删除
< XForms
这是一个从项目列表中删除项目的示例程序。可以通过选择要删除的行并选择“删除”按钮来删除所选项目。此触发器具有以下格式
<xf:trigger>
<xf:label>Delete</xf:label>
<xf:action ev:event="DOMActivate">
<xf:delete ref="//Person[index('person-repeat')]"/>
</xf:action>
</xf:trigger>
delete 元素有两个属性。nodeset 指示从哪个节点集中选择项目，at 指示节点编号。我们使用 index 函数来获取所选节点的编号。
该表单包含人员列表。您可以添加和删除所选行。
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:ev="http://www.w3.org/2001/xml-events">
<head>
<title>XForms Delete Example</title>
<link rel="stylesheet" type="text/css" href="delete2.css" />
<xf:model>
<xf:instance id="people">
<PhoneList xmlns="">
<Person>
<Name>Peggy</Name>
<Phone>123</Phone>
</Person>
<Person>
<Name>Dan</Name>
<Phone>456</Phone>
</Person>
<Person>
<Name>John</Name>
<Phone>789</Phone>
</Person>
<Person>
<Name>Sue</Name>
<Phone>234</Phone>
</Person>
<NewPerson>
<Name />
<Phone />
</NewPerson>
<SelectedRow />
</PhoneList>
</xf:instance>
</xf:model>
</head>
<body>
<xf:group nodeset="/PhoneList">
<fieldset>
<legend>Company Phone List</legend>
<!-- this lists all the people -->
<xf:repeat id="person-repeat" ref="Person">
<xf:input ref="Name" />
<xf:input ref="Phone" />
</xf:repeat>
</fieldset>
<xf:trigger>
<legend>Add Row</legend>
<xf:action ev:event="DOMActivate">
<xf:insert nodeset="Person" at="index('person-repeat')" position="after" />
<xf:setvalue ref="Person[index('person-repeat')]/Name"
value="/PhoneList/NewPerson/Name" />
<xf:setvalue ref="Person[index('person-repeat')]/Phone"
value="/PhoneList/NewPerson/Phone" />
</xf:action>
</xf:trigger>
<xf:trigger>
<xf:label>Delete Selected Row</xf:label>
<xf:action ev:event="DOMActivate">
<xf:delete ref="instance('people')//Person[index('person-repeat')]"/>
</xf:action>
</xf:trigger>
<br />
<xf:output value="index('person-repeat')">
<xf:label>Selected Row= </xf:label>
</xf:output>
</xf:group>
</body>
</html>
* {
font-family: Arial, Helvetica, sans-serif;
}
label, legend {
font-weight: bold;
}
contextcontainer {
display: table-row;
}
input {
display: table-cell;
color: white;
background-color: gray;
}
/* Display for the selected line */
.xf-repeat-index input {
color: black;
background-color: white;
}
请注意，您仍然可以选择一行并在其后插入新记录。但您也可以选择任何一行并将其删除。
为了简化此示例，表格列标题已遗漏（参见 Repeat into table 表格应如何行为）。
所选行的代码应为
*::repeat-index input {
color: black;
background-color: white;
}
但这不适用于 Firefox 2.0.0.14 + Mozilla XForms 0.8.5
弄清楚如何修改样式表以便突出显示所选行。XForms 文档暗示 ::value 是活动区域，::repeat-item 是重复序列中的单个项目，而 ::repeat-index 是重复序列中的当前项目
这些似乎不适用于 FireFox 0.6 下的样式表。
潜在问题：当您删除所有节点后，插入触发器将不再起作用。这是因为在这种情况下，插入元素上的 nodeset 选择为空。如果 nodeset 选择器为空，则插入触发器没有任何意义（参见 '插入处理规则' 中的第一条规则）。