combobox_example.lzx

<canvas bgcolor="#EAEAEA" width="640" height="400">
    <dataset name="items">
        <item value="item1">item one</item>
        <item value="item2">item two</item>
        <item value="item3">item three</item>
        <item value="item4">item four</item>
    </dataset>

    <dataset name="longdata">
        <date>
            <day>1</day>
            <day>2</day>
            <day>3</day>
            <day>4</day>
            <day>5</day>
            <day>6</day>
            <day>7</day>
            <day>8</day>
            <day>9</day>
            <day>10</day>
            <day>11</day>
            <day>12</day>
            <day>13</day>
            <day>14</day>
            <day>15</day>
            <day>16</day>
            <day>17</day>
            <day>18</day>
            <day>19</day>
            <day>20</day>
            <day>21</day>
            <day>22</day>
            <day>23</day>
            <day>24</day>
            <day>25</day>
            <day>26</day>
            <day>27</day>
            <day>28</day>
            <day>29</day>
            <day>30</day>
            <day>31</day>
        </date>
    </dataset>

    <constantlayout axis="x" value="60"/>
    <simplelayout axis="y" inset="60" spacing="60"/>

    <view layout="axis:y;spacing:4">
        <text multiline="true" width="350">The OpenLaszlo platform includes the combobox component, in which data is included within the
instance declaration, and datacombobox, which provides the same functionality but which gets its data from a dataset.</text>
        <text multiline="true" width="350">The text that appears in the combobox may be different from the
        value represented by the list item.  In the examples below the value is
        displayed using a constraint tied to the value attribute of the combobox </text>
        <view layout="axis:x; spacing:30">
            <view layout="spacing:4">
                <text>editable combobox</text>
                <combobox id="cbox1" width="130" defaulttext="choose one...">
                    <textlistitem datapath="items:/item/" text="$path{'text()'}" value="$path{'@value'}"/>
                </combobox>
                <text text="${'value: ' + cbox1.value}"/>

            </view>
            <view layout="spacing:4">
                <text>non-editable combobox</text>
                <combobox id="cbox2" width="130" editable="false">
                    <textlistitem datapath="items:/item/" text="$path{'text()'}" value="$path{'@value'}"/>
                </combobox>
                <text text="${'value: ' + cbox2.value}"/>

            </view>
        </view>
    </view>

    <view layout="axis:x;spacing:10">
        <text multiline="true" width="260">You can present a long list of
            items but specify fewer "shownitems" and the list will be displayed
            with a scrollbar.  The combobox to the right has shownitems="7"</text>
        <combobox y="10" width="40" editable="false" dataoption="lazy" shownitems="7">
            <textlistitem datapath="longdata:/date/day/text()"/>
        </combobox>
    </view>
</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2001-2006, 2009 Laszlo Systems, Inc.  All Rights Reserved.              *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->