Ext.NET: как отобразить частичное представление в загрузчике

Я пытаюсь загрузить частичное представление, когда строка расширяется в моей сетке. Мой слушатель выглядит так:

x.RowExpander()
    .Listeners(ls =>
    {
        ls.Expand.Handler = string.Format("Item.onListRowExpand('{0}', {1}, this);",
            Url.Action("ItemDetail", "My"), Model);
    })

Это вызывает функцию JavaScript:

onListRowExpand: function(url, listId, expander) {
    var container = App.DashboardPanel;
    var itemId = expander.componentsCache[0].cmp.record.data.Id;
    var panelId = "Details_" + listId + "_" + itemId;

    // Check if the selected panel was selected again. If it was do nothing
    var panel = container.getComponent(panelId);
    if (!panel) {

        // Remove the opened panel so we can add a new one
        if (container.items.getCount() > 1) {
            container.remove(container.items.getAt(1).id);
        }

        // Add the new panel...
        container.add({
            id: panelId,
            closeable: true,
            loader: {
                xtype: "panel",
                url: url,
                renderer: "frame",
                params: {
                    "listId": listId,
                    "itemId": itemId                   }
            }
        });

        container.update();
    }
}

Затем этот метод вызывает контроллер:

public Ext.Net.MVC.PartialViewResult ItemDetail(int listId, int itemId)
{
    var result = new Ext.Net.MVC.PartialViewResult
    {
        RenderMode = RenderMode.AddTo,
        ContainerId = "MyPanel",
        WrapByScriptTag = false,
        Model = new ItemViewModel
        {
            ListId = listId,
            ItemId = itemId
        }
    };

    return result;
}

который должен возвращать частичное представление, которое будет добавлено в контейнер Items:

@(x.Container()
    .ID("MyPanel")
    .Layout(LayoutType.HBox)
    .Loader(x.ComponentLoader()
        .Url(Url.Action("ViewList", "My"))
        .Mode(LoadMode.Script)
        .Params(new { listId = Model.ListId })))

Вид выглядит следующим образом:

@model ItemViewModel
@{
    var x = Html.X();
}

@(x.Panel()
   .LayoutConfig(new HBoxLayoutConfig {Align = HBoxAlign.StretchMax})
    .Flex(1)
    .Items(
        x.Button().Text("Temp").Flex(1)))

Моя проблема в том, что я не могу получить частичное представление для рендеринга. Он возвращается либо в виде белого поля, если я устанавливаю WrapByScriptTag в значение true — и в этом случае я получаю сообщение об ошибке «Uncaught ReferenceError: Ext is notdefined»), либо я получаю JavaScript компонента в виде текста, если я устанавливаю WrapByScriptTag в значение false. Я знаю, что где-то пропустил настройку, но я не уверен, что не так. Любая помощь будет оценена по достоинству.


javascript asp.net-mvc partial-views extjs ext.net
person Woody1193    schedule 15.10.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Решение для меня состояло в том, чтобы изменить мой контроллер для использования RenderMode.Config и изменить параметр renderer в загрузчике с "frame" на "component". Разница, насколько я понимаю, заключается в том, что опция frame сообщает Ext.JS ожидать IFrame (т.е. полностью сформированный HTML), тогда как опция component используется для описанных компонентов Ext. Это была половина проблемы. Другая половина заключалась в том, что я пытался отобразить компонент, чтобы он был добавлен в поле Items другого контейнера, но запрос исходил от вызова add, поэтому в этом не было необходимости. Скорее, рендеринг компонента в виде конфигурации имел больше смысла, потому что это было частичное представление.

Обратите внимание, что это работает в Ext.NET 4.2.0, но не в Ext.NET 4.1.0. В этом случае выбор renderer: "script" решил проблему.

person Woody1193    schedule 15.10.2018