RELEASE_2_1_13/src/blocks/forms/samples/forms/carselector_form.xml

<?xml version="1.0"?>
<!--
  Licensed to the Apache Software Foundation (ASF) under one or more
  contributor license agreements.  See the NOTICE file distributed with
  this work for additional information regarding copyright ownership.
  The ASF licenses this file to You under the Apache License, Version 2.0
  (the "License"); you may not use this file except in compliance with
  the License.  You may obtain a copy of the License at

      http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->
<!-- form used to illustrate programmatic changing of listbox content. -->
<fd:form
  xmlns:fd="http://apache.org/cocoon/forms/1.0#definition"
  xmlns:i18n="http://apache.org/cocoon/i18n/2.1"
  id="carselector">

  <fd:widgets>
    <fd:field id="make" required="true">
      <fd:label>Make:</fd:label>
      <fd:datatype base="string"/>
      <fd:selection-list src="cocoon:/cars"/>
      <fd:on-value-changed>
        <fd:javascript>
          // The following variables are available in event listeners:
          // - "widget" and "this" are set to the current widget
          // - "event" is the event that was raised
          java.lang.System.err.println("maker changed from " + event.oldValue + " to " + event.newValue);
          var value = this.value;
          var typewidget = widget.lookupWidget("../type");
          if (value != null) {
            // Get the corresponding type list
            typewidget.setSelectionList("cocoon:/cars/" + value);
            typewidget.state = Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE;
          } else {
            // Set an empty selection list
            typewidget.setSelectionList(new Packages.org.apache.cocoon.forms.datatype.EmptySelectionList("Select a maker first"));
            typewidget.state = Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED;
          }
          // Always set the type value to null. Note that it will also fire an event on the "type"
          // widget if it already had a value.
          typewidget.value = null;
          
          // Fun with messages...
          var msg = this.lookupWidget("../message");
          if (value == null) {
            msg.value = "Yep. Choosing a maker is not that easy...";
          } else {
            if (event.oldValue == null) {
              msg.value = "Good. " + value + " makes good cars!";
            } else {
              msg.value = "Why not? " + value + " also makes good cars!";
            }
          }
        </fd:javascript>
      </fd:on-value-changed>
    </fd:field>
  
    <fd:field id="type" required="true" state="disabled">
      <fd:label>Type:</fd:label>
      <fd:datatype base="string"/>
      <fd:selection-list>
        <fd:item value="">
          <fd:label>Select a maker first</fd:label>
        </fd:item>
      </fd:selection-list>
      <fd:on-value-changed>
        <fd:javascript>
          java.lang.System.err.println("type changed to " + event.newValue);
          var value = event.newValue;
          var modelwidget = this.lookupWidget("../model");
          var makewidget = this.lookupWidget("../make");
          if (value != null) {
            modelwidget.setSelectionList("cocoon:/cars/" + makewidget.value + "/" + value);
            modelwidget.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
          } else {
            // Set an empty selection list
            modelwidget.setSelectionList(new Packages.org.apache.cocoon.forms.datatype.EmptySelectionList("Select a type first"));
            modelwidget.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.INVISIBLE);
          }
          
          // Always set the model value to null. Note that it will also fire an event on the "model"
          // widget if it already had a value.
          modelwidget.value = null;
          
          // Fun with messages...
          var msg = this.lookupWidget("../message");
          if (value != null) {
            if (event.oldValue == null) {
              msg.value = "A " + makewidget.value + " " + value + " is a very good choice.";
            } else {
              msg.value = "So you prefer a " + value + " ?";
            }
          } else {
              msg.value = "I see that you're undecided...";
          }
        </fd:javascript>
      </fd:on-value-changed>
    </fd:field>
    
    <fd:field id="model" required="true" state="invisible">
      <fd:label>Model:</fd:label>
      <fd:datatype base="string"/>
      <fd:selection-list>
        <fd:item value="">
          <fd:label>Select a type first</fd:label>
        </fd:item>
      </fd:selection-list>
      <fd:on-value-changed>
        <javascript>
          var value = this.value;
          if (value != null) {
            this.lookupWidget("../message").value = "Model " + value + " is a great car!";
            this.lookupWidget("../buy").state = Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE;
          } else {
            // Reset value
            this.value = null;
            this.lookupWidget("../buy").state = Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED;
          }
        </javascript>
      </fd:on-value-changed>
    </fd:field>
  
    <fd:output id="message" initial-value="Please choose a car above">
      <fd:datatype base="string"/>
      <fd:on-value-changed>
         <fd:javascript>
            java.lang.System.err.println("Message changed to '" + event.newValue + "'");
         </fd:javascript>
      </fd:on-value-changed>
    </fd:output>

    <!-- submit button, initially disabled as no model has been chosen -->
    <fd:submit id="buy" state="disabled">
      <fd:label>Buy it!</fd:label>
    </fd:submit>
  
  </fd:widgets>

</fd:form>