Asp.net中的数据绑定 CQ

关键字:

  • Eval
  • Bind
  • 强类型数据绑定
  • 类似的其它选择

在开发实践中，数据绑定能够最大限度的提高代码产出和代码质量。因此有必要整理一下数据绑定的方法及其相关注意事项。数据绑定分为单向和双向，大家可能已经猜到，单项的数据绑定一般用于数据展示；而双向的数据绑定除了展示数据，还要将界面数据的变动自动写回到绑定的数据源中。

Eval

单向数据绑定，将数据源中的数据展现到界面上。当我们提及数据展现时，必然会考虑到数据的格式问题，例如日期格式。当然，这也是Eval关心的内容。

一般数据绑定

<%#Eval(“属性名称")%>

带数据格式的数据绑定

<%#Eval(“属性名称","{0:格式字符串}")%>

带格式字符串的数据绑定

<%#Eval(“属性名称","Home.aspx?id={0}")%>

例子代码

home.aspx

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" %>

<html>
<head>
    <title>Home Page</title>
    <script runat="server">
        protected void Page_Load(object
sender, EventArgs e)
        {
            formView.DataSource = new[]
            {
                new {
                    ID=3,
                    Name = "Baran",
                    BirthDay= DateTime.Parse("2012-6-18"),
                }
            };
            formView.DataBind();
        }
    </script>
    <style type="text/css">
        .left
        {
            float: left;
        }
        .clear
        {
            clear: both;
        }
    </style>
</head>
<body>
    <form runat="server" id="form1">
    <asp:FormView ID="formView" runat="server">
        <ItemTemplate>
            <div class="left">
                Name:</div>
            <div class="left">
                <asp:Label ID="_name" runat="server" Text='<%#Eval("Name") %>' /></div>
            <div class="clear" />
            <div class="left">
                BirthDay:</div>
            <div class="left">
                <asp:Label ID="_birthday" runat="server" Text='<%#Eval("BirthDay","{0:dd/MM/yyyy}") %>' /></div>
            <div class="clear" />
            <div class="left">
                Relative Link:
            </div>
            <div class="left">
                <asp:HyperLink ID="_relativeLink" runat="server" NavigateUrl='<%#Eval("ID","Membership.aspx?ID={0}") %>'
                    Text="Go" />
            </div>
        </ItemTemplate>
    </asp:FormView>
    </form>
</body>
</html>

显示效果

image

Bind

一般数据绑定

<%#Bind(“属性名称")%>

带格式的数据绑定

<%#Bind(“属性名称", "{0:数据格式}") %>

例子代码

home.aspx

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" %>

<html>
<head>
    <title>Home Page</title>
    <script runat="server">
        protected void Page_Load(object
sender, EventArgs e)
        {

        }
    </script>
    <style type="text/css">
        .left
        {
            float: left;
        }
        .clear
        {
            clear: both;
        }
    </style>
</head>
<body>
    <form runat="server" id="form1">
    <asp:FormView ID="formView" runat="server" DataSourceID="memberInfoDataSource" DefaultMode="Edit"
        Visible="true">
        <EditItemTemplate>
            <div class="left">
                Name:</div>
            <div class="left">
                <asp:TextBox ID="_name" runat="server" Text='<%#Bind("Name") %>' /></div>
            <div class="clear" />
            <div class="left">
                BirthDay:</div>
            <div class="left">
                <asp:TextBox ID="_birthday" runat="server" Text='<%#Bind("BirthDay","{0:dd/MM/yyyy}") %>' /></div>
            <div class="clear" />
            <asp:LinkButton ID="_update" runat="server" Text="Update" CommandName="Update" />
        </EditItemTemplate>
    </asp:FormView>
    <asp:ObjectDataSource ID="memberInfoDataSource" TypeName="MemberEntities.MemberInfo"
        SelectMethod="GetMembers" runat="server" />
    </form>
</body>
</html>

MemberInfo.cs

using System;
using System.Collections.Generic;

namespace MemberEntities
{
    public class MemberInfo
    {
        public string Name { get; set; }
        public int ID { get; set; }
        public DateTime
BirthDay { get; set; }

        public static IEnumerable<MemberInfo> GetMembers()
        {
            return new MemberInfo[] { 
                new MemberInfo{
                    ID=3,
                    Name = "Baran",
                    BirthDay= DateTime.Parse("2012-6-18"),}
            };
        }
    }
}

显示效果

image

强类型数据绑定

众所周知，Eval数据绑定应用的反射原理来返回数据，如果你对性能非常苛刻，但又不想丢掉绑定带来的便利，那么我们还可以使用强类型转换。

绑定的核心代码为<%#((MemberEntities.MemberInfo)Container.DataItem).ID %>，将Container.DataItem先转换成指定的类型，然后直接访问其中的属性。

例子代码

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" %>

<html>
<head>
    <title>Home Page</title>
</head>
<body>
    <form runat="server" id="form1">
    <asp:DetailsView ID="detailsView" runat="server" DataSourceID="memberInfoDataSource"
        AutoGenerateRows="false">
        <Fields>
            <asp:TemplateField HeaderText="ID">
                <ItemTemplate>
                    <asp:Literal ID="Literal1" Text='<%#((MemberEntities.MemberInfo)Container.DataItem).ID %>'
                        runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Name">
                <ItemTemplate>
                    <asp:Literal ID="Literal2" Text='<%#((MemberEntities.MemberInfo)Container.DataItem).Name %>'
                        runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="BirthDay">
                <ItemTemplate>
                    <asp:Literal ID="Literal1" Text='<%#((MemberEntities.MemberInfo)Container.DataItem).BirthDay.ToShortDateString() %>'
                        runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
        </Fields>
    </asp:DetailsView>
    <asp:ObjectDataSource ID="memberInfoDataSource" TypeName="MemberEntities.MemberInfo"
        SelectMethod="GetMembers" runat="server" />
    </form>
</body>
</html>

类似的其它选择

绑定的目的是为了将后台数据显示在前台，但将后台数据显示在前台，除了绑定还有其它的方式可供选择。

  1. 直接使用asp.net控件，类似Literal,Label
  2. 使用asp.net <%Response.Write(页面属性)%>标记
  3. 使用JSON数据

例子代码

<%@ Page Language="C#" AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.did">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script runat="server" type="text/C#">
    
        protected DateTime Now
        {
            get
            {
                return DateTime.Now;
            }
        }

        [System.Web.Services.WebMethod]
        public static object GetEntity()
        {
            return new
            {
                Id = 1,
                Name = "JsonEntityName",
            };
        }
        
    </script>
    <script type="text/javascript">
    function showMsg(id) {
        alert(document.getElementById(id).innerHTML);
    }

    $(document).ready(function () {
        $("#assignValueButton").click(function () {
            $.ajax(
{
    type: "POST",
    dataType: "json",
    contentType: "application/json",
    url: "WebForm1.aspx/GetEntity",
    success: function (data) { 
    $("#entityId").text(data.d.Id);
    $("#entityName").text(data.d.Name);
    },
    error: function () { 
alert("error in get entity");
    },
});
        });
    });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="_demoText" runat="server" Text="Demo Text" />
    </div>
    </form>
    <span>Id:</span><span id="entityId"></span><br />
    <span>name:</span><span id="entityName"></span><br />
    <span>now:
        <% Response.Write(Now);%></span>
    <input type="button" value="show msg" onclick="javascript:showMsg('<%=_demoText.ClientID %>')"
        id="showMsgButton" />
    <input type="button" value="assign value" id="assignValueButton" />
</body>
</html>

参考链接：

Eval:http://msdn.microsoft.com/en-us/library/4hx47hfe

Bind:http://msdn.microsoft.com/en-us/library/ms178366.aspx

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/czy/p/2554175.html