Initialising Grid after loading partial view with Ajax

Nov 18, 2014 at 3:43 PM
Hi There,

I'm new with JavaScript and HTML programming so I'm probably making a very basic mistake.

I am loading a partial view onto my page after a ajax call, this works fine but I want to attach an event handler to the onRowSelect event. I can do this normally when the grid is in the main page but it fails when I try and do it in the PartialView.

Having looked around I know I need to initialise my grid as per Bukharin's comment on this thread.


My question is where in the jQuery function do I initialise the grid? I've not been successful in my various attempts at this!

This is my function, I load the partialview containing my grid (FundGrid) into a DIV with ID = FundValuation'
   $(document).ready(function() {
        $('#availablemonths').on('change', function () {
       
            var PID = $('#portfolio').val();
            var MONTH = $('#availablemonths').val();

            $.ajax({
                type: "GET",
                dataType: 'html',
                url: '@Url.Action("GetFundValues", "PortfolioValuation")/',
                data: {
                    PortfolioID: PID,
                    PortfolioValueDate: MONTH
                },
                success: function (data) {
                    $('#FundValuation').html(data);

                    //I THINK THE INIT SHOULD GO HERE? 
                  
                    pageGrids.FundGrid.onRowSelect(function (e) {
                        alert(e.row.FundID);
                    });

                },
                error: function (xhr, ajaxOptions, thrownError) {alert(thrownError);}
                //dataType: 'html',

            });
Nov 20, 2014 at 3:59 PM
You are right. You should be able to place it there.