Cannot call method 'value' of kendoDropDownList before it is initialised error

[Saj]

Hi,

I am using the cascading combo box in a very similar way to the MVC demo on the demos page. I currently have 6 combo boxes cascaded together in the same page. Occasionally I am getting the exception below, I assume this is because the page isn't fully loaded and the user has tried to interact with the page, therefore causing the combo to attempt to submit an AJAX request to get it's data.

    Microsoft JScript runtime error: Cannot call method 'value' of kendoDropDownList before it is initialized

Is there a correct way of checking whether Kendo controls are fully initialised ? If not how can I catch this exception ?

[Petur Subev]

Hello Martin,

We are not really sure what's the logic behind that error.

Basically when using the Html Helper extensions of MVC and you want to make sure that the widget is initialized you need to execute your code inside a document ready handler attached after the code for the widget.

For example:

@(Html.Kendo().SomeWidget().Name("Foo")...)

<script>
      $(function(){
             alert('Foo should be initialized and accessible at this point!');
      })
</script>

I hope this helps.

Kind Regards,
Petur Subev
Telerik

[Gabriel]

This seems to be a bug within Kendo not developer code, I attempted to wrap all client side interactions with the kendo control with document ready and still have this exact error occurring. Confirmed this happens in all three browsers.

[Petur Subev]

Hello Martin,

Could you please demonstrate your case with a small demo, so we can see exactly what is going wrong. You are the first one to experience such issue. Make sure you check the troubleshooting cases before that:

http://docs.telerik.com/kendo-ui/getting-started/troubleshooting

Regards,
Petur Subev
Telerik

 

 

[Vidya]

Did anybody ever found any solution for that "Cannot call method 'value' of kendoDropDownList before it is initialized" exception, because I am getting the exact same error when trying to load a KendoGrid in a Div?

[Petur Subev]

Hello Vidya,

This is a common exception which might be caused by several reasons all covered in our troubleshooting section:

http://docs.telerik.com/kendo-ui/troubleshooting

Kind Regards,
Petur Subev
Telerik

 

 

[Manish]

Hi Vidya,

I faced the same issue, and yes there is a fix for it, basically you just need to destroy the grid before your redirect...

The best way to tackle this is by using "resolve" in $routeProvider

$routeProvider.when('/' + nPageData.id, {
                        controller: nPageData.id + "Controller",
                        template: vm.getPageHTML(nPageData),
                        resolve:{
                            "kendogridfix":function($location){
                                angular.element("[kendo-grid]").each(function(idx,kGrid){
                                    var dataObj=angular.element(kGrid).data();
                                    for(mData in dataObj)
                                    {
                                        if(angular.isObject(dataObj[mData]))
                                        {
                                            if("destroy" in dataObj[mData])
                                            {
                                                dataObj[mData].destroy();
                                            }
                                        }
                                    }
                                })
                            }
                        }
                    });

 

Hope this helps...

[Gord]

Manish,

I have a few questions about the solution you provided:

Where would this be implemented?  In the appModule.config({}) call?  Or does it need to be implemented on every page that uses a grid?  What provider are you using to get the nPageData object?

[Judd]

so have an issue were i was trying to save options of my grid.  but, a known issue from what i gather, you can't save the toolbar.  so i added back as follows.  

I mention because without the delay i get the same error reported here.  so wondering if this may help your cause.  good luck.  i really need to find method to report done rather than a timer..  

 

  setTimeout(function () {                    
                    $("#OrderHistoryGrid").empty().kendoGrid(options).find(".k-grid-toolbar").html(toolbar);// reset toolbar? seems we were dropping the export button. 
                }, 3000);