[Solved] Client side selection w/ related grids

[Bruno]

Hello,

I got a "patients" grid that allow selection of a patient that will populate a "sites" grid. In the "Sites" grid, i get the following error message when i try to add a detailsview for the "Sites" grid: "Cannot use only server templates in Ajax or WebService binding mode. Please specify a client template as well."

Once a patient is selected, i basically fill in all the information needed for the "sites" grid in a model. Here is my code:

View: 

@model MvcAppAQPlanif.Models.AQPlanifData

@using MvcAppAQPlanif.Models

 

//---------------------- Patient selection grid

@{Html.Telerik().Grid(Model.PtsList)

     .Name("Patients")

     .Columns(columns =>

     {

         columns.Bound(e => e.pt_IDA)

             .Width(140)

             .Title("# Dossier");

         columns.Bound(e => e.pt_firstname)

             .Width(140)

             .Title("Prénom");

         columns.Bound(e => e.pt_name)

             .Width(140)

             .Title("Nom");

         columns.Bound(e => e.chart_lasteditdttm)

             .Width(140)

             .Format("{0:dd MMMM yyyy}")

             .Title("Date de modif")

             .Visible(false);

     })

      

    .Sortable(sorting => sorting.OrderBy(sortOrder => sortOrder.Add(o=>o.pt_IDA).Ascending()))

    .DataKeys(d => { d.Add(a => a.pt_IDA).RouteKey("SelectedPatientIDA"); })

    .Selectable()

    .ClientEvents(events => events.OnRowSelect("onRowSelected"))

    .RowAction(row =>

    {

        row.Selected = row.DataItem.pt_IDA.Equals(Model.SelectedPatientIDA);

    })

    .Render();

}

 
// ---------------------- Patients Sites Details grid

@{Html.Telerik().Grid(Model.PtSitesData)

    .Name("Sites")

    .Columns(columns =>

    {

        columns.Bound(e => e.site_name)

            .Width(140)

            .Title("Site");

    })

    .ClientEvents(clientEvents => clientEvents.OnDataBinding("patients_onRowDataBinding"))

     

    .DetailView(details => details.Template(

        @<text>

        @(Html.Telerik().Grid(item.PtSiteFldsData)

            .Name("Champs")

            .Columns(columns =>

            {

                columns.Bound(o => o.fld_name).Width(101);

            })

          ) 

        </text>

        ))

 

    .DataBinding(dataBinding => dataBinding.Ajax().Select("_PatientSelection", "MLCGrid", new

    {

        hospitalID = Model.SelectedPatientIDA

    }))

     

    .Pageable()

    .Sortable()

     

    .Render();

     

  }

 

<script type="text/javascript">

    var SelectedPatientIDA;

    function onRowSelected(e) {

        var sitesGrid = $('#Sites').data('tGrid');

        SelectedPatientIDA = e.row.cells[0].innerHTML;

 

        // update ui text

        $('#SelectedPatientIDA').text(SelectedPatientIDA);

 

        // rebind the related grid

        sitesGrid.rebind();

    }

    function patients_onRowDataBinding(e) {

        e.data = $.extend(e.data, { SelectedPatientIDA: SelectedPatientIDA });

    }

    function champs_onRowDataBound(e) {

        var grid = $(this).data('tGrid');

        expandFirstRow(grid, e.row);

    }

</script>

Action called in the controller when a patient is selected:

[GridAction]
        public ActionResult _PatientSelection(AQPlanifData DataModel)
        {
            PatientData GetPtData = new PatientData();
            return View(new GridModel<cPtSiteData>
            {
                Data = GetPtData.GetPatientSitesData(DataModel.SelectedPatientIDA)
            });
        }

Thanks for helping