<asp:Content ID="Content1" ContentPlaceHolderID="PlaceHolderHeader" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="PlaceHolderForTitleAndIntro" Runat="Server">
    <table width="100%" cellpadding="2" cellspacing="0">
        <tr valign="top" class="ArticleTitle">
            <td style="padding-left:10px;" valign="middle">
                asp:DataList control
                </td>
        </tr>
        <tr>
            <td class="ArticleContents">
                DataList control displays data using user-defined layout. However there are many added advantages in comparison with Repeater control in terms of graphical layout.
            </td>
        </tr>
        <tr>
            <td colspan="2">&nbsp;</td>
        </tr>
    </table>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="PlaceHolderForContents" Runat="Server">
    <div class="ArticleContents">
        DataList control displays data using user-defined layout. However there are many added advantages in comparison with Repeater control in terms of graphical layout.
        <br />
        <p>One of the main advantage of DataList control is it supports directional rendering (Horizontal/Vertical) also.
            It has many properties and several events attached. We can say DataList ias the advanced version of Repeater control.
        </p>
        <p>
        Its properties like <span class="DemoCP">BackColor, ForeColor, BorderColor, BorderStyle, BorderWidth, Height etc. </span>
        are implemented through style properites of &lt;table&gt; tag. 
        </p>
        Following are some important properties that are very useful.
        <table width="100%" class="TutoPropPlaceHolder" border="1" cellpadding="2" cellspacing="1">
            <tr>
                <td class="DemoCP">AlternatingItemTemplate</td>
                <td>
                    Template to define the rendering of every alternate item.
                </td>
            </tr>
            <tr>
                <td class="DemoCP">FooterTemplate</td>
                <td>
                    Template to define how to render the footer.
                </td>
            </tr>
            <tr>
                <td class="DemoCP">HeaderTemplate</td>
                <td>
                    Template to define how to render the header.
                </td>
            </tr>
            <tr>
                <td class="DemoCP">Items</td>
                <td>
                    Gets the collection of DataList Items.
                </td>
            </tr>
            <tr>
                <td class="DemoCP">ItemTemplate</td>
                <td>
                    Template to define how items are rendered.
                </td>
            </tr>
            <tr>
                <td class="DemoCP">SeparatorTemplate</td>
                <td>
                    Template to define how separator between items will be rendered.
                </td>
            </tr>
        </table>
        <!-- START - Demo Section -->
        <table class="DemoPlaceHolder" border="1" cellpadding="2" cellspacing="4">
            <tr>
                <td class="DemoTitle">
                    DEMO : DataList
                </td>
                <td align="right">
                    <a class="DemoShowSource" href="../../misc/codeviewer/default.aspx?pagename=~/tutorials/controls/datalist.aspx" target="_blank">Show Source Code</a>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:DataList ID="DataList1" runat="Server" DataSourceID="SqlDataSource1" DataKeyField="AutoID" Width="100%"
                         RepeatColumns="2" RepeatDirection="horizontal" RepeatLayout="table" CellPadding="2" CellSpacing="1"
                         BorderWidth="1">
                        <ItemTemplate>
                            <table width="100%" style="background-color:#efefef;">
                                <tr>
                                    <td>
                                        Name : <%# Eval("Name") %><br />
                                        Address : <%# Eval("Address") %><br />
                                        Phone : <%# Eval("Phone") %><br />
                                        City : <%# Eval("City") %><br />                                        
                                    </td>
                                </tr>
                            </table>
                        </ItemTemplate>
                        <AlternatingItemTemplate>
                            <table width="100%">
                                <tr>
                                    <td>
                                        Name : <%# Eval("Name") %><br />
                                        Address : <%# Eval("Address") %><br />
                                        Phone : <%# Eval("Phone") %><br />
                                        City : <%# Eval("City") %><br />                                        
                                    </td>
                                </tr>
                            </table>
                        </AlternatingItemTemplate>
                        <SeparatorTemplate>
                            |||
                        </SeparatorTemplate>
                    </asp:DataList>                    
                     <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString='<%$ ConnectionStrings:ConnStr %>'
                     SelectCommand="Select * FROM SampleForTutorials ORDER BY [Name]">
                     </asp:SqlDataSource>
                     <asp:Literal ID="litNotice" runat="Server"></asp:Literal>
                </td>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <!-- START - Server Side Code -->
                    <pre>    

// DataList Control ////////////////////////////
&lt;asp:DataList ID="DataList1" runat="Server" DataSourceID="SqlDataSource1" DataKeyField="AutoID" Width="100%"
     RepeatColumns="2" RepeatDirection="horizontal" RepeatLayout="table" CellPadding="2" CellSpacing="1"
     BorderWidth="1"&gt;
    &lt;ItemTemplate&gt;
        &lt;table width="100%" style="background-color:#efefef;"&gt;
            &lt;tr&gt;
                &lt;td&gt;
                    Name : &lt;%# Eval("Name") %&gt;&lt;br /&gt;
                    Address : &lt;%# Eval("Address") %&gt;&lt;br /&gt;
                    Phone : &lt;%# Eval("Phone") %&gt;&lt;br /&gt;
                    City : &lt;%# Eval("City") %&gt;&lt;br /&gt;                                        
                &lt;/td&gt;
            &lt;/tr&gt;
        &lt;/table&gt;
    &lt;/ItemTemplate&gt;
    &lt;AlternatingItemTemplate&gt;
        &lt;table width="100%"&gt;
            &lt;tr&gt;
                &lt;td&gt;
                    Name : &lt;%# Eval("Name") %&gt;&lt;br /&gt;
                    Address : &lt;%# Eval("Address") %&gt;&lt;br /&gt;
                    Phone : &lt;%# Eval("Phone") %&gt;&lt;br /&gt;
                    City : &lt;%# Eval("City")% &gt;&lt;br /&gt;                                        
                &lt;/td&gt;
            &lt;/tr&gt;
        &lt;/table&gt;
    &lt;/AlternatingItemTemplate&gt;
    &lt;SeparatorTemplate&gt;
        |||
    &lt;/SeparatorTemplate&gt;
&lt;/asp:DataList&gt;    



// SqlDataSource Control ////////////////////////////                
 &lt;asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString='&lt;%$ ConnectionStrings:ConnStr %&gt;'
 SelectCommand="Select * FROM SampleForTutorials ORDER BY [Name]"&gt;
 &lt;/asp:SqlDataSource&gt;
                    
                    </pre> 
                    <!-- END - Server Side Code -->
                </td>
            </tr>
        </table>
        <!-- END - Demo Section -->
        </div>
    <br />
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="PlaceHolderFooter" Runat="Server">
</asp:Content>

Go Top