Ext.Net中，DataView数据绑定之使用技巧。

（近期会连续更新有关Ext.Net 控件的一些资料，与大家分享，有兴趣或者最近也在研究这方面知识的朋友可以加关注！！！）

DataView 是一种数据视图控件，与GridPanel相比，最大的优势就是在内容上，布局可以随心所欲。

DataView 数据绑定的方法和GridPanel是一样的。

用过GridPanel的朋友一定相当清楚：GridPanel在数据绑定的时候，只要在对应控件中，添加DataIndex属性，然后对应到数据源中Name的值就可以了。

那么在DataView也是采用这样的方法，只是在写法上略有不同。

特别要注意的是：DataView需要设置ItemSelector属性。

下面我们看一下代码：

页面源码：

<ext:ResourceManager ID="ResourceManager1" runat="server" />
        <ext:Window ID="Window1" runat="server" Width="200" Height="400" Title="我的日程" Icon="Date"
            Closable="false" BodyPadding="5" BodyStyle="background-color:white;" Layout="FitLayout">
            <Items>
                <ext:DataView ID="DataView1" runat="server" DisableSelection="true" ItemSelector="div.ss"
                    EmptyText="No customers to display">
                    <Store>
                        <ext:Store ID="Store1" runat="server">
                            <Model>
                                <ext:Model ID="Model1" runat="server">
                                    <Fields>
                                        <ext:ModelField Name="message" />
                                        <ext:ModelField Name="Icon" />
                                        <ext:ModelField Name="date" Type="Date" />
                                    </Fields>
                                </ext:Model>
                            </Model>
                        </ext:Store>
                    </Store>
                    <Tpl ID="Template1" runat="server">
                        <Html>
                            <tpl for=".">
                            <p> <img src="{Icon}"/>{message}</p>
                            <div class="ss" style="color:gray;" >{date:date("H:m:s")}</</div>
                            <hr />
                            </tpl>
                        </Html>
                    </Tpl>
                </ext:DataView>
            </Items>
        </ext:Window>

后台代码：

 protected void Page_Load(object sender, EventArgs e)
        {
            Store1.DataSource = new List<object> { 
                new { message = "起床", date = DateTime.UtcNow.AddHours(4),Icon="images/15.png" },
                new { message = "早餐", date = DateTime.UtcNow.AddHours(5) ,Icon="images/15.png"},
                new { message = "上班", date = DateTime.UtcNow.AddHours(6),Icon="images/15.png" },
                new { message = "接儿子放学", date = DateTime.UtcNow.AddHours(-10) ,Icon="images/15.png"},
                new { message = "和老婆看电影", date = DateTime.UtcNow.AddHours(-8),Icon="images/15.png" }
            };
            Store1.DataBind();

        }

 

 

posted @ 2013-05-15 11:25  陈海波  阅读(1369)  评论(0)  编辑  收藏  举报