[CLOSED] Loading Partial View within a Portlet

[PriceRightHTML5team]

I'm having trouble loading a partial view inside of a portlet. With the code below, only the ext.net button control loads inside the portlet, all other html within the partial view is displayed outside of the porlets.

Am I missing an ext.net container of some kind to load the partial view in?

Please don't link me to the examples, I've looked there already.

Thank you,
Rob

--

Main View

@functions 
{
    private Ext.Net.Portlet.Builder InitPortlet(IWidgetWrapper widgetModel)
    {
        var portletBuilder = new Ext.Net.Portlet.Builder();
            
        switch (widgetModel.WidgetId)
        {
            case 1:
                portletBuilder.ItemsFromPartial("~/Views/Shared/Widgets/_AlertsWidget.cshtml", widgetModel as AlertsWidgetViewModelDTO);
                break;
            default:
                portletBuilder.ItemsFromPartial("~/Views/Shared/Widgets/_ErrorWidget.cshtml");
                break;
        }

        return portletBuilder;
    }

}

<div>
    @(Html.X().ResourceManager(ViewBag.ManagerConfig as MvcResourceManagerConfig).RenderStyles(ResourceLocationType.None))

    @(Html.X().Portal().ID("Dashboard_Portal").Border(false).Layout(Ext.Net.LayoutType.Fit)
            .Items(Html.X().Portal()
                        .Items(Html.X().PortalColumn().Cls("x-column-padding")
                                .Items(portlets =>
                                    {
                                        foreach (var widgetModel in Model.WidgetContents)
                                        {
                                            IWidgetWrapper thisWidget = widgetModel;
                                            portlets.Add(InitPortlet(widgetModel));
                                        }
                                    })
                       )))    
 </div>

Partial View

@model PR.DTO.AlertsWidgetViewModelDTO

<div>
    <h3>Alerts Widget</h3>
    <p>
        This is where some alerts will go
    </p>
    <br />
    @Html.X().Button().Icon(Icon.Application).Text("Ext.Net button - click").Handler("Ext.Msg.alert('Ext.NET button', 'Hello');")

</div>

[Vladimir]

ItemsFromPartial works with Ext.Net widgets only
Please use ContentFromPartial

[PriceRightHTML5team]

ItemsFromPartial works with Ext.Net widgets only
Please use ContentFromPartial

Using ContentFromPartial renders the html in my partial view but now my ext.net button control does not render.

I have both ext.net controls and html in my partial view and I want to render them both within a Portlet.

How can I achieve this?

Thanks
-Rob

Main View

<link href="~/Content/thirdPartyCss/ext_custom_graythem.css" rel="stylesheet" />
<div>
    
    @functions 
    {
        private Ext.Net.Portlet.Builder InitPortlet(IWidget widgetModel)
        {
            var portletBuilder = new Ext.Net.Portlet.Builder();

            switch (widgetModel.WidgetId)
            {
                case 100:
                    portletBuilder.ContentFromPartial("~/Views/Widgets/_WidgetAlerts.cshtml", widgetModel as WidgetModelAlerts);
                    break;
            }

            return portletBuilder;
        }

    }

    @(Html.X().ResourceManager(this.ViewBag.ManagerConfig as MvcResourceManagerConfig).RenderStyles(ResourceLocationType.None))

    @(Html.X().Portal().ID("Dashboard_Portal").Border(false).Layout(Ext.Net.LayoutType.Fit)
            .Items(Html.X().Portal()
                        .Items(Html.X().PortalColumn()
                                .Cls("x-column-padding")
                                .Items(portlets =>
                                    {
                                        foreach (var widgetModel in Model.Widgets)
                                        {
                                            IWidget thisWidget = widgetModel;
                                            portlets.Add(InitPortlet(thisWidget));
                                        }
                                    })
                        )))

    

</div>

Partial View

@using Ext.Net
@using Ext.Net.MVC

@model SandboxOneMvc.Models.WidgetModelAlerts

<div>
    <h3>Alerts Widget - WidgetId: @(Model.WidgetId)</h3>
    <p>
        This is where some alerts will go
    </p>
    <br />
    @Html.X().Button().Icon(Icon.Application).Text("Ext.Net button - click").Handler("Ext.Msg.alert('Ext.NET button', 'Hello');")
 
</div>

[Vladimir]

Are you sure that button is not rendered? Try to set enough height for portlets

[PriceRightHTML5team]

You're right, the button was hidden.

Setting the Height or the MinHeight resolved the issue, see code below.

Is there a property or method that will auto adjust the height to fit the contents of the portlet?

Thank you
-Rob

    @functions 
    {
        private Ext.Net.Portlet.Builder InitPortlet(IWidget widgetModel)
        {
            var portletBuilder = new Ext.Net.Portlet.Builder();

            switch (widgetModel.WidgetId)
            {
                case 100:
                    portletBuilder.ContentFromPartial("~/Views/Widgets/_WidgetAlerts.cshtml", widgetModel as WidgetModelAlerts);
                    portletBuilder.MinHeight(160);
                    break;
            }

            return portletBuilder;
        }

    }

[Daniil]

This helps.

portletBuilder.AutoDoLayout(true);

However, be careful with this setting, because it can slow down initial rendering.