This is a migrated thread and some comments may be shown as answers.

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

1 Answer 180 Views
DropDownList
This is a migrated thread and some comments may be shown as answers.
Gabriel
Top achievements
Rank 1
Gabriel asked on 18 May 2014, 08:58 PM
Hello,

This error is happening quite frequently across all three browsers on a ASP.NET MVC Kendo Grid we use. I attempted to wrap any javascript functions we wrote that interact with the kendo controls in document ready but it did not make any difference. Sample code is below:

@Html.HiddenFor(m => m.CustomerTypesQuery)
                @(Html.Kendo().Grid<SelectListItem>()
                        .Name("CustomerTypes")
                        .HtmlAttributes(new { style = "width: 100%; height: 165px;" })
                        .Columns(columns =>
                                        {
                                            columns.Bound(p => p.Value).Hidden();
                                            columns.Bound(p => p.Text).Title("Customers");
                                        })
                        .Scrollable()
                        .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
                        .DataSource(dataSource => dataSource
                                                              .Ajax()
                                                              .Read(read => read.Action("ReadCustomerTypes", "Search"))
                                                              .Model(m => m.Id(p => p.Value))
                      )
                        .Events(events => events.Change("CustomerTypesChange").DataBound("CustomerTypesDataBound"))
                )

                <script type="text/javascript">
                    function CustomerTypesChange() {
                        var grid = $('#CustomerTypes').data('kendoGrid');
                        var rows = grid.select();
                        $('#CustomerTypesQuery').val('');
                        rows.each(
                            function () {
                                var record = grid.dataItem($(this));
                                $('#CustomerTypesQuery').val($('#CustomerTypesQuery').val() + record.Value + ",");

                            }
                        );
                        $('#CustomerTypesQuery').val($('#CustomerTypesQuery').val().replace(/,$/, ''));
                         //posts a form to the server
                         submitAjaxForm();
                    }

                    function CustomerTypesDataBound() {
                        filterHiddenFieldDataBound.call(this, 'CustomerTypesQuery');
                    }

        //wrapping any fo these interactions wit document ready does not help
        var filterHiddenFieldDataBound = function(hiddenfield) {
        var hiddenfieldId = '#' + hiddenfield;
        var grid = this;
        var dataSource = this.dataSource;
        var matchedItems = new Array();
        var value = $(hiddenfieldId).val();
        if (value) {
            $.each(value.split(','), function() {
                var item = dataSource.get(this);
                if (item) {
                    var row = grid.tbody.find('[data-uid=' + item.uid + ']');
                    row.addClass('k-state-selected');
                    matchedItems.push(this);
                }
            });
            $(hiddenfieldId).val(matchedItems.toString());
        }
    };
 </script>

I attempted to wrap functions that called the .value() method of kendo in document ready as per http://www.telerik.com/forums/cannot-call-method-%27value%27-of-kendodropdownlist-before-it-is-initialised-error#dhl__nLrG0GvjpwmSeI5PQ but this did not help
We are using kendo version 2014.1.318 but even attempting to upgrade to  2014.1.416 did not fix this issue. I know this is a kendo grid example but the error is being thrown on the kendo drop down list component of the kendo library so I thought this section would be appropriate.

1 Answer, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 21 May 2014, 07:32 AM
Hello Gabriel,

Thank you for the code snippet. Unfortunately, it is not very clear what is causing the error and when it actually happens. As my colleague pointed out in the aforementioned forum thread, we will need a runnable test project, which demonstrates the issue.
As a side note, I will ask to continue the discussion in only one thread to avoid duplication. Thank you for your understanding.

Regards,
Georgi Krustev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
DropDownList
Asked by
Gabriel
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Share this question
or