zoukankan      html  css  js  c++  java
  • 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();
    
            }

  • 相关阅读:
    42、lucene和机器学习进行全文搜索,并排序
    41、javaMail机制
    40、dom以xml结尾的文件
    39、重新复习js之三
    38、重新复习javascript之三
    36、重新复习html和css之二
    35、重新复习html与css(1)
    34、Shiro框架入门三,角色管理
    33、插入一段大学学的计算机,正儿八经的计算机图形学
    32、shiro框架入门3.授权
  • 原文地址:https://www.cnblogs.com/chenhaibo/p/3079453.html
Copyright © 2011-2022 走看看