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

<!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>ASP.NET AJAX</title>
</head>
<body>
  <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
      <Scripts>
        <asp:ScriptReference Name="PreviewScript.js" Assembly="Microsoft.Web.Preview" />
      </Scripts>
    </asp:ScriptManager>
    <div id="vendorsList">
      vendor list goes here</div>
    <div style="display: none;">
      <div id="vendorsLayout">
        <table>
          <thead>
            <tr><th>Account Number</th><th>Name</th></tr>
          </thead>
          <tbody id="vendorsItemParent">
            <tr id="vendorsItem">
              <td id="vendorsAccountNumber">vendor account number goes here</td>
              <td id="vendorsName">vendor name goes here</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </form>

  <script type="text/xml-script">
    <page xmlns="http://schemas.microsoft.com/xml-script/2005">
      <components>
        <dataSource id="vendorSource" serviceURL="ListViewVendorsDataServiceCustom.asmx" autoLoad="true" />
        <listView id="vendorsList" itemTemplateParentElementId="vendorsItemParent">
          <bindings>
            <binding dataContext="vendorSource" dataPath="data" property="data" />
          </bindings>
          <layoutTemplate>
            <template layoutElement="vendorsLayout" />
          </layoutTemplate>
          <itemTemplate>
            <template layoutElement="vendorsItem">
              <label id="vendorsAccountNumber">
                <bindings>
                  <binding dataPath="AccountNumber" property="text" />
                </bindings>
              </label>
              <label id="vendorsName">
                <bindings>
                  <binding dataPath="Name" property="text" />
                </bindings>
              </label>
            </template>
          </itemTemplate>
        </listView>
      </components>
    </page>
  </script>

</body>
</html>
