Bind to ranges

XForms · Wikibooks

0%

Contents

    Text

    Size
    100%
    Theme
    Typeface
    Line length
    Spacing

    From Wikibooks, under CC BY-SA 4.0, as the source states it. This page at Wikibooks.

    Motivation

    Your output can be created from calculations from many inputs. The rules behind these calculations (sometimes called business rules) should be stored in the model, not the view.

    Screen Image

    This program has two inputs and one output. The output is calculated by multiplying the two inputs together. As you move the range controls the output should be updated.

    Illustration

    Sample Program

    <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" 
  xmlns:xs="http://www.w3.org/2001/XMLSchema">
   <head>
      <title>Example of binding to inputs and output ids</title>
      <xf:model id="model">
         <xf:instance id="input">
            <Data xmlns="">
               <InputValueOne>3</InputValueOne>
               <InputValueTwo>3</InputValueTwo>
            </Data>
         </xf:instance>
         <!-- make the inputs data types be integers -->
         <xf:bind id="input-one-bind" nodeset="/Data/InputValueOne" type="xs:integer"/>
         <xf:bind id="input-two-bind" nodeset="/Data/InputValueTwo" type="xs:integer"/>
         <!-- second instance bound to outputs -->
         <xf:instance id="output">
            <DataOut xmlns="">
               <OutputValue>9</OutputValue>
            </DataOut>
         </xf:instance>
         <!-- Make the output be an integer that is the product of the inputs -->
         <xf:bind id="output-bind" nodeset="instance('output')/OutputValue" calculate="instance('input')/InputValueOne * instance('input')/InputValueTwo" type="xs:integer"/>
      </xf:model>
   </head>
   <body>
      <p>
         <xf:range bind="input-one-bind" start="1" end="5" step="1" incremental="true">
            <xf:label>Input: </xf:label>
         </xf:range>
         <br/>
         <xf:range bind="input-two-bind" start="1" end="5" step="1" incremental="true">
            <xf:label>Input: </xf:label>
         </xf:range>
     <br/>
        <xf:output bind="input-one-bind"/> * <xf:output bind="input-two-bind"/> =
         <xf:output bind="output-bind"/>
      </p>
   </body>
</html>

    Discussion

    Note that the output is just inputs and outputs. The calculation that multiplies the two inputs together is done in the output bind statement. 

    <xf:bind id="output-bind" 
   nodeset="instance('output')/OutputValue"
   calculate="instance('input')/InputValueOne *
              instance('input')/InputValueTwo"
   type="xs:integer"/>

    References

    Next Page: Repeat | Previous Page: Binds to many instances
    Home: XForms