LoadContentFrom doesn't

[Randy Hompesch]

I must be missing something simple.
my directory structure is
Pages/Admin/Properties.
I've tried doing
.LoadContentFrom("Create")
.LoadContentFrom("Create.cshtml")
.LoadContentFrom("~/Pages/Admin/Properties/Create.cshtml")
.LoadContentFrom("~/Pages/Admin/Properties/Create")
.LoadContentFrom("/Pages/Admin/Properties/Create.cshtml")
.LoadContentFrom("~/Admin/Properties/Create")
.LoadContentFrom("/Admin/Properties/Create")
.LoadContentFrom("~/Admin/Properties/Create..cshtml")
.LoadContentFrom("/Admin/Properties/Create.cshtml")

All I ever get is an empty dialog. What's the secret ?
Thanks … Ed

My code is below:

001.@page
002.@model BNC.Pages.Admin.PropertiesModel
003.@{
004.    ViewData["Title"] = "Properties";
005.}
006.
007.
008.
009.@using Kendo.Mvc.UI
010.
011.<h1>Properties</h1>
012.@(Html.Kendo().Window()
013..Name("AddNewDlg")
014..Width(750)
015..Height(1000)
016..Title("Add New Property")
017..Visible(false)
018..Actions(actions => actions.Refresh().Minimize().Maximize().Close())
019..Content("loading ...")
020..LoadContentFrom("Admin/Properties/Create")
021..Animation(true)
022..Events(ev => ev.Close("onCreateClose"))
023..Draggable(true)
024.)
025.<div class="row">
026.
027.    <div class="col-md-10">
028.        <form asp-route-returnUrl="@Model.ReturnUrl" asp-page-handler="Properties"
029.              method="post" onkeydown="return onKeyDown();">
030.            <div class="form-group">
031.
032.                @(Html.Kendo().Grid<PropertiesModel.PropertyModel>
033.                    ()
034.                    .Name("Properties")
035.
036.                    .ToolBar(t =>
037.                    {
038.                        t.Custom().Text("Add New").Name("addNew");
039.
040.                        t.Save().Text("Save Changes");
041.                    })
042.
043.
044.                    .DataSource(ds => ds
045.                    .Ajax()
046.                    .PageSize(20)
047.                    .Events(ev => ev.Error("errorHandler"))
048.                    .Model(m =>
049.                    {
050.                    m.Id(t => t.PropertyId);
051.
052.                    m.Field(f => f.PropertyId).Editable(false);
053.                    m.Field(f => f.PropertyName).Editable(true);
054.                    m.Field(f => f.PropertyType).DefaultValue(ViewData["defaultPropertyType"] as Models.PropertyType);
055.                    m.Field(f => f.Description).Editable(true);
056.                    m.Field(f => f.IsFreeHold).Editable(true);
057.                    m.Field(f => f.SquareFeet).Editable(true);
058.
059.                    })
060.                    .Read(a => a.Url("/Admin/Properties?handler=PropertiesRead").Data("forgeryToken"))
061.                    .Update(a => a.Url("~/Admin/Properties?handler=PropertiesUpdate").Data("forgeryToken"))
062.                    .Create(a => a.Url("/Admin/Properties/Create")
063.                    .Data("forgeryToken"))
064.                    .Destroy(a => a.Url("~/Admin/Properties?handler=PropertiesDestroy").Data("forgeryToken"))
065.                    )
066.
067.                    .Columns(columns =>
068.                    {
069.                    columns.Bound(t => t.PropertyId).Visible(false);
070.                    columns.Bound(t => t.PropertyName).Title("Property").Width(150);
071.                    columns.ForeignKey(t => t.PropertyType.PropertyTypeId, (System.Collections.IEnumerable)ViewData["propertytypes"], "PropertyTypeId", "Description");
072.                    columns.Bound(t => t.Description).Title("Description").Width(150);
073.                    columns.Bound(t => t.IsFreeHold).Title("Freehold").Width(150).ClientTemplate("<input type='checkbox' #=IsFreeHold ? checked='checked' :'' # />"); ;
074.                    columns.Bound(t => t.SquareFeet).Title("Square Feet").Width(150);
075.                    //columns.Command(command => { command.Edit(); command.Destroy(); });
076.
077.                    })
078.                    .Sortable()
079.                    ///.Editable(editable => editable.Mode(GridEditMode.PopUp)
080.                     //   .TemplateName("Property"))
081.                    .Pageable()
082.                    .Scrollable()
083.                    .Selectable()
084.                    .HtmlAttributes(new { style = "height: 650px;" })
085.                )
086.
087.
088.            </div>
089.
090.
091.        </form>
092.    </div>
093.</div>
094.@section Scripts
095.{
096.    <script type="text/javascript">
097.        function onCreateClose() {
098.
099.        }
100.        $(function () {
101.            $('.k-grid-addNew').click(function (e) {
102.                //here need to render 'OrderPhraseSet.cshtml' separate (this is not a action just template ) template.
103.                //alert("Got it.")
104.                $("#AddNewDlg").data("kendoWindow").open();
105.                var win = $("#AddNewDlg").data("kendoWindow");
106.                win.center().open();
107.
108.            })
109.        })
110.    </script>
111.    <style>
112.        .k-grid tbody tr {
113.            line-height: 16px;
114.        }
115.
116.        .k-grid tbody td {
117.            padding: 5px;
118.        }
119.
120.        .k-grid-content tr td {
121.            border-left-width: 1px;
122.        }
123.    </style>
124.
125.    <script type="text/javascript">
126.
127.        function forgeryToken(e) {
128.            console.log(e);
129.            return kendo.antiForgeryTokens();
130.        }
131.        function onKeyDown(e) {
132.
133.            if (event.keyCode == 13)
134.                return false;
135.        }
136.        function errorHandler(e) {
137.            debugger;
138.            if (e.errors) {
139.                var message = "Errors:\n";
140.                $.each(e.errors, function (key, value) {
141.                    if ('errors' in value) {
142.                        $.each(value.errors, function () {
143.                            message += this + "\n";
144.                        });
145.                    }
146.                });
147.                alert(message);
148.            }
149.        }
150.    </script>
151.}

01.    @page
02.    @addTagHelper "*, Kendo.Mvc"
03.    @model BNC.Pages.Admin.Properties.CreateModel
04.    @{
05.        Layout = "";
06.    }
07.    <div class="container-fluid body-content">
08.        <h1>Create</h1>
09.
10.        <h4>Property</h4>
11.        <hr />
12.        <div class="row">
13.            <div class="col-md-4">
14.                <form method="post">
15.                    <div asp-validation-summary="ModelOnly" class="text-danger"></div>
16.                    <div class="form-group">
17.                        <label asp-for="Property.Name" class="control-label"></label>
18.                        <input asp-for="Property.Name" class="form-control" />
19.                        <span asp-validation-for="Property.Name" class="text-danger"></span>
20.                    </div>
21.                    <div class="form-group form-check">
22.                        <label class="form-check-label">
23.                            <input class="form-check-input" asp-for="Property.IsFreeHold" /> @Html.DisplayNameFor(model => model.Property.IsFreeHold))
24.                        </label>
25.                    </div>
26.                    <div class="form-group">
27.                        <label asp-for="Property.SquareFeet" class="control-label"></label>
28.                        <input asp-for="Property.SquareFeet" class="form-control" />
29.                        <span asp-validation-for="Property.SquareFeet" class="text-danger"></span>
30.                    </div>
31.                    <div class="form-group">
32.                        <label asp-for="Property.Description" class="control-label"></label>
33.                        <input asp-for="Property.Description" class="form-control" />
34.                        <span asp-validation-for="Property.Description" class="text-danger"></span>
35.                    </div>
36.                    <div class="form-group">
37.                        <input type="submit" value="Create" class="btn btn-primary" />
38.                    </div>
39.                </form>
40.            </div>
41.        </div>
42.
43.        <div>
44.            <a asp-page="Index">Back to List</a>
45.        </div>
46.</div>
47.        @section Scripts {
48.            @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
49.        }

[Nencho]

Hello Randy,

The approach that you demonstrated to load the content from the RazorPage is correct: .LoadContentFrom("/Admin/Properties/Create")

I have also tested it at my end, and a possible reason for the inability to load the content was pinned down. The reason might be, if you are loading the Create.cshtml as a standard page, along with all of the scripts that comes from the _Layout.cshtml. This will cause a duplicated scripts usage and will reflect as the inability to get a reference to the kendoWindow. In other words, I assume that that the initialization and the open() method execution fails at your end ( in the $('.k-grid-addNew').click(function (e) {})).

In order to achieve the proper loading of the page, you would need to load it as a Partial. That said, you need to place the Layout=null on top of the page. As I can see, you are setting 

@{
    Layout = "";
}

can you try setting it to null?

Also, in the attachment you can find the runnable example that was used for testing purposes at my end. Could you give it a try at yours and check if there are any diffrences? Also, if the issue still persist, modify the sample project so that it is replicable in it and send it back to me, in order to pin down the exact reason for the issue.
 

Regards,
Nencho
Progress Telerik

[Randy Hompesch]

Hi it turns out there was indeed a duplicate script ref. I pulled that and viola! all is well.

Thanks … Ed