Bind ClientDetailTemplate to non-model datatable excluding certain columns

[Richard]

I have a pretty problem that I've been searching for an answer to and haven't found anything like what I need.  I have a kendo grid bound to a model object for my view. The model is a custom object of type BatchHeader.  BatchHeader owns a collection of Transaction objects. Each Transaction object has XML data unique to a given transaction type so the data varies by transaction.  I have TranDetail objects derived from a base class, one derived type for each transaction type, each with it's own properties and validation code.

On the View page I need to display pending Batch/Transaction/Details in a nested grid format for review, potential correction, and posting.  The first two grid objects are pretty straightforward.  The third is turning into a real pain.  The third level has to be polymorphic as the transactions in a batch may not be homogeneous.  I can't pass in an object of type object because reflection won't get it's properties for iteration (tried that already).  I can't use the base class because then all I have access to are the common properties (tried that too), many of which (but not all) I want to suppress anyhow.  So far I haven't been able to figure out how to pass in any kind of an object to the third level grid that I can work with.

One thing I thought of is to transform the detail transaction object's data into a datarow and pass that in but I haven't figured out how to bind it, iterate it, and suppress the columns I don't want.  On top of that, I'm new to C# and MVC although I've been writing code for a very long time.  Each generic transaction object can have only one detail record so it's not like I need to mix types at once, but I'm not finding a way to pass in a known type at runtime.  The other problem of course is that it's not possible to know in advance what type of detail transaction requires presentation.

Is it possible to have multiple detail grids, one per tran type, and suppress the ones' I don't need in a given instance?  That seems inelegant.  I like the datarow idea but since the page already has a model I'm not sure how to bind the datarow to the third level grid either.

Any help willl be greatly appreciated!

[Petur Subev]

Hello Richard,

Did you notice that you can use a string overload to define column(s)? For example:

columns.Bound("PersonID");

This is quite handy when it comes to generic definition of the columns.

If you are asking however to have different structure for Grids on the same level of the hierarchy - this is not possible, one type of Grid definition is used for all the detail Grids on that level of the hierarchy and its structure should be defined when the page is rendered.

Kind Regards,
Petur Subev
Telerik

[Richard]

Hi Peter!
The problem I'm facing is the need to display in the third level of the grid nesting one (at a time) of n types derived from type TransactionDetailBase.  Currently there are three detail transaction types, but there will be more.  Potentially any of the BatchHeader/Transactions in the first two levels will have all transaction types at the third level, but only one detail transacton type is possible with each Transaction at the second level.  This is because the detail tran type represents the XMLTransactionData property of the Transaction object.  This detail object is where I've encapsulated the validation rules that apply to each transaction type.  Each data element is a property and is parsed from the XML data.

So at the third level I need to polymorphicaly display the transaction detail object whose type is unknown at design time.  I plan to get around this by transforming the detail object into a DataTable and bind the datatable to the grid's third level.  I also need to suppress certain columns (of the DataTable) because they duplicate information displayed at the first and second level, or are not relevant to the immediate need.  Those columns are known at design time.

The first problem I had was figuring out how to get a reference to the datatable in order to interrogate the grid columns.  I think I have that figured out, but the object turns out to be null so the DataSource Read.Action method is not being called as it is in the higher levels.  I also need help figuring out how to get Read.Action to generate the proper transaction id and transaction type parameters as what I have in place appears not to work as it does in the first and second levels which do display correctly when I comment out the third level.  Also, when I added the foreach block in the .Model() section of the .DataSource block the compiler really doesn't like that.  FYI, I'm basing my code off an example I found on StackOverflow at http://stackoverflow.com/questions/18727951/kendo-datasource-how-to-define-a-model-id-when-using-datatable Unfortunately, I can't use his code as is because my Model is already defined otherwise.

Here's my code as it stands now.  It throws an error for a null datatable object if I take out the Model() block.  It won't run at all with the Model() block in place.  FYI, I'm going off on holiday for the next two weeks and will be back on 1/6/2014.  If you can point me in the right direction I'll be very grateful for your help.

Happy Holidays!

@model IEnumerable<ROAMTranReview.ROAMHostSvc.BatchHeader>

@{
    ViewBag.Title = "Transaction Review";
}

<h2>Batches to Review/Post</h2>

@(Html.Kendo().Grid(Model)
    .Name("BatchGrid")
    .Pageable()
    .Sortable()
    .Scrollable()
    .Columns(columns =>
                {
                    columns.Bound(b => b.BatchID)
                                        .Width("300")
                                        .Title("Batch ID");
                    columns.Bound(b => b.Created_Emp_Name)
                                        .Width("200")
                                        .Title("Created Employee");
                    columns.Bound(b => b.Created_DTTM)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Created");
                    columns.Bound(b => b.Transmitted_DateTime)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Transmitted");
                    columns.Bound(b => b.Completed_DateTime)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Completed");
                }
            )
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(40)
        .Read(read => read.Action("FetchBatchCollection", "Batch"))
    )
    .ClientDetailTemplateId("transactions")
    .Events(events => events.DataBound("dataBound"))
)

<!-- Nested grid for transaction object, member of BatchHeader.TranCollection
     There can be many ITransaction objects per BatchHeader -->
<script id="transactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<ROAMTranReview.ROAMHostSvc.TransactionBase>()
            .Name("TranGrid")
            .Columns(columns =>
                {
                    columns.Bound(b => b.ID)
                                        .Width("300")
                                        .Title("Transaction ID");
                    columns.Bound(b => b.Created_Emp_Name)
                                        .Width("200")
                                        .Title("Created Employee");
                    columns.Bound(b => b.Created_DTTM)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Created");
                    columns.Bound(b => b.TranTypeDisplayText)
                                        .Width("100")
                                        .Title("Type");
                    columns.Bound(b => b.PostingFlagDisplayText)
                                        .Width("100")
                                        .Title("Posting Flag");
                    columns.Bound(b => b.PostingMessage)
                                        .Width("600")
                                        .Title("Posting Message");
                }
            )
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(5)
                .Read(read => read.Action("FetchTransactionCollection", "Batch", new { batchID = "#=BatchID#" }))
            )
            .ClientDetailTemplateId("detailTransactions")
            .Events(events => events.DataBound("dataBound"))
            .ToClientTemplate()
    )

</script>

<!-- Nested grid for detail transaction object. There is only one per transaction object -->
<script id="detailTransactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<System.Data.DataTable>()
            .Name("DetailTranData")
            .Scrollable()
            .Columns( dt =>
                    {
                        System.Data.DataTable tbl = (System.Data.DataTable)dt.Container.DataSource.Data;

                        foreach (System.Data.DataColumn col in tbl.Columns)
                        {
                            dt.Bound(col.ColumnName).Title(col.Caption)
                                                    .Width(200);
                        }
                    }
             )
             .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(2)
                .Model(dt =>
                    {
                        System.Data.DataTable tbl = (System.Data.DataTable)dt.Container.DataSource.Data;

                        foreach (System.Data.DataColumn col in tbl.Columns)
                        {
                            dt.Field(col.ColumnName, col.DataType);
                        }

                    }
                )
                .Read( read => read.Action("FetchDetailTransactionDataTable", "Batch",
                                            new { tranID = "#=TransactionID#", trantype = "#=TransactionType#"}) )
            )
            .ToClientTemplate()
    )

</script>

<script type="text/javascript">
   function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
</script>

[Petur Subev]

Hello Richard,

Binding to DataTable does not make any difference, the dataSource tries to extract the model definition from the DataTable - in your case you do not pass any datatable collection to the third Grid and you end with an exception. You need to find a way to 'know' what fields will the the third Grid Model have and define them.

Here is an example from the DataTable code library, check how the Model is defined thanks to the column information:

@(Html.Kendo().Grid(Model)
    .Name("Grid")
    .Columns(columns =>
    {
        foreach (System.Data.DataColumn column in Model.Columns)
        {
            columns.Bound(column.ColumnName);
        }
    })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .Groupable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model =>
            {
                foreach (System.Data.DataColumn column in Model.Columns)
                {
                    model.Field(column.ColumnName, column.DataType);
                }
            })
        .Read(read => read.Action("Read", "Home"))
    )
)

Kind Regards,
Petur Subev
Telerik

[Richard]

Hello Petur and Happy New Year!
I've revised my code to match your sample and it does not work.  Model.Column cannot resolve.  I get the following error:

Compiler Error Message: CS1061: 'System.Collections.Generic.IEnumerable<ROAMTranReview.ROAMHostSvc.BatchHeader>' does not contain a definition for 'Columns' and no extension method 'Columns' accepting a first argument of type 'System.Collections.Generic.IEnumerable<ROAMTranReview.ROAMHostSvc.BatchHeader>'

I believe this is because the @model declaration at the top of the page defines IEnumerable<BatchHeader> as the Model for the page.  Reading your last response I had been hopeful that I was wrong and that the Html.Kendo().Grid(Model)  you recommended would allow the grid to use a datatable.  That didn't happen.  

Please advise how I can do what needs to be done based on the information I've provided so far.  In fact, would you please promote this to a case?  I'm a licensed Telerik user.  I've appended my revised code and don't see any way to proceed from this point.  I'm hoping you can point the way.

Best Regards,

Rich

@model IEnumerable<ROAMTranReview.ROAMHostSvc.BatchHeader>

@{
    ViewBag.Title = "Transaction Review";
}

<h2>Batches to Review/Post</h2>

@(Html.Kendo().Grid(Model)
    .Name("BatchGrid")
    .Pageable()
    .Sortable()
    .Scrollable()
    .Columns(columns =>
                {
                    columns.Bound(b => b.BatchID)
                                        .Width("300")
                                        .Title("Batch ID");
                    columns.Bound(b => b.Created_Emp_Name)
                                        .Width("200")
                                        .Title("Created Employee");
                    columns.Bound(b => b.Created_DTTM)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Created");
                    columns.Bound(b => b.Transmitted_DateTime)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Transmitted");
                    columns.Bound(b => b.Completed_DateTime)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Completed");
                }
            )
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(40)
        .Read(read => read.Action("FetchBatchCollection", "Batch"))
    )
    .ClientDetailTemplateId("transactions")
    .Events(events => events.DataBound("dataBound"))
)

<!-- Nested grid for transaction object, member of BatchHeader.TranCollection
     There can be many ITransaction objects per BatchHeader -->
<script id="transactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<ROAMTranReview.ROAMHostSvc.TransactionBase>()
            .Name("TranGrid")
            .Columns(columns =>
                {
                    columns.Bound(b => b.ID)
                                        .Width("300")
                                        .Title("Transaction ID");
                    columns.Bound(b => b.Created_Emp_Name)
                                        .Width("200")
                                        .Title("Created Employee");
                    columns.Bound(b => b.Created_DTTM)
                                        .Width("175")
                                        .Format("{0:MM/dd/yyyy hh:mm tt}")
                                        .Title("Created");
                    columns.Bound(b => b.TranTypeDisplayText)
                                        .Width("100")
                                        .Title("Type");
                    columns.Bound(b => b.PostingFlagDisplayText)
                                        .Width("100")
                                        .Title("Posting Flag");
                    columns.Bound(b => b.PostingMessage)
                                        .Width("600")
                                        .Title("Posting Message");
                }
            )
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(5)
                .Read(read => read.Action("FetchTransactionCollection", "Batch", new { batchID = "#=BatchID#" }))
            )
            .ClientDetailTemplateId("detailTransactions")
            .Events(events => events.DataBound("dataBound"))
            .ToClientTemplate()
    )

</script>

<!-- Nested grid for detail transaction object. There is only one per transaction object -->
<script id="detailTransactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid(Model)
            .Name("DetailTranData")
            .Columns( columns =>
                    {
                        foreach (System.Data.DataColumn col in Model.Columns)
                        {
                            // suppress all of the following columns as the
                            // data is either redundant to prior grid levels
                            // or is not relevant to the display need
                            if ((col.ColumnName == "SystemOfRecordID") ||
                                (col.ColumnName == "TransactionType")
                               )
                            {
                                continue;
                            }
                            // display all other columns
                            columns.Bound(col.ColumnName).Title(col.Caption)
                                                         .Width(200);
                        }
                    }
             )
            .Scrollable()
            .Pageable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Model(model =>
                    {
                        foreach (System.Data.DataColumn col in Model.Columns)
                        {
                            model.Field(col.ColumnName, col.DataType);
                        }
                    }
                )
                .Read( read => read.Action("FetchDetailTransactionDataTable", "Batch",
                                            new {
                                                  tranID = "#=TransactionID#",
                                                  trantype = "#=TransactionType#"
                                                }
                                           )
                )
            )
            .ToClientTemplate()
    )
</script>

<script type="text/javascript">
   function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
</script>

[Petur Subev]

Hello Richard,

Indeed your model declaration is of different type:

@model IEnumerable<ROAMTranReview.ROAMHostSvc.BatchHeader>

In the code-library the Model is DataTable.

Of course you are not obligated to use the Model variable, instead you can use a ViewData/ViewBag isntead.

e.g.

in controller:

ViewData["secondLevelDataTAble"] = //... the way you get the datatable

in view:
@{
     var secondModel = (DataTable)ViewData["secondLevelDataTAble"];
}

@(Html.Kendo().Grid<DataRow>()
        .Name("DetailTranData")
        .Columns( columns =>
                {
                    foreach (System.Data.DataColumn col in Model.Columns)
                    {
                        // suppress all of the following columns as the
                        // data is either redundant to prior grid levels
                        // or is not relevant to the display need
                        if ((col.ColumnName == "SystemOfRecordID") ||
                            (col.ColumnName == "TransactionType")
                           )
                        {
                            continue;
                        }
                        // display all other columns
                        columns.Bound(col.ColumnName).Title(col.Caption)
                                                     .Width(200);
                    }
                }
         )
        .Scrollable()
        .Pageable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model =>
                {
                    foreach (System.Data.DataColumn col in secondModel.Columns)
                    {
                        model.Field(col.ColumnName, col.DataType);
                    }
                }
            )
            .Read( read => read.Action("FetchDetailTransactionDataTable", "Batch",
                                        new {
                                              tranID = "#=TransactionID#",
                                              trantype = "#=TransactionType#"
                                            }
                                       )
            )
        )
        .ToClientTemplate()
)

Kind Regards,
Petur Subev
Telerik

[Richard]

Thanks, Petur... that seems to move me a little forward, at least Intellisense is happy now.  I think I now have a sequencing issue.  I'm not certain I'm calling the .Read method properly and I can't find any documentation on specifics.  I'm now getting a null object exception for the secondModel object which would indicate that method FetchDetailTransactionDataTable is not being called to fill it.  FYI, the parameters in the method call are properties of the second-level Transaction object.  Is that the correct way to call this?  It's consistent with how the first and second levels work to my eye.  I've appended the revised view (third level only as the others didn't change) and controller code.

I have not been able to find any specific detailed documentation on how the grid works.  I've found lot's of stuff online, and even bought a book from Amazon but they only cover simple basic stuff, not what I need to find out.

Controller:

// FetchDetailTransactionDataTable
public ActionResult FetchDetailTransactionDataTable(string tranID,
                                                    ROAMHostSvc.DeclarationsTransactionTypes tranType)
{
    DataTable dt;
    dt = DataAccess.FetchDetailTransactionDataTable(tranID, tranType);
    ViewData["secondLevelDataTable"] = dt;

    // assign the result to the DataSourceResult object and return that as Json
    var result = new Kendo.Mvc.UI.DataSourceResult()
    {
        Data = dt.Rows,
        Total = dt.Rows.Count
    };
    return Json(result);
}

View:

@{
    var secondModel = (System.Data.DataTable)ViewData["secondLevelDataTable"];
 }

<!-- Nested grid for detail transaction object. There is only one per transaction object -->
<script id="detailTransactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<System.Data.DataRow>()
            .Name("DetailTranData")
            .Columns( columns =>
                    {
                        foreach (System.Data.DataColumn col in secondModel.Columns)
                        {
                            // suppress all of the following columns as the
                            // data is either redundant to prior grid levels
                            // or is not relevant to the display need
                            if ((col.ColumnName == "SystemOfRecordID") ||
                                (col.ColumnName == "TransactionType")
                               )
                            {
                                continue;
                            }
                            // display all other columns
                            columns.Bound(col.ColumnName).Title(col.Caption)
                                                         .Width(200);
                        }
                    }
             )
            .Scrollable()
            .Pageable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Model(model =>
                    {
                        foreach (System.Data.DataColumn col in secondModel.Columns)
                        {
                            model.Field(col.ColumnName, col.DataType);
                        }
                    }
                )
                .Read(read => read.Action("FetchDetailTransactionDataTable", "Batch",
                                            new
                                            {
                                                tranID = "#=TransactionID#",
                                                trantype = "#=TransactionType#"
                                            }
                                            )
                )
            )
            .ToClientTemplate()
    )
</script>

[Petur Subev]

Hello Richard,

Sending parameters like you shared is possible if they are part of the main grid, same is demonstrated here:

http://demos.kendoui.com/web/grid/hierarchy.html (Notice that EmployeeID is part of the main model not the detail row).

In your case I think it is correct - you are using property of second grid inside the detail template of the second grid.


The action method should be called, I cannot determine what exactly goes wrong just from the code. Is there JavaScript errors or failed requests in the network tab (if there are what does the server returned)?

Consider sharing a live URL page or demonstrate the case in a small project which I can run and advise you further.

Kind Regards,
Petur Subev
Telerik

[Richard]

Hi Petur:
I think you meant to say 'Second level parameter used in the third level' above, but I think I understood OK.

I'm not seeing any network or javascript errors.  I created a test project which produces the identical results.  When you run it, the first and second levels of the grid will render.  When you uncomment the third level in the view (remember to also uncomment the second level element that calls the third level) you should see the null object exception that I've been seeing.

From a sequencing point of view, I did some tracing and it appears that the browser parses all three levels of the grid before it ever calls the controller.  Since the second model variable hasn't been populated yet it throws the exception.

I had to delete the lib and packages folders as the zip file was too big otherwise.  I'm using VS2012 Professional, MVC4 and Razor.

Thanks in advance for looking this over!

Rich

[Petur Subev]

Hello Richard,

Thank you for sharing the sample project I reproduced what you faced. 

I will try to explain the case:

The initialization of the Grid and the DataSource is happening on the first page loads and you have to have reference to the ViewData records when the page loads. In your code you have populated the ViewData variable inside the FetchDetailTransactionDataTable, which is conceptually  incorrect you need to do it inside the Index page. You probably wonder how you will know the arguments you will need - the truth is you cant know them - you have to initialize the Grid and define the structure of the Model without involving the second and the first levels of the Grid hierarchy (please notice we do not talk about getting the data collection itself - we talk about defining the model of the dataSource). This also means you cannot have different structure for the Grids on the third level - they all should be with the same model type.

To summarize you need to have the DataTable (even empty should still do the work) inside the ViewData["secondModelDataTable"] variable, so the DataSource can loop through the Columns of the DataTable and define the Model.

I hope this clarifies the scenario.

Kind Regards,
Petur Subev
Telerik

[Richard]

Thanks, Petur, that helps me understand.  I'm drawing a conclusion and that leads me to a couple more questions.  

My conclusion is that the datatable idea to achieve polymorphism in the third level grid isn't going to do what I wanted it to do. I wonder though, is it possible to have multiple third level grids and suppress the ones that don't apply in a particular case?

How can I initialize the supplemental models from the view page?  I'll need one for each transaction/object type. I can reference the object types from my class library (external to the MVC app, however the Model for the page already references the BatchHeader object from that library so that shouldn't be a problem in and of itself).  I'm new to MVC so I don't know all the tricks yet.

Cheers!

Rich

[Richard]

Hi Petur!
I know you're not done with my last request yet, but I have a new question for you.  While waiting I was working on the test project to get things like command buttons working.  I used some examples, including one of yours I saw on another post.  I've been partially successful, however, in some cases the button doesn't render at all.  Also I need to pass not only the batch id but the transaction id.  The view complains that transaction id is not defined.  How can I get the transactionid property of the current row into the link contained by the command button?  I'm used to grids in Web forms apps (and have loved the Telerik grid there), but not in MVC yet.

Here are two examples of command buttons I've tried.  The first one complains about the transactionid not being defined, but if I take out that parameter it renders just fine.  The second one doesn't render.  I added the ClientTemplate to it but I don't think the url works.  When I tried this one without the ClientTemplate it did not render. I've looked all over for examples but none of them work for me.

Thanks!  Here's the code:

<script id="transactions" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<kendoBatchHeaderTest.Models.Transaction>()
            .Name("TranGrid_#=BatchID#")  // makes the sub-grid name unique so that it will be displayed on each child row.
            //.Pageable()
            .Sortable()
            .Scrollable()
            .HtmlAttributes(new { style = "height:175px; width:800px" })
            .Columns(columns =>
                {
                    columns.Template(@<text></text>)
                                       .ClientTemplate("<a href='" +
                                       Url.Action("Edit", "Home") +
                                       "/#=BatchID#'>Edit</a>")
                                       .Width("100px");
                    columns.Template(@<text>@Html.ActionLink("View Details", "Edit", "Home",
                                        new { BatchID = "#=BatchID#", TransactionID =  "=#TransactionID#" }, null)</text>)
                                        .Width("100px")
                                        .ClientTemplate("<a href='/Edit/Home/#=BatchID#/=#TransactionID#</a>");
                    columns.Bound(b => b.TransactionID)
                                        .Width("100")
                                        .Title("Transaction ID");
                    columns.Bound(b => b.TranactionType)
                                        .Width("200")
                                        .Title("Type");
                    columns.Bound(b => b.PostingMessage)
                                       .Width("600")
                                       .Title("Posting Message");
                }
                    )
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(5)
                        .Read(read => read.Action("FetchTransactionCollection", "Home", new { batchID = "#=BatchID#" }))
                    )
            //.ClientDetailTemplateId("detailTransactions")
            //.Events(events => events.DataBound("dataBound"))
                    .ToClientTemplate()
            )

</script>

[Petur Subev]

Hello Rich,

I would like to ask you to open new and distinct questions in separate ticket/ forum threads. Long threads create confusion they become useless to the community and at the same time they are harder to be handled by the support officers.

Conditional displayed on of the nested Grids can be achieved through conditional expressions inside the detail template.

http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/faq#how-do-i-have-conditional-logic-in-a-column-client-template?
http://docs.kendoui.com/getting-started/framework/templates/overview

e.g.

<script id="transactions" type="text/kendo-tmpl">
   #if (data.SomePropertyOfMasterGrid) { #
    @(Html.Kendo().Grid<theChildType>()
             ////////......
          )
    # } #
</script>

I don't seem to understand the last question from your previous post , also I do not think it is anyhow related to the Kendo framework. Could you please elaborate on it if you think it is related to KendoUI ?

Kind Regards,
Petur Subev
Telerik

[Richard]

Wahoo!  That got it done!  I've attached the full working test project.  There was one thing I could not figure out though, and that was how to use multiple parameters in a command button when calling the controller method.  I had to use a kludge which I really don't like.  I concatenated the parameters and parsed them back out in the controller method.  I would prefer to have passed them as distinct parameters but couldn't find a syntax that worked.  All the examples have single paramters.

Thanks very much for all your help, Petur!

[Richard]

Sorry, Petur!
One more thing I forgot to put in the prior post.  I see some formatting issues in the grid I don't understand.  Specifically, when the third level is expanded the vertical size of the subgrid decreases with each node.  Can you tell me what's going on there and how to fix it?

Thanks!

Rich

[Daniel]

Hello Rich,

I am not sure if I understand correctly the issue. Could you provide a screenshot that demonstrates what you mean by 
the vertical size of the subgrid decreases with each node
At least when I tested the project locally, all Grids had the same height - the one specified with the attributes.
Also, the expressions that you are using for the name:

.Name("IssueTran_#BatchID#_#TransactionID#_#TransactionType#")

will not generate any output but will only execute the code and so the names of the Grids in the different rows will be the same and the widgets will not be initialized correctly. You should use the following expressions instead to generate unique names:

.Name("IssueTran_#=BatchID#_#=TransactionID#_#=TransactionType#")

Regards,
Daniel
Telerik

[Richard]

Hi Daniel!
I see what the problem is.  It's not the vertical height, it's the data wrapping and making it look shorter than it is.  I'll mark this thread answered and will post another question in a new thread.

Thanks for all your help, both you and Petur!