Click here to Skip to main content
15,896,557 members
Articles / Web Development

WPF Two-way Databinding in ASP.NET - Enabling MVVM

Rate me:
Please Sign up or sign in to vote.
4.88/5 (35 votes)
29 Jan 2011CPOL21 min read 140K   66  
Bringing WPF like declarative data binding to ASP.NET Web Forms to enable declarative two-way data binding to any object whilst opening up MVVM UI development.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ContextExample.aspx.cs" Inherits="SimpleBinding.Advanced.ContextExample" %>
<%@ Import Namespace="Binding" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <link rel="Stylesheet" type="text/css" href="../styles.css" />  
</head>
<body>
    <form id="form1" runat="server">
    <div>
          <fieldset>
            <legend>Determining the Context</legend>
            <span>
               Below shows a number of data bindings with comments to explain what the context is and why it is such.
            </span>
            <div>
                <!--Context is the DataContext of the Page(ViewModel) as we have specified PathMode=Absolute -->
                <asp:TextBox ID="TextBox0" runat="server" Text='<%# sender.Bind("AvailableAddresses[0].HouseNameNumber") %>'></asp:TextBox>
                <!--Context is the DataContext of the Page(ViewModel) -->
                <ul>
                    <asp:Repeater ID="rptAddressList" runat="server" DataSource='<%# sender.Bind("AvailableAddresses") %>'>
                        <ItemTemplate>
                            <li>
                                <ul>
                                    <li>House Name/Number:
                                        <!--Context is the DataItem of the RepeaterItem (we have a parent binding that has supplied an IEnumerable)-->
                                        <asp:TextBox ID="houseName" runat="server" Text='<%# sender.Bind("HouseNameNumber") %>'></asp:TextBox>                                    
                                        <!--Context is the DataContext of the Page(ViewModel) as we have specified PathMode=Absolute -->
                                        <asp:TextBox ID="TextBox1" runat="server" Text='<%# sender.Bind(new Options{Path="AvailableAddresses[0].HouseNameNumber",PathMode=PathMode.Absolute}) %>'></asp:TextBox>
                                    </li>
                                </ul>
                            </li>
                        </ItemTemplate>
                    </asp:Repeater>
                </ul>
                <asp:Button ID="postback" runat="server" Text="Cause Postback" />
            </div>
        </fieldset>
    </form>
</body>
</html>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer
United Kingdom United Kingdom
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions