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 選擇器為空，則插入觸發器沒有任何意義（參見 '插入處理規則' 中的第一條規則）。