XForms, Disable Buttons

Motivation

You want to remove a delete button to prevent removal of the last item of a list.

Method

Create a binding rule in the model that only allows the button to be displayed if there are two or more elements.

This is very common when you have a "Delete" button that must not be visible if there is only one item in a list left.

One approach is to use the "ref" attribute of each trigger to only display if there are more than one item:

ref="self::node()[count(../name) > 1]">
Delete Classifier
ev:event="DOMActivate" nodeset="instance('save-data')/name" at="index('name-repeat')"/>

This would count the number of classifiers and display the "delete" button.

John
Fred
Sue

Here is an example of this rule:

id="triggerDisplay" nodeset="display-delete" relevant="count(/data/person) > 1"/>

The above uses the XPath count() function with the greater than operator. But since it must be escaped you must use the ">" instead of ">".

Or alternatively the delete button is only visible if the second person record exists in the instance.

id="triggerDisplay" nodeset="display-delete" relevant="/data/person[2]"/>

This gets around having to count all the elements and doing a comparison. So it is a little bit more efficient for longs lists of items.

This creates a rule call "triggerDisplay" that pin relevancy to an XForms instance.

Screen Image

Form without Delete button (Image: The original uploader was Dmccreary at English Wikibooks ., CC BY-SA 3.0)

Form with Delete button visible (Image: The original uploader was Dmccreary at English Wikibooks ., CC BY-SA 3.0)

Link to XForms Application

Load XForms Application

xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:ev="http://www.w3.org/2001/xml-events">;

Disable Delete

id="myInstance" xmlns="">

John Doe

id="triggerDisplay" nodeset="display-delete"
relevant="count(/data/person) > 1"/>
id="mySubmission" method="post"
action="http://www.xformstest.org/cgi-bin/echo.sh"/>;

Demo of Button Disable
nodeset="person">
ref="name">
Name:

Insert
nodeset="instance('myInstance')/person"
at="last()" position="after" ev:event="DOMActivate"/>

bind="triggerDisplay">
Delete
nodeset="instance('myInstance')/person"
at="last()" ev:event="DOMActivate"/>

submission="mySubmission">
Submit instance

Using the Context attribute

You can also use the context attribute of the trigger to tell it when to fire.

xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:ev="http://www.w3.org/2001/xml-events">;

Disable final delete trigger.
id="person">
id="person_xml" xmlns="">

name="Personal">

nodeset="contacts/section" id="repeat_section">

Delete this section.

context="instance('person_xml')/contacts"
nodeset="section[position()!=last()]"
at="index('repeat_section')"
ev:event="DOMActivate"/>

ref="./@name">
section name

nodeset="contact" id="repeat_contact">
ref=".">
contact

Delete this contact.

context="instance('person_xml')/contacts/section[index('repeat_section')]"
nodeset="contact[position()!=last()]"
at="index('repeat_contact')"
ev:event="DOMActivate"/>

+
Add a new contact after this one.
nodeset="." at="index('repeat_section')" position="after" ev:event="DOMActivate"/>

Add a new section after this one.
add section
nodeset="." at="last()" position="after" ev:event="DOMActivate"/>

Context

XForms 1.1 Specification

Optional XPath expression used to change the in-scope evaluation context for the delete element. This attribute is ignored if the bind attribute is provided. If the attribute is not given, then the default delete context is the in-scope evaluation context. Otherwise, the XPath expression is evaluated using the in-scope evaluation context, and the first node rule is applied to obtain the delete context. The delete action is terminated with no effect if the delete context is the empty node-set or if the context attribute is not given and the Node Set Binding node-set is empty.

Example of Min and Max

The following disables both the Delete and Add triggers when the number of items approaches the minimum and maximum range.

In this case the XML Schemas for the Person element was the follows:

name="Phone" minOccurs="2" maxOccurs="5">

xmlns="http://www.w3.org/1999/xhtml" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:xf="http://www.w3.org/2002/xforms">;

Phone Number Demo

rel="stylesheet" type="text/css" href="person-phone.css"/>

xmlns="" src="../test-input-instances/22-two-to-five-repeats.xml" id="phones"/>

xmlns="" id="views">

id="phone-delete-trigger"
nodeset="instance('views')/phone-delete-trigger"
relevant="instance('phones')/Phone[3]"/>
id="phone-add-trigger"
nodeset="instance('views')/phone-add-trigger"
relevant="count(instance('phones')/Phone) < 5"/>

id="save" method="post" action="save.xq" replace="all"/>

class="group-label">Phone Numbers
id="phone-number-repeat" nodeset="/PersonPhones/Phone">
ref="PhoneDescriptionText" class="PhoneDescriptionText" id="PhoneDescriptionText"/>
ref="PhoneNumber" class="PhoneNumber"/>

bind="phone-delete-trigger">
Delete

nodeset="instance('phones')/Phone[index('phone-number-repeat')]" ev:event="DOMActivate"/>

bind="phone-add-trigger">
Add
ev:event="DOMActivate">
nodeset="instance('phones')/Phone" at="last()" position="after"/>

ref="/PersonPhones/Phone[index('phone-number-repeat')]/PhoneDescriptionText" value=""/>
ref="/PersonPhones/Phone[index('phone-number-repeat')]/PhoneNumber" value=""/>

control="PhoneDescriptionText"/>

Where this page came from

This page was imported from Wikibooks. From “XForms” on Wikibooks, by its contributors, under CC BY-SA 4.0. Changed here: set as a page; navigation and edit links left out; each image under its own licence, credited in its caption.

Nobody has written it yet — it is the source material at a new address, which is why search engines are asked to skip it and why no one earns from it. It is up for grabs: take it on, and it is yours to rewrite and to earn from.