DOT

VVM

 DOCS

Version: 1.0 | 1.1 |

Content

in namespace DotVVM.Framework.Controls

Contains markup that will be placed inside the according ContentPlaceHolder in the master page.

Properties

Name Type Description Notes Default Value
ClientIDMode ClientIDMode Gets or sets the client ID generation algorithm.
attribute
inner element
static value
bindable
default
1
ContentPlaceHolderID String Gets or sets the ID of the ContentPlaceHolder control in the master page in which the content will be placed.
attribute
inner element
static value
bindable
default
DataContext Object Gets or sets a data context for the control and its children. All value and command bindings are evaluated in context of this value.
attribute
inner element
static value
bindable
default
ID String Gets or sets the unique control ID.
attribute
inner element
static value
bindable
default

Events

Name Type Description

Usage & Scenarios

Contains markup that will be placed inside the according ContentPlaceHolder in the master page.

See Master Pages tutorial for more information.

HTML Rendered by the Control

Sample 1: Basic Usage

The Content control the ContentPlaceHolderID which contains the ID of the corresponding ContentPlaceHolder control in the master page.

@masterPage master.dotmaster

<dot:Content ContentPlaceHolderID="TopMenu">
  Here is the CONTENT from this page with id TopMenu
</dot:Content>

<dot:Content ContentPlaceHolderID="Main">
  Here is the CONTENT from this page with id Main
</dot:Content>
@viewModel System.Object, mscorlib

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>

    <h1>My Awesome App</h1>

    <div>
        <dot:ContentPlaceHolder ID="TopMenu">
            <!-- Content from page.dothtml with id TopMenu will be placed here. -->
        </dot:ContentPlaceHolder>
    </div>

    <div>
        <dot:ContentPlaceHolder ID="Main">
            <!-- Content from page.dothtml with id Main will be placed here. -->
        </dot:ContentPlaceHolder>
    </div>

</body>
</html>

Sample 2: Viewmodel Inheritance

Typically, the viewmodel of the content page derives the viewmodel of the master page. Note that the viewmodel of the master page can be an interface.

Notice that the PageViewModel class derives from the BaseViewModel. Also, all properties referenced in bindings in the master page must be declared in the BaseViewModel class.

@viewModel DotvvmWeb.Views.Docs.Controls.builtin.Content.sample2.PageViewModel, DotvvmWeb
@masterPage master.dotmaster

<dot:Content ContentPlaceHolderID="Content">

    <dot:Button Click="{command: Calculate()}" 
                Text="Button" />

    <p>Current value: {{value: CurrentValue}}</p>

</dot:Content>
@viewModel DotvvmWeb.Views.Docs.Controls.builtin.Content.sample2.BaseViewModel, DotvvmWeb

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>

    <h1>MasterPage sample</h1>

    <dot:Repeater DataSource="{value: MenuItems}" WrapperTagName="menu">
        <ItemTemplate>
            <li>{{value: _this}}</li>
        </ItemTemplate>
    </dot:Repeater>

	<div>
		<dot:ContentPlaceHolder ID="Content" />
	</div>

</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using DotVVM.Framework.ViewModel;

namespace DotvvmWeb.Views.Docs.Controls.builtin.Content.sample2
{
    public class PageViewModel : BaseViewModel
    {
        public int CurrentValue { get; set; } = 0;

        public void Calculate()
        {
            CurrentValue++;
        }
    }
}
namespace DotvvmWeb.Views.Docs.Controls.builtin.Content.sample2
{
    public abstract class BaseViewModel
    {

        public string[] MenuItems { get; set; } = { "Index", "About" };

    }
}

Suggestions


Help & Contribute

The documentation is maintained on GitHub.
We'll be happy if you edit the page and create a pull request.

Send message