[Solved] Telerik Grid error on click of Edit - null or not an object

[Bill]

    
I get a JScript error when I click on the Edit button of my Telerik Grid. 

My Grid is wrapped in a partial view and works fine when that partial view is 
rendered on an ASPX page (view). However, if I render it in another partial view I get a jscript error like 
the one below.
OK:    MASTER PAGE --> ASPX --> ASCX2 (WITH GRID)
ERROR: MASTER PAGE --> ASPX --> ASCX1 (OTHER STUFF) --> ASCX2 (WITH GRID)



Microsoft JScript runtime error: 'bid' is null or not an object. 





function anonymous(data) {

return data.bid;

}



function anonymous(data) {

var value = data.bdatetime; if (!value) return null; return value instanceof Date? value : new Date(parseInt(value.replace(/\/Date\((.*?)\)\//, "$1")));

}



function anonymous(data) {

return data.bname;

}

[Bill]

I read this article http://www.telerik.com/help/aspnet-mvc/using-with-partial-views-loaded-via-ajax.html
andand tried both the Microsoft MVC and the JQuery method of loading the Partial View that has the Grid. I still 
get some sort of JScript error and also the same when I tried via RendorAction.






<% Html.RenderAction("Index_BargeLog", "BargeLog", new { BargeId = item.BargeId }); %>

<script type="text/javascript"> 
    //Populate the contents of the placeholder with the result returned by the action method HomeController.PartialGrid
    $('#result').load('<%= Url.Action("Index_BargeLog", "BargeLog", new { BargeId = 23}) %>');
 
</script>


It appears that the issue occurs when you make the Grid editable. 
  col.Command(cmd => cmd.Edit());


If I remove the line that makes the Grid editable, the Grid loads fine and the refresh button on the Grid

works. 

<% Html.Telerik().Grid<LABunkerSMS_WebRole.ViewModels.BargeLogViewModel>(Model)
        .Name("frmBargeLog")
         .DataBinding(dataBinding => dataBinding
            .Ajax()
                .Select("AjaxIndex_BargeLog", "BargeLog", new { BargeId = ViewData["BargeId"] })
                .Update("Edit_BargeLog", "BargeLog", new { BargeId = ViewData["BargeId"] }))
   .DataKeys(keys =>
            {
                keys.Add(c => c.BargeLogId);
            })
        .Columns(col =>
        {
            col.Bound(bat => bat.BargeLogId).Title("Barge Log ID").ReadOnly(true);
            col.Bound(bat => bat.BargeActivityName).Title("Activity").ReadOnly(true);
            col.Bound(bat => bat.BargeActivityDateTime).Title("Date & Time");            
            col.Command(cmd => cmd.Edit());
        })        
        .Render();         
%>

          $().load(); 

[Bill]

I went through all the online documentation carefully,. It looks like there's a problem with an editable grid and nexted partial views.
So for example.
ASPX --> PARTIAL VIEW 1 --> PARTIAL VIEW 2. I'm also using ViewModels to get around the circular reference issue but not sure if that's causing the problem.

the JSCRIPT debug says the object, "data" is undefined. Anyone know where the code below is being generated from?

function anonymous(data) {
return data.BargeLogId;
}

function anonymous(data) {
var value = data.BargeActivityDateTime; if (!value) return null; return value instanceof Date? value : new Date(parseInt(value.replace(/\/Date\((.*?)\)\//, "$1")));
}

[Atanas Korchev]

Hello Bill,

 This code is generated by the grid to get the value of the bound column. I will need a sample project which reproduces the problem you are describing.

Regards,
Atanas Korchev
the Telerik team

[Bill]

I'm glad I didn't give up on this. I finally got it resolved. I went back to basics and tried to get my Grid in the partial view to work based on this article.
http://www.telerik.com/help/aspnet-mvc/using-with-partial-views

Then I slowly modified that example to fit my actualy requirements. Here's what I found.

You pretty much have to get the ScriptRegstrar() right when you using partial views.

<% Html.Telerik().ScriptRegistrar()
        .DefaultGroup(group => group
        .Add("telerik.common.min.js")
        .Add("telerik.grid.min.js")
        .Add("telerik.grid.grouping.min.js")
        .Add("telerik.grid.filtering.min.js")
        .Add("jquery.validate.min.js")  
        .Add("telerik.draganddrop.min.js")
        .Add("telerik.grid.editing.min.js")
        .Add("telerik.window.min.js ")         
       )
       .jQuery(false)
       .Render(); %>

Now I'm able to get next my Grid at more than 1 level of partial views. 

[Ganesh Jagdale]

Hi All,
      I am having the same issue about grid in partial view. If any solution is found then please let me know..

@   Bill : I am using Razor syntax. As you say using  ScriptRegstrar() it can be solved. Can u please give me more info as 
 http://www.telerik.com/help/aspnet-mvc/using-with-partial-views 
this links is no longer valid now.


Please help me out.

Thanks,
Ganesh