[CLOSED] popup window control from shared layout page

can anybody guide me on how to open window popup partial view on a menu item click from layout page?

Window Control like this:

Code:

X.Window().ID("TestPopUp").Width(500).Height(500).Modal(true).Items(....)

I was able to do it by calling

Code:

@HTML.Partial("TestPopUp")

and then

Code:

X.Menu().Items( X.MenuItem().Text("Test View").Listeners(l => l.Click.Handler = "App.TestPopUp.show()") )

from my layout page, but I have many partial pop up window controls in my app, and I don't want to Render all of them across entire website. So, I was just wondering if there is any other approach of achieving this from my layout page?

Thanks

Hello @sharmav1!

The process should be analog to this example: Dynamic Partial Rendering - Window.

If this does not help at all, please provide us a simplified test case reproducing your scenario. I would expect from such a test case at least a layout page, a view and then the partial view, with controller code to trigger the partial view. But that would really depend on the scenario you require.

Hello @fabricio.murta

Thanks for your reply. I tried your suggestion but it is not working for me. Below is a test case:

layout page:

Code:

@model System.Collections.IEnumerable <!DOCTYPE html> <script type="text/javascript"> var UserAccessPerson = @Html.Raw(Json.Encode(UserAcces.GetPerson)); </script> <html lang="en"> <head> <meta charset="utf-8" /> <title>Title</title> <script src="~/Scripts/jquery-1.10.2.js"></script> </head> <body> @*@Html.Partial("Report")*@ // ******* This way Works for me, but I don't want to do it this way @( X.Viewport().Layout(LayoutType.Border) .Items ( X.Panel().Region(Region.North).Height(50).Layout(LayoutType.HBox).LayoutConfig(new HBoxLayoutConfig { Align = HBoxAlign.Stretch }) .Items ( X.Label().ID("lblAppName").Text("Home") X.Component().Flex(1), .MenuArrow(true) .Menu ( X.Menu() .Items ( X.MenuItem().Text("Home").IconCls("home-screen").Listeners(l => l.Click.Handler = "window.location=" + JSON.Serialize(Url.Action("Index", "Home"))), X.MenuItem().Text("Report").Listeners(l => l.Click.Handler = App.winReport.show()), // *******This way Works for me, but I don't want to do it this way X.MenuItem().Text("Report").DirectEvents(de => { de.Click.Url = Url.Action("Report", "Admin"); }) ) ) ), X.Panel().Border(false).BodyBorder(0).ID("pnlContent").Flex(1).Region(Region.Center).Layout(LayoutType.Fit) .ItemsFromSection(this, "sectionCenter") .BottomBar ( X.Toolbar() .Items ( X.Component().Flex(1), X.Label().Text(Title), X.Button().Icon(Icon.Help) ) ) ) ) @RenderSection("scripts", required: false) @RenderSection("OptionalContent", required: false) @RenderBody() </body> </html>

Controller Code:

Code:

public ActionResult Report() { return new Ext.Net.MVC.PartialViewResult { ViewName = "Report" }; }

partialview: Report.cshtml

Code:

@using Ext.Net @using Ext.Net.MVC @{ var X = Html.X(); } @( X.Window().ID("winReport") .Title("Test Report").Layout(LayoutType.Border) .Height(500).Width(700).Hidden(true).Modal(true).Constrain(true) .Items ( X.Panel().Layout(LayoutType.VBox).LayoutConfig(new VBoxLayoutConfig { Align = VBoxAlign.Stretch }).Region(Region.Center).Flex(1) .Items ( X.FormPanel().ID("pnlReport").Border(false).BodyStyle("padding:0 0 0 5px;") .Items ( X.FieldSet().Flex(1).Layout(LayoutType.HBox).Border(false) .Items ( X.FieldContainer().Flex(1).Layout(LayoutType.Anchor).Border(false) .Items ( X.TextField().ID("txtReportLName").EmptyText("search by last name") .Flex(1).LabelSeparator("").FieldLabel("Last Name").LabelAlign(LabelAlign.Top).AnchorHorizontal("-15") ) , X.FieldContainer().Flex(1).Layout(LayoutType.Anchor).Border(false) .Items ( X.TextField().ID("txtReportFName").EmptyText("search by first name") .Flex(1).LabelSeparator("").FieldLabel("First Name").LabelAlign(LabelAlign.Top).AnchorHorizontal("-15") ) ), X.FieldSet().Flex(1).Layout(LayoutType.HBox).Border(false) .Items ( X.Checkbox().ID("chkUser").BoxLabel("User?").Flex(1).Checked(false) ) ) .Buttons ( X.Button().ID("btnSearch").Text("Search") X.Button().ID("btnReportClear").Text("Clear").Margins("0 0 10 0") ) .ButtonAlign(Alignment.Center) ) ) )

Hi @fabricio.murta

Your example worked for me, it was my mistake that I forgot to make my partial view as visible

Thanks very much

Hello @sharmav1!

Thanks both for the test case and for the feedback confirming the example worked for you in the end! We're glad it was not too far from working!