[CLOSED] popup window control from shared layout page

  1. #1

    [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:

    X.Window().ID("TestPopUp").Width(500).Height(500).Modal(true).Items(....)
    I was able to do it by calling

    @HTML.Partial("TestPopUp")
    and then

    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
    Last edited by fabricio.murta; Mar 03, 2017 at 6:37 PM.
  2. #2
    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.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    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:

    @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:
    public ActionResult Report()
            {
                
                return new Ext.Net.MVC.PartialViewResult { ViewName = "Report" };
    
            }
    partialview: Report.cshtml

    @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)
                
            )
        )
        
    )
    Last edited by sharmav1; Mar 03, 2017 at 7:25 AM.
  4. #4
    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
  5. #5
    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!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 1
    Last Post: Jun 18, 2012, 3:41 PM
  2. Replies: 1
    Last Post: Feb 03, 2012, 2:36 PM
  3. Replies: 1
    Last Post: Jan 16, 2012, 5:00 PM
  4. Replies: 4
    Last Post: Feb 23, 2010, 7:38 AM
  5. [CLOSED] Window in a control is visible when page is rendered
    By gokcemutlu in forum 1.x Premium Help
    Replies: 2
    Last Post: Jan 15, 2010, 7:05 AM

Tags for this Thread

Posting Permissions