Ext Grid Component Column on Popup giving "me is not defined" and "find exact of Null"

Problem Statement:-

I have Grid with Component column, I am showing this grid on pop up. Its rendering first time with the javascript error shown in attached screenshot FirstTime.png, after closing the pop up, I tried opening it again with the "btnAddNewPrice" then it doesnt gets open and give javascript error attached in SecondTime.png

The view looks little big for you but its the repetition of component column only. Tried many thing but its not working. Tried to have seperate store for combo box and assigning store Id to them, still gives same error.

Please help.

Thanks.

This is partial view code:-

[Code]
@model PR.DTO.RP.ScenarioPackAttributeViewModel

@(
Html.X().Panel()
.ID("pnlRPEditPackAttributeMain")
.BodyPadding(5)

.Items(

Html.X().FormPanel()
.Border(false)
.ID("frmEditPackAttribute")
.Items(
Html.X().AntiForgeryField(),

Html.X().Container()
.Items(

Html.X().GridPanel().ID("grdPnlEditPackAttribute")
.Border(true)
.Cls("x-grid-custom")
.StyleSpec("margin-top:7px;margin-left:-2px;")
.ColumnLines(true)
.OverflowX(Overflow.Auto)
.EnableColumnHide(false)
.ForceFit(false)
.Height(400)
.AutoRender(false)
.AutoScroll(true)
.Scroll(ScrollMode.Both).EmptyText("No data found.")
.Store(Html.X().Store().ID("storeGrdEditpackAttrib ute")
.PageSize(Convert.ToInt32(PriceRight.Settings.Prop ertyReader.GetProperty("GRID_PAGE_SIZE")))
.RemoteSort(true).RemoteFilter(true)
.RemotePaging(true)
.Model(Html.X().Model().IDProperty("SCENARIO_PACK_ UUID")
.Fields(
new ModelField("SCENARIO_PACK_UUID", ModelFieldType.Int),
new ModelField("SCENARIO_UUID", ModelFieldType.Int),
new ModelField("COUNTRY_CD", ModelFieldType.Int),
new ModelField("COUNTRY_DESC", ModelFieldType.String),
new ModelField("PACK_CD", ModelFieldType.Int),
new ModelField("PACK_DESC", ModelFieldType.String),
new ModelField("REIMBURSED_STATUS_CD", ModelFieldType.Int),
new ModelField("REIMBURSED_STATUS_DESC", ModelFieldType.String),
new ModelField("MARKETING_AUTHORITY_STATUS_CD", ModelFieldType.Int),
new ModelField("MARKETING_AUTHORITY_STATUS_DESC", ModelFieldType.String),
new ModelField("PRESCRIBING_STATUS_CD", ModelFieldType.Int),
new ModelField("PRESCRIBING_STATUS_DESC", ModelFieldType.String)
)
)
.DataSource(Model.ScenarioPackAttribute)
.ServerProxy(Html.X().AjaxProxy()
.Url(Url.Action("GetEditPackAttributeData"))
)
)
.ColumnModel(
Html.X().Column().Text("SCENARIOPACKUUID").DataInd ex("SCENARIO_PACK_UUID").Hidden(true),
Html.X().Column().Text("SCENARIOUUID").DataIndex(" SCENARIO_UUID").Hidden(true),
Html.X().Column().Text("CountryCD").DataIndex("COU NTRY_CD").Hidden(true),
Html.X().Column().Text("Country").DataIndex("COUNT RY_DESC").Flex(1).Sortable(true),
Html.X().Column().Text("PACKCD").DataIndex("PACK_C D").Hidden(true),
Html.X().Column().Text("Pack Description").DataIndex("PACK_DESC").Flex(1).Sorta ble(true),
Html.X().ComponentColumn()
.Editor(true)
.Sortable(false)
.DataIndex("REIMBURSED_STATUS_CD")
.Flex(1)
.Text("Reimbursed")
.Component(Html.X().ComboBox()
.ValueField("REIMBURSED_STATUS_CD")
.DisplayField("REIMBURSED_STATUS_DESC")
.Editable(false)
.Listeners(ls => ls.Change.Fn = "checkISDirtyPackAttribute")
.Store(Html.X().Store()
.Model(Html.X().Model()
.Fields(
new ModelField("REIMBURSED_STATUS_CD", ModelFieldType.Int),
new ModelField("REIMBURSED_STATUS_DESC", ModelFieldType.String)
)
)
.DataSource(Model.ReimbursedStatusTypes)
)

),
Html.X().ComponentColumn()
.Editor(true)
.Sortable(false)
.DataIndex("MARKETING_AUTHORITY_STATUS_CD")
.Flex(1)
.Text("Marketing Authority Status")
.Component(Html.X().ComboBox()
.ValueField("MARKETING_AUTHORITY_STATUS_CD")
.DisplayField("MARKETING_AUTHORITY_STATUS_DESC")
.Editable(false)
.Listeners(ls => ls.Change.Fn = "checkISDirtyPackAttribute")
.Store(Html.X().Store()
.Model(Html.X().Model()
.Fields(
new ModelField("MARKETING_AUTHORITY_STATUS_CD", ModelFieldType.Int),
new ModelField("MARKETING_AUTHORITY_STATUS_DESC", ModelFieldType.String)
)
)
.DataSource(Model.MarketingAuthorityStatusTypes)
)

),
Html.X().ComponentColumn()
.Editor(true)
.Sortable(false)
.DataIndex("PRESCRIBING_STATUS_CD")
.Flex(1)
.Text("Prescribing Status")
.Component(Html.X().ComboBox()
.ValueField("PrescribingStatusCD")
.DisplayField("PrescribingStatusDesc")
.Editable(false)
.Listeners(ls => ls.Change.Fn = "checkISDirtyPackAttribute")
.Store(Html.X().Store()
.Model(Html.X().Model()
.Fields(
new ModelField("PrescribingStatusCD", ModelFieldType.Int),
new ModelField("PrescribingStatusDesc", ModelFieldType.String)
)
)
.DataSource(Model.PrescribingStatusTypes)
)

)

)
.Features(
Html.X().GridFilters()
.Local(true)
.Filters(Html.X().StringFilter().DataIndex("COUNTR Y_DESC"),
Html.X().StringFilter().DataIndex("PACK_DESC")

)
),


Html.X().Panel().ID("pnlEditPackAttributeBtns")
.ButtonAlign(Alignment.Right)
.Buttons(
Html.X().Button()
.Text("Save")
.ID("btnEPackAttributeSave")
.StyleSpec("margin-right:5px;")
.Scale(ButtonScale.Small)
.Icon(Icon.TableSave)
.Disabled(true)
.DirectEvents(de =>
{
de.Click.Url = (Url.Action("SavePackAttribute"));
de.Click.ExtraParams.Add(new Parameter
{
Name = "data",
Value = "#{storeGrdEditpackAttribute}.getChangedData({skip IdForPhantomRecords: false})",
Mode = ParameterMode.Raw,
Encode = true
});
de.Click.Success = "App.btnEPackAttributeSave.disable();";
})
,
Html.X().Button().Text(PR.Resources.RP.RP.PSExport Button).Margin(4).ID("btnExport").Type(ButtonType. Submit).Handler("Export").Scale(ButtonScale.Small)
,
Html.X().Button()
.Text("Import")
.ID("btnEPackAttributeImport")
.StyleSpec("margin-right:5px;")
.Scale(ButtonScale.Small)

,
Html.X().Button()
.Text("Reset")
.ID("btnEPackAttributeReset")
.StyleSpec("margin-right:5px;")
.Scale(ButtonScale.Small)
)
)
)
)
)


[Code]

Model:-

[Code]
[DataContract]
public class ScenarioPackAttributeViewModel
{
[DataMember]
public int Scenario_UUID { get; set; }

[DataMember]
public List<ScenarioPackAttributeDTO> ScenarioPackAttribute { get; set; }

[DataMember]
public List<MarketingAuthorityStatusDTO> MarketingAuthorityStatusTypes { get; set; }

[DataMember]
public List<PrescribingStatusDTO> PrescribingStatusTypes { get; set; }

[DataMember]
public List<ReimbursedStatusDTO> ReimbursedStatusTypes { get; set; }
}
[Code]

Partial View is called from the button(main page) on pop up:-

Parent page:-

Button to call pop up:-

[CODE]
Html.X().Button().ID("btnAddNewPrice").Text("Edit Pack Attribute").Margin(2)
.DirectEvents(de =>
{
de.Click.Action = "ViewEditPackAttribute";
de.Click.EventMask.ShowMask = true;
de.Click.Method = HttpMethod.POST;
de.Click.Before = "App.rpEditPackAttribute.setTitle('Edit Pack Attribute');$('#rpEditPackAttributeContainer').emp ty();";
de.Click.ExtraParams.Add(new Parameter() { Name = "scenarioID", Value = ViewBag.ScenarioID.ToString(), Mode = ParameterMode.Value });
de.Click.ExtraParams.Add(new Parameter() { Name = "containerId", Value = "rpEditPackAttributeContainer", Mode = ParameterMode.Value });
de.Click.Success = "App.rpEditPackAttribute.show();App.rpEditPackAttr ibute.center(); Ext.getCmp('rpEditPackAttribute').doLayout();";
})
[CODE]

Container:-

[CODE]

@(
Html.X().Window().ID("rpEditPackAttribute")
.Title("Edit Pack Attribute")
.Width(900)
.Header(true)
.Hidden(true)
.Border(false)
.BodyStyle("background-color: #fff;")
.BodyPadding(5)
.Modal(true)
.Items(
Html.X().Container()
.ID("rpEditPackAttributeContainer")
.Layout(LayoutType.Fit)
)

)
[CODE]

Action method on button click to open pop up

[CODE]
public ActionResult ViewEditPackAttribute(int scenarioID, string containerId)
{
var model = GetPackAttributeLocal(scenarioID);
var partialView = new Ext.Net.MVC.PartialViewResult
{
ContainerId = containerId,
ViewName = "_EditPackAttribute",
ClearContainer = true,
Model = model

};

return partialView;
}
[CODE]

Any Idea whats happening..or its some issue with component column. Please let us know if there is any solution