ComponentOne Wijmo Open for Juice UI
Wijmo Open for Juice UI Extender Controls / WijList / WijList Tutorial / Step 1 of 3: Creating the List
In This Topic
    Step 1 of 3: Creating the List
    In This Topic

    In this topic you will add content to a Panel control.

    1. Create an ASP.NET Web application with a ScriptManager control and install Juice UI and the Wijmo Juice libraries to your project via NuGet.
    2. Add a standard Panel control to the main content of  your page.
    3. In Source view, use the following markup to add a WijList control to the page and set the TargetControlID to Panel1.
        <cc1:WijList ID="Panel1_WijList" runat="server"
      
              TargetControlID="Panel1">
      
        </cc1:WijList>
      
    4. Select View | Properties Window in the Visual Studio menu.
    5. Click the drop-down list at the top of the Properties window and select TextBox1_C1InputDateExtender.
    6. Click the ellipsis button next to the ListItems property and add six members (Members 0-5). Set the Label and Value properties for each member as follows:

      Member

      Label

      Value

      0

      Label1

      Value1

      1

      Label2

      Value2

      2

      Label3

      Value3

      3

      Label4

      Value4

      4

      Label5

      Value5

      5

      Label6

      Value6

      The markup should look similar to the following:

        <cc1:WijList ID="Panel1_WijList" runat="server"
      
              TargetControlID="Panel1">
      
       
      
               <ListItems>
      
                  <cc1:ListItem Label="Label1" Value="Value1" />
      
                  <cc1:ListItem Label="Label2" Value="Value2" />
      
                  <cc1:ListItem Label="Label3" Value="Value3" />
      
                  <cc1:ListItem Label="Label4" Value="Value4" />
      
                  <cc1:ListItem Label="Label5" Value="Value5" />
      
                  <cc1:ListItem Label="Label6" Value="Value6" />
      
               </ListItems>
      
        </cc1:WijList>
      

      Now you can begin setting properties for the WijList to format the list.