Search code examples
asp.netasp.net-corekendo-uitelerikkendo-asp.net-mvc

How can I put a Kendo DateTimePicker inside a Kendo dialog? (Telerik UI/Kendo for ASP.NET MVC)


I'm trying to put two Kendo UI elements inside one another and it doesn't allow me. How can I fix the syntax error?

@(Html.Kendo().Dialog()
    .Name("MyModal")
    .Title("much wow")
    .Content(
            @(Html.Kendo().DateTimePicker()
            .Name("dateTimePicker")
            )
        )
    .Width(400)
    .Modal(false)
    .Actions(actions =>
        {
            actions.Add().Text("asd");
            actions.Add().Text("qwe");
            actions.Add().Text("zxc").Primary(true);
        }
    )
)

Syntax error

I need a popup/modal/dialogue window with a DateTimePicker and a TextBox, and two buttons; Cancel and Accept.


Solution

  • I figured it out;

    @(
    Html.Kendo().Dialog()
        .Name("MyModal")
        .Title("much wow")
        .Content(
                Html.Kendo().DateTimePicker()
                .Name("MyModalDateTimePicker") // name is the id
                .ToHtmlString() +
                Html.Kendo().TextBox()
                .Name("MyModalTextBox") // name is the id
                .Value("John Doe")
                .ToHtmlString()
        )
        .Width(400)
        .Modal(false)
        .Actions(actions =>
            {
                actions.Add().Text("Cancel");
                actions.Add().Text("OK").Primary(true);
            }
        )
    )