[CLOSED] Issue with Rendering GridPanel with Headers on Container as Popup

  1. #1

    [CLOSED] Issue with Rendering GridPanel with Headers on Container as Popup

    Hi Team,

    I am trying to render a normal grid panel with headers on Popup window. But its not happening. here is my code.

    Model

    	Public Class CompanyModel
    		Public Property ID() As Integer
    			Get
    				Return m_ID
    			End Get
    			Set
    				m_ID = Value
    			End Set
    		End Property
    		Private m_ID As Integer
    		Public Property Name() As String
    			Get
    				Return m_Name
    			End Get
    			Set
    				m_Name = Value
    			End Set
    		End Property
    		Private m_Name As String
    		Public Property Price() As Double
    			Get
    				Return m_Price
    			End Get
    			Set
    				m_Price = Value
    			End Set
    		End Property
    		Private m_Price As Double
    		Public Property Change() As Double
    			Get
    				Return m_Change
    			End Get
    			Set
    				m_Change = Value
    			End Set
    		End Property
    		Private m_Change As Double
    		Public Property PctChange() As Double
    			Get
    				Return m_PctChange
    			End Get
    			Set
    				m_PctChange = Value
    			End Set
    		End Property
    		Private m_PctChange As Double
    		Public Property LastChange() As DateTime
    			Get
    				Return m_LastChange
    			End Get
    			Set
    				m_LastChange = Value
    			End Set
    		End Property
    		Public Property partialIDs As String
    
    		Private m_LastChange As DateTime
    		Public Property companyList As List(Of CompanyModel)
    		Public Property companyNameList As List(Of CompanyModel)
    		Public Function GetAll() As List(Of CompanyModel)
    			Dim today As DateTime = DateTime.Today
    
    			Return New List(Of CompanyModel)() From {
    				New CompanyModel() With {
    					.ID = 1,
    					.Name = "3m Co",
    					.Price = 71.72,
    					.Change = 0.02,
    					.PctChange = 0.03,
    					.LastChange = today
    				},
    				New CompanyModel() With {
    					.ID = 2,
    					.Name = "Alcoa Inc",
    					.Price = 29.01,
    					.Change = 0.42,
    					.PctChange = 1.47,
    					.LastChange = today
    				},
    				New CompanyModel() With {
    					.ID = 3,
    					.Name = "Altria Group Inc",
    					.Price = 83.81,
    					.Change = 0.28,
    					.PctChange = 0.34,
    					.LastChange = today
    				},
    				New CompanyModel() With {
    				   .ID = 4,
    				   .Name = "American Express Company",
    				   .Price = 52.55,
    				   .Change = 0.01,
    				   .PctChange = 0.02,
    				   .LastChange = today
    				},
    				New CompanyModel() With {
    					.ID = 5,
    					.Name = "American International Group, Inc.",
    					.Price = 64.13,
    					.Change = 0.31,
    					.PctChange = 0.49,
    					.LastChange = today
    				},
    				New CompanyModel() With {
    					.ID = 6,
    					.Name = "AT&T Inc.",
    					.Price = 31.61,
    					.Change = -0.48,
    					.PctChange = -1.54,
    					.LastChange = today
    				}
    			}
    		End Function
    
    		Public Shared Function GetAllCompanies() As IEnumerable(Of CompanyModel)
    			Dim now As DateTime = DateTime.Now
    
    			Return New Object() {New CompanyModel() With {.Name = "3m Co", .Price = 71.72, .Change = 0.02, .PctChange = 0.03, .LastChange = now},
    				New Object() {"Alcoa Inc", 29.01, 0.42, 1.47, now},
    				New Object() {"Altria Group Inc", 83.81, 0.28, 0.34, now},
    				New Object() {"American Express Company", 52.55, 0.01, 0.02, now},
    				New Object() {"American International Group, Inc.", 64.13, 0.31, 0.49, now},
    				New Object() {"AT&T Inc.", 31.61, -0.48, -1.54, now},
    				New Object() {"Boeing Co.", 75.43, 0.53, 0.71, now},
    				New Object() {"Caterpillar Inc.", 67.27, 0.92, 1.39, now},
    				New Object() {"Citigroup, Inc.", 49.37, 0.02, 0.04, now},
    				New Object() {"E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, now},
    				New Object() {"Exxon Mobil Corp", 68.1, -0.43, -0.64, now},
    				New Object() {"General Electric Company", 34.14, -0.08, -0.23, now},
    				New Object() {"General Motors Corporation", 30.27, 1.09, 3.74, now},
    				New Object() {"Hewlett-Packard Co.", 36.53, -0.03, -0.08, now},
    				New Object() {"Honeywell Intl Inc", 38.77, 0.05, 0.13, now},
    				New Object() {"Intel Corporation", 19.88, 0.31, 1.58, now},
    				New Object() {"International Business Machines", 81.41, 0.44, 0.54, now},
    				New Object() {"Johnson & Johnson", 64.72, 0.06, 0.09, now},
    				New Object() {"JP Morgan & Chase & Co", 45.73, 0.07, 0.15, now},
    				New Object() {"McDonald""s Corporation", 36.76, 0.86, 2.4, now},
    				New Object() {"Merck & Co., Inc.", 40.96, 0.41, 1.01, now},
    				New Object() {"Microsoft Corporation", 25.84, 0.14, 0.54, now},
    				New Object() {"Pfizer Inc", 27.96, 0.4, 1.45, now},
    				New Object() {"The Coca-Cola Company", 45.07, 0.26, 0.58, now},
    				New Object() {"The Home Depot, Inc.", 34.64, 0.35, 1.02, now},
    				New Object() {"The Procter & Gamble Company", 61.91, 0.01, 0.02, now},
    				New Object() {"United Technologies Corporation", 63.26, 0.55, 0.88, now},
    				New Object() {"Verizon Communications", 35.57, 0.39, 1.11, now},
    				New Object() {"Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, now}}
    		End Function
    
    		Public Function GetCompanyNames() As List(Of CompanyModel)
    			Dim list = GetAll()
    			Return list
    		End Function
    	End Class
    Controller
    Imports System.Web.Mvc
    Imports Ext.Net
    Imports Ext.Net.MVC
    
    Namespace Controllers
    	Public Class HomeController
    		Inherits Controller
    
            ' GET: Home
            Function Index() As ActionResult
    			Dim companyModel As New CompanyModel
    			companyModel.companyList = companyModel.GetAll()
    			Return View(companyModel)
    		End Function
    		Function Save() As ActionResult
    
    			Return View()
    		End Function
    
    		Function OpenAddReview(qaBatchID As Integer, containerId As String) As ActionResult
    
    
    			Dim companyModel As New CompanyModel
    			companyModel.companyList = companyModel.GetAll()
    			Dim ret As New Ext.Net.MVC.PartialViewResult()
    			ret.ViewName = "_AddReview"
    			ret.Model = companyModel
    			ret.ContainerId = containerId
    			ret.RenderMode = RenderMode.AddTo
    			ret.ClearContainer = True
    
    			Me.GetCmp(Of Window)(containerId).Show()
    			Return ret
    		End Function
    	End Class
    End Namespace
    Index View

    @ModelType CommissionCheckProblem.CompanyModel
    <h2>Index</h2>
    
    @Html.X().ResourceManager()
    
    @(Html.X().Window().ID("reviewWindow") _
    	.Width(1200) _
    	.OverflowX(Overflow.Scroll) _
    	.OverflowY(Overflow.Scroll) _
    	.Hidden(True) _
    	.Title("QAR Edit - " + Model.Name + " - " + Model.PctChange.ToString() + " - " + Model.LastChange.ToString()) _
    	.AutoUpdateLayout(True))
    
    @(Html.X().Button.ID("btnAddReview") _
    	.Text("Add") _
    	.DirectEvents(Sub(ls)
    					  ls.Click.Url = Url.Action("OpenAddReview")
    					  ls.Click.ExtraParams.Add(New Parameter("qaBatchID", "1", mode:=ParameterMode.Value))
    					  ls.Click.ExtraParams.Add(New Parameter("containerId", "reviewWindow", mode:=ParameterMode.Value))
    				  End Sub))

    _AddReview Partial View

    @ModelType CommissionCheckProblem.CompanyModel
    @(Html.X().Container().Content(@@<text>
        <div>@(Html.X().GridPanel().ID("CompanyGrid") _
    		.Store(Html.X().Store() _
    		.ID("Store2") _
    		.Model(Html.X().Model() _
    		.Fields(
    			New ModelField("ID", ModelFieldType.Int),
    			New ModelField("Name"),
    			New ModelField("Price", ModelFieldType.Float),
    			New ModelField("Change", ModelFieldType.Float),
    			New ModelField("PctChange", ModelFieldType.Float),
    			New ModelField("LastChange", ModelFieldType.Date)
    		)
    		).DataSource(Model.companyList)) _
    		.ColumnModel(
    		Html.X().Column().Text("ID").DataIndex("ID").Width(35),
    		Html.X().Column() _
    		.Text("Name") _
    		.DataIndex("Name") _
    		.Flex(1),
    		Html.X().Column() _
    		.Text("Price") _
    		.DataIndex("Price") _
    		.Renderer(RendererFormat.UsMoney),
    		Html.X().Column() _
    		.Text("Change") _
    		.DataIndex("Change"),
    		Html.X().Column() _
    		.Text("PctChange") _
    		.DataIndex("PctChange"),
    		Html.X().DateColumn() _
    		.Text("Last Updated") _
    		.DataIndex("LastChange") _
    		.Format("yyyy-MM-dd")
    		))</div></text>).DestroyContent(True))

    Can you please help in rendering this simple grid?

    Note: Everything here is hard coded in parameter and Model class is just an example class, just to avoid confusion, please ignore extra properties of Model defined here. I posted here so that you can having working example and this should avoid any delay.

    Thanks.
    Last edited by fabricio.murta; Oct 29, 2016 at 9:02 PM. Reason: no user feedback for 7+ days
  2. #2
    Hello @mwiater!

    I'm getting syntax errors at least from your partial view here. Just by copy-pasting your code I get here:

    Click image for larger version. 

Name:	61424_syntaxError.png 
Views:	0 
Size:	33.2 KB 
ID:	24741

    Do you also get this error on your side? If so, maybe you should try indenting the code to fix those syntax errors? I agree that Visual Studio does not really excels in indenting Razor syntax code but it could save you from a lot of trouble trying to guess where the error is.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    And hello again!

    I could have your partial view working if I dropped the use of .Content() and the <div />. Do your scenario require the div? Or maybe you just need the div to add a style (CSS Class) to the surrounding frame?

    Actually you could bring the whole window from the partial view. Just a guess, but who knows, this could help.

    Here's how I've written your partial view for it to work in your sample:

    @ModelType Controllers.c61424_gridPartViewController.CompanyModel
    
    @(
        Html.X().Container() _
            .Items(
                Html.X().GridPanel() _
                    .ID("CompanyGrid") _
                    .Store(
                        Html.X().Store() _
                            .ID("Store2") _
                            .Model(
                                Html.X().Model() _
                                    .Fields(
                                        New ModelField("ID", ModelFieldType.Int),
                                        New ModelField("Name"),
                                        New ModelField("Price", ModelFieldType.Float),
                                        New ModelField("Change", ModelFieldType.Float),
                                        New ModelField("PctChange", ModelFieldType.Float),
                                        New ModelField("LastChange", ModelFieldType.Date)
                                    )
                            ) _
                            .DataSource(Model.companyList)
                    ) _
                    .ColumnModel(
                        Html.X().Column().Text("ID").DataIndex("ID").Width(35),
                        Html.X().Column() _
                            .Text("Name") _
                            .DataIndex("Name") _
                            .Flex(1),
                        Html.X().Column() _
                            .Text("Price") _
                            .DataIndex("Price") _
                            .Renderer(RendererFormat.UsMoney),
                        Html.X().Column() _
                            .Text("Change") _
                            .DataIndex("Change"),
                        Html.X().Column() _
                            .Text("PctChange") _
                            .DataIndex("PctChange"),
                        Html.X().DateColumn() _
                            .Text("Last Updated") _
                            .DataIndex("LastChange") _
                            .Format("yyyy-MM-dd")
                    )
            )
    )
    Notice I'm using a different namespace for the model (for simplicity I've appended it in the controller!). While I also re-formatted your index view for better understanding of your code, I don't remember getting any error in its original form, but anyway, the index view here looks like this after a few indentation:

    @Code
        Layout = Nothing
    End Code
    
    <!DOCTYPE html>
    
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Index</title>
    </head>
    <body>
        <div> 
            @ModelType Controllers.c61424_gridPartViewController.CompanyModel
            <h2>Index</h2>
    
            @Html.X().ResourceManager()
    
            @(Html.X().Window().ID("reviewWindow") _
                .Width(1200) _
                .OverflowX(Overflow.Scroll) _
                .OverflowY(Overflow.Scroll) _
                .Hidden(True) _
                .Title("QAR Edit - " + Model.Name + " - " + Model.PctChange.ToString() + " - " + Model.LastChange.ToString()) _
                .AutoUpdateLayout(True))
    
            @(
                Html.X().Button.ID("btnAddReview") _
                    .Text("Add") _
                    .DirectEvents(Sub(ls)
                        ls.Click.Url = Url.Action("OpenAddReview")
                        ls.Click.ExtraParams.Add(New Parameter("qaBatchID", "1", mode:=ParameterMode.Value))
                        ls.Click.ExtraParams.Add(New Parameter("containerId", "reviewWindow", mode:=ParameterMode.Value))
                    End Sub)
            )
        </div>
    </body>
    </html>
    Notice the Layout = Nothing part is particularly relevant. It means all that it takes to draw the page is on the code pasted above and nothing additional is needed.

    I didn't change the model+controller code and just visual studio's own reindentation fixes seems to do the job, so I'm not re-posting them here.

    I hope this helps!
    Fabrício Murta
    Developer & Support Expert
  4. #4
    Hello @mwiater!

    Been some time since your last reply here. Do you still need help with this issue? We'll wait another week for your feedback before marking this as closed -- which will not prevent you from posting follow-ups when you are able to, though.
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Combo Box with in Gridpanel Rendering issue
    By yenkarthi in forum 2.x Help
    Replies: 0
    Last Post: Nov 23, 2015, 3:13 AM
  2. Replies: 3
    Last Post: Jun 15, 2015, 1:21 PM
  3. Replies: 1
    Last Post: Aug 10, 2012, 1:09 PM
  4. [CLOSED] DropDownField container appears back of popup
    By kenanhancer in forum 1.x Premium Help
    Replies: 3
    Last Post: Dec 14, 2011, 5:40 PM
  5. [CLOSED] ICONs are not rendering in popup window
    By rnachman in forum 1.x Premium Help
    Replies: 1
    Last Post: Mar 28, 2011, 6:04 PM

Posting Permissions