XForms Examples
Introduction XForms is a standard from the W3C. It was designed to replace HTML forms by an XML version. An XForms form consists of a model, that is a form definition, and the form itself. The model describes what the document that is send to the server looks like and where to submit the form too. This document starts with a simple form, including a description of model and form by parts of code and a description of how to access the submitted form data. Then there are examples of a form containing OpenMath and a form with a simple multiple choice question.
A simple form An example of an XForms model, with submission. 1 ]]> The model from this example describes a document with main tag variables with two children, a and b. The default value for a is 1. This will automatically be put in any form input fields. When in a Mathdox document no xforms:submission-tag is present, one is added automatically with submission as @id and the current page as @action. XForms form example a b submit ]]> In XForms there are several ways to generate input methods. Some of these are described briefly below. For more information see the XForms 1.0 (Second Edition): 8 Form Controls. The most basic is xforms:input which generates a free form data-entry. For text this gives an inline textfield. It is possible to enter a password with xforms:secret which does not display the entered value. A larger textfield which is intended for multiline content is xforms:textarea. If in a Mathdox document this has the class math-editor and a mathematical input editor is available it will be used instead of the basic textarea. If a mathdox:domain attribute is present and the mathematical input editor supports using different sets of symbols, then the set of symbols indicated by that attribute will be used. Here the namespace is defined as follows: xmlns:mathdox="http://www.mathdox.org/MathDox". With xforms:select it is possible to select several answers from a predefined list of possibilities. With xforms:select1 it is possible to select one answer from a predefined list of possibilities. The xforms:submit can generate a button to submit the form. The submission attribute refers to the id from the xforms:model. Accessing submitted form data If a form is posted to a Mathdox document, that Mathdox document can access the form information through the jelly:xml variable formdata. In this example it is shown how the default values can be changed into the submitted values if they exist. This means that the value in the input field for a (default value) will be 1 at the first visit, but after a submit, the values in the input field will be equal to the submitted values. 1 ]]> The variables can be accessed with x:expr as shown in the next bit of source code. Note that with the code above the default value is entered when the page is visited without a submit. The submitted values can be found in the $formdata variable in the variables container. An example can be found below: a: ]]> The examples combined Combining the examples leads to the code below. The example is also included in the manual. Simple Form 1 a b submit a: b:
]]>
Introducing OpenMath Using OpenMath in combination with forms is not so easy, because the textarea input is for strings, and therefore requires the default to be a string and causes the submitted data to be a string. In examples it is described how to set the default values, how to make the results accessable and how to access them. At the end these examples are combined to a larger example which also includes a MONET-query. Setting the defaults The defaults should be set as strings. However the author probably wants to initialise them with OpenMath code, which is XML. Therefore a conversion has to take place. This can be done by using c:set to create a string and c:out to output the encoded string. In this example the default value of is set to 1 and the default value of is set to 2 . 1 2 ]]> Inputfields for XML To enter XML input a standard string xforms:input field is usually to small and a xforms:textarea is used instead. As described in the list of form controls above the class attribute is given the value math-editor so that it can be replaced by a mathematical editor if that is available. The two input fields now become: a b ]]> Accessing XML form entries To access the variables - default or submitted - it is necessary to retrieve them from the formdata and parse them. This is done in the code below. ]]> These variables can now be accessed with x:copyOf. In the following code, two examples are given: : ]]> First is displayed as an OpenMath object. In the second example the OMOBJ is removed, to add the variable as a part of a larger OpenMath object. A larger example with OpenMath Combining these examples and adding some MONET results in the following example. If the Mathematica service is set up it is also possible to play this example from the manual. XForms Example 1 2 a b submit : : : ]]>
A simple multiple choice question Multiple choice questions do not offer a lot of interactivity, but it might be desirable to use them, because they are easy to develop or because they are already available. An example of a multiple choice question can be found below. An example of how a multiple choice question can be entered without a lot of XForms and jelly can be found in the next section. The question What do you get if you multiply 6 by 9 ? ]]> This is the question of this example. The list of possible answers. 42 54 ]]> The possible answers are displayed in an ordered list. The attribute numeration with value loweralpha indicates that the choices are labeled a, b,... Answer: a 1 b 2 ]]> This code describes an XForms control to input one element from a list of choices (by a drop down menu or by radiobuttons). The label is shown to the user and the value is the internal value that is assigned to answer upon selection. Conditional responses. This galaxy is not so twisted that 6 9 42 . Please try again. ]]> The information within an xforms:group is only shown if it is relevant, that is when the contents of the ref is matched in the XForms model. The code above is only shown if the answer has the value 1 (when the first answer is selected). The response for the second answer can be found below. Your answer, 54 is correct! ]]> Using <tag>xforms:switch</tag> to describe the question and the answer and only render one at a time By use of xforms:switch it is possible to only show one of a selection of cases. This makes it possible to show the feedback for the answer of the multiple choice question only after a pressing a button and also makes it easy to hide the answers in this case. A user can then go back by selecting a back button. Check Back ]]> Full multiple choice example Combining the examples from this section results in the following complete form. The example is also available in the manual. Multiple Choice XForms Example 1 What do you get if you multiply 6 by 9 ? 42 54 Answer: a 1 b 2 Check This galaxy is not so twisted that 6 9 42 . Please try again. Your answer, 54 is correct! Back ]]>
A multiple choice question using the <tag>mcgroup</tag> tool Suppose the information of the multiple choice exercise is already available in an XML format. Then it is possible to convert it to the format of an mcgroup and use a library. The mcgroup element has the following syntax: mcgroup, a group of multiple choice answers, consists of one or more mc elements. mc, a single answer, consists of a choice and an answer element. choice contains the choice of a single answer. answer contains the feedback that should be given if this answer is chosen. It has an attribute verdict, which value can be False (wrong answer) or True (correct answer). The value of the verdict attribute is not used at the moment. An example of an <tag>mcgroup</tag> If the question from the previous section would be encoded as an mcgroup it would look as follows: 42 This galaxy is not so twisted that 6 9 42 . Please try again. 54 Your answer, 54 is correct! ]]> If several multiple choice questions are on the same page, they should use a different answer in the xforms:model. If they do not then selecting a for one question would mean selecting a for all questions. Therefore it is required to give an id attribute to the answer tag in the model: A model that can be used with the <tag>mcgroup</tag> library. 1 ]]> The instance part is added automatically to the model of the page by the library. Including the library. ... ]]> First the variables mcgroup and instanceid have to be set and then the library can be called by adding the line <xi:include parse="xml" href="oxf:/authortools/mcgroup-lib.xml"/>. Here xi is from the XInclude namespace http://www.w3.org/2001/XInclude. A generic multiple choice example Combining the examples from this section results in the following complete form. The example is also available in the manual. Multiple Choice XForms Example What do you get if you multiply 6 by 9 ? 42 This galaxy is not so twisted that 6 9 42 . Please try again. 54 Your answer, 54 is correct! ]]>