ComponentOne ListView for ASP.NET Web Forms
Quick Start / Step 2 of 3: Add C1ListViewItems
In This Topic
    Step 2 of 3: Add C1ListViewItems
    In This Topic

    In this step, you will add different types of C1ListViewItems to your existing C1ListView control.

    1. Click the opening <cc1:C1ListView> tag to reveal the control's smart tag .
    2. Click the smart tag to open the C1ListView Tasks Menu and check Mobile Mode.
    3. Insert your cursor between the <cc1:C1ListView> </cc1:C1ListView> tags.
    4. Add the following markup between the tags:
      <Items> </Items>
    5. Between the <Items> tags, add the following markup:
      <cc1:C1ListViewItem Text="Item 1" DataIcon="alert"></cc1:C1ListViewItem>

      This will add a general C1ListViewItem to your application.

    6. Next, we'll add a C1ListViewNestedItem to the application. This will create a submenu within your application:
      <cc1:C1ListViewNestedItem Text="More Options" DataIcon="arrow-l">
                <Items>
                 <cc1:C1ListViewButtonItem Text="Right here!"></cc1:C1ListViewButtonItem>
                 <cc1:C1ListViewDividerItem></cc1:C1ListViewDividerItem>
                 <cc1:C1ListViewItem Text="This is another item"></cc1:C1ListViewItem>
                </Items>
       </cc1:C1ListViewNestedItem>
      
      
    7. To add a C1ListViewButtonItem to your application, add the following markup:
      <cc1:C1ListViewButtonItem Text="Click Me!"></cc1:C1ListViewButtonItem>
    8. The C1ListViewDividerItem adds a divider to your list. In the markup below, the Text property is set to 'Divider', so you can easily see it in the C1ListView control:
      <cc1:C1ListViewDividerItem Text="Divider"></cc1:C1ListViewDividerItem>
    9. The last two C1ListViewItems to add are a C1ListViewLinkItem and a C1ListViewInputItem. The C1ListViewLinkItem allows you to embed a link to an outside web site in your C1ListView control. The C1ListViewInputItem is set to textarea, giving you an editable textbox that automatically resizes to fit your data:
      <cc1:C1ListViewLinkItem Text="Follow the link" NavigateUrl="http://www.componentone.com/"></cc1:C1ListViewLinkItem>
      
      <cc1:C1ListViewInputItem Type="textarea" LabelText="Type your text here:"></cc1:C1ListViewInputItem>
      
      

     What you've accomplished:

    In this step, you have added several different types of C1ListViewItem to your C1ListView control. In the next step, you will run your application and observe the run-time behavior of the C1ListView control.

    See Also