How to design Grid columns with multiple Headers ,MVC razore code

[Shital]

Hello,

I am new to ext.net and need help to implement grid with multiple header. Till now i have implemented grid and filled it with model.
But i don't know how to display main header for 2,3 columns.

My code till now is as follow -

Html.X().Container()
 .ID("launchContainer")
 .Items(
X.GridPanel()
    .ID("grdSetLaunchAttributes")
    .Title("Testing")
    .Layout(LayoutType.Container)
    .Listeners(x => x.AfterLayout.Fn="ResetDirty")
    .Store(
    X.Store()
   .ID("store1")
        .Model(
        X.Model()
            .Fields(
            new ModelField("LSO_SCENARIO_CD", ModelFieldType.Int),
            new ModelField("PACK_DESC", ModelFieldType.String),
            new ModelField("COUNTRY_DESC", ModelFieldType.String),
            new ModelField("PRICE", ModelFieldType.Float),
            new ModelField("IS_LIKELY_DATE_CALCULATED", ModelFieldType.Boolean),
            new ModelField("DECISION_EARLY_DATE", ModelFieldType.Date),
            new ModelField("DECISION_LIKELY_DATE", ModelFieldType.Date),
            new ModelField("DECISION_LATE_DATE", ModelFieldType.Date),
            new ModelField("PUBLICATION_LAG", ModelFieldType.Int),
            new ModelField("COMMERCIAL_LAUNCH_DATE", ModelFieldType.Date),
            new ModelField("COMMERCIAL_LAUNCH_PRICE", ModelFieldType.Float),
            new ModelField("LSO_SCENARIO_PRODUCT_PACK_COUNTRY_LAUNCH_CD", ModelFieldType.Int),
            new ModelField("REBATE_OTHER", ModelFieldType.Int),
            new ModelField("REBATE", ModelFieldType.Int),
            new ModelField("IS_CALCULATED_FROM_REF_RULE", ModelFieldType.Boolean)
            
                   )
               ).DataSource(Model)
            )
    .ColumnModel(
        X.Column()
         .Text("PACK")
         .DataIndex("PACK_DESC"),

        X.Column()
         .Text("Country")
         .DataIndex("COUNTRY_DESC"),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("PRICE")
         .Text("Launch Price")
         .Component(Html.X().TextField().ReadOnly(ReadOnlyMode).MaxLength(10).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty")),


        X.ComponentColumn()
        .Editor(true)
         .DataIndex("IS_CALCULATED_FROM_REF_RULE")
         .Text("Calc. from Init. Ref Rule? ")
         .Component(Html.X().Checkbox().ReadOnly(ReadOnlyMode).Listeners(ls => ls.Change.Fn = "SetDirty")),
        X.ComponentColumn()
        .Editor(true)
         .DataIndex("REBATE")
         .Text("Mandatory")
         .Component(Html.X().TextField().ReadOnly(ReadOnlyMode).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty")),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("REBATE_OTHER")
         .Text("Other")
         .Component(Html.X().TextField().ReadOnly(ReadOnlyMode).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty")),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("DECISION_EARLY_DATE")
         .Text("Earliest Date")
         .Component(Html.X().DateField().Listeners(ls => ls.Change.Fn = "SetDirty").Format(@ViewBag.dateformat)),
         

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("DECISION_LIKELY_DATE")
         .Text("Base Line Date")
         .Component(Html.X().DateField().ReadOnly(ReadOnlyMode).Listeners(ls => ls.Change.Fn = "SetDirty").Format(@ViewBag.dateformat)),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("DECISION_LATE_DATE")
         .Text("Latest Date")
         .Component(Html.X().DateField().ReadOnly(ReadOnlyMode).Listeners(ls => ls.Change.Fn = "SetDirty").Format(@ViewBag.dateformat)),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("PUBLICATION_LAG")
         .Text("Publication Lag, Days")
         .Component(Html.X().TextField().ReadOnly(ReadOnlyMode).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty")),

        X.ComponentColumn()
        .Editor(true)
         .DataIndex("COMMERCIAL_LAUNCH_DATE")
         .Text("Product Availability Date")
         .Component(Html.X().DateField().ReadOnly(ReadOnlyMode).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty").Format(@ViewBag.dateformat)),

       X.ComponentColumn()
        .Editor(true)
        .DataIndex("COMMERCIAL_LAUNCH_PRICE")
        .Text("Commercial Price")
        .Component(Html.X().TextField().ReadOnly(ReadOnlyMode).MaxLength(10).MaskRe("/[0-9]/").Listeners(ls => ls.Change.Fn = "SetDirty"))

    )

     .Buttons(
              Html.X().Button()
              .Scale(ButtonScale.Medium)
              .Text("Save")
              .DirectEvents(de =>
              {
                  de.Click.Url = (Url.Action("HandleChanges", "SetLaunchAttributes"));
                  de.Click.EventMask.ShowMask = true;
                  de.Click.Timeout = 50000;

                  de.Click.ExtraParams.Add(new Parameter
                  {
                      Name = "data",
                      Value = "this.up('grid').store.getChangedData({skipIdForPhantomRecords: false})",
                      Mode = ParameterMode.Raw,
                      Encode = true
                  });
                  de.Click.Success = "success";
              }),
            Html.X().Button()
            .Scale(ButtonScale.Medium)
            .Text("Cancel").StyleSpec("margin-right:14px")
            .Listeners(ls => ls.Click.Fn = "LaunchDetailsCancel")


                ).ButtonAlign(Alignment.Right)

)

from above code i am getting view like below-




But now I want column headers like given below-




Can you please give some idea to achieve this.
Thanks.

[Shital]

Ok... I got my answer :)

X.Column().Columns(
        X.ComponentColumn1 ,co;lumn 2 ),

in this way i can implement multiple headers to single column.

Thanks anyways :-)