[Solved] dataItem null OnDetailViewExpand

[Varun]

Hi,
We are using MVC3 Razor and Q1 2012 Telerik MVC.  For some reasons, we are populating the Grid when the page is loaded. Later all the sorting, paging, etc is done using Ajax.

I am trying to move the expand collapse icons to the right of the grid.

For the first page, dataItem is always undefined in DetailViewExpanded. Is there a way to find the dataItem? The only difference is that first page is not ajax bound.

e.MasterRow and e.detailRow points to correct rows and they do have the corresponding HTML.

@(Html.Telerik().Grid<HistoryItemVM>((IEnumerable<HistoryItemVM>)Model.Data)

           .Name("HistoryGrid")

           

            

columns.Bound(r => r.ExpandCollapseColumn)

        .Title(string.Empty)

        .ClientTemplate("<text><a class='t-icon transactionGridPlus' onClick='javascript:History.ExpandCollapse(this);' href='#' /></text>")

        .Template(@<text><a class='t-icon transactionGridPlus' onClick='javascript:History.ExpandCollapse(this);' href='#' /></text>);

 

.DetailView(detailView =>

    {

      detailView.ClientTemplate("<div id='gridDetailsViewSection'></div>");

      detailView.Template(@<text><div id='gridDetailsViewSection'>

      </div></text>);

    }

       )

            

ExpandCollapse: function (e) {

        var grid = $("#HistoryGrid").data("tGrid");

         // get the first master table row

        var masterRow = $(e).closest(".t-master-row");

        // expand the row

        grid.expandRow(masterRow);

    },

 

 DetailViewExpanded: function (e) {

        var grid = $('#HistoryGrid').data("tGrid");

        var dataItem = grid.dataItem(e.masterRow);

         

        if (dataItem) {

            $.ajax({

                url: $("#HistoryDetailsUrl").val(),

                type: "POST",

                data: { transactionId: dataItem.TransactionId },

                success: function (result) {

                    $(e.detailRow).find("#gridDetailsViewSection").html(result);

                },

                error: function (result) {

                    alert(result);

                }

            });

        }

         

        return false;

    }

    

Thanks,
Varun

[Daniel]

Hello Varun,

If the "TransactionId" is bound you could get the value directly from the table cell. Another option is to enable editing in which case the data is serialized on the server and you will be able to use the dataItem method on the row.


Regards,
Daniel
the Telerik team