JS error : Unable to get value of the property 'getByUid': object is null or undefined

6 posts, 1 answers
  1. Roland Koops
    Roland Koops avatar
    3 posts
    Member since:
    Aug 2007

    Posted 06 Feb 2012 Link to this post


    I have a list view (#menuList). As soon as i configure a datasource including a schema, i get the following js error when i click an item:
    Unable to get value of the property 'getByUid': object is null or undefined

    My page:
    <!DOCTYPE html>
    <head>
        <title>Compano Online Software</title>
     
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
        <script src="http://cdn.kendostatic.com/2012.1.124/js/kendo.all.min.js" type="text/javascript"></script>
        <script src="http://cdn.kendostatic.com/2012.1.124/js/kendo.mobile.min.js" type="text/javascript"></script>
     
        <link href="/styles/kendo.common.min.css" rel="stylesheet" />
        <link href="/styles/kendo.mobile.all.min.css" rel="stylesheet" />
     
        <script type="text/javascript">
            var vn = "prd.item";
            var tm = "<b>${SalesOrganizationShortDescription} ${Code}</b>-<b>${Description}</b><br/>€ ${PurchasePricePerUtilizationUnit}";
     
            function onError(e)
            {
            }
     
            function menuClick(e) {
                vn = e.dataItem.ViewName;
                tm = e.dataItem.Template;
                var list = $("#list").data("kendoMobileListView");
                if (list)
                    list._refresh();
            }
     
            function initList() {
                    $("#list").kendoMobileListView({
                        dataSource: {
                            transport: {
                                read: {
                                    type: "POST",
                                    url: "/dv.ashx",
                                    data: { vn: vn },
                                    dataType: "json"
                                }
                            },
                            serverPaging: true,
                            serverSorting: true,
                            pageSize: 20,
                            schema: {
                                data: "d",
                                total: "count"
                            },
                            error: onError
                        },
                        template: tm
                    });
                }
     
                $(document).ready(function () {
                    var app = new kendo.mobile.Application(document.body);
     
                    $("#menuList").kendoMobileListView({
                        dataSource: {
                            transport: {
                                read: {
                                    type: "POST",
                                    url: "/webservices/mobile.asmx/GetMenuList",
                                    contentType: "application/json; charset=utf-8",
                                    data: {},
                                    dataType: "json"
                                }
                            },
     
                            schema: {
                                data: "d",
                                model: {
                                    fields: {
                                        __type: { type: "string" },
                                        ViewName: { type: "string" },
                                        Description: { type: "string" },
                                        Template: { type: "string" }
                                    }
                                }
                            }
                        },
     
                        template: "<a href='tabstrip-grid'>${Description}</a>",
                        click: menuClick
                    });
                });
        </script>
    </head>
    <body>
        <div data-role="view" id="tabstrip-home" data-title="Home" data-layout="mobile-tabstrip">
            <ul data-style="inset" id="menuList" ></ul>
        </div>
     
        <div data-role="view" id="tabstrip-grid" data-title="Overzicht" data-init="initList" data-layout="mobile-tabstrip">
            <div id="list"></div>
        </div>
        <div data-role="layout" data-id="mobile-tabstrip">
            <header data-role="header">
                <div data-role="navbar">
                    <a class="nav-button" data-align="left" data-role="backbutton">Back</a>
                    <span data-role="view-title"></span>
                    <a data-align="right" data-role="button" class="nav-button" href="#index">Index</a>
                </div>
            </header>
            <div data-role="footer">
                <div data-role="tabstrip">
                    <a href="#tabstrip-home" data-icon="home">Home</a>
                    <a href="#tabstrip-grid" data-icon="favorites">Overzicht</a>
                    <a href="#tabstrip-detail" data-icon="favorites">Details</a>
                </div>
            </div>
        </div>
    </body>
    </html>
  2. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 07 Feb 2012 Link to this post

    Hi,

    Unfortunately, I am unable to reproduce the problem without the data returned from your server. Is it possible for you to provide a public url, or perhaps a jsFiddle, where we can reproduce that?

    Kind regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Roland Koops
    Roland Koops avatar
    3 posts
    Member since:
    Aug 2007

    Posted 07 Feb 2012 Link to this post

    I will publish a public test page tomorrow.
  5. Roland Koops
    Roland Koops avatar
    3 posts
    Member since:
    Aug 2007

    Posted 08 Feb 2012 Link to this post

    I have published a test page:

    http://ttt.online.compano.nl/pages/mobile.htm

    If you click on a listview item in the opening screen (home), a js error occurs.
  6. Answer
    Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 08 Feb 2012 Link to this post

    Hello,

    Thanks, I reproduced the problem. Unfortunately, I was not able to modify the page on my side, due to the web service references, so I am not certain if the provided solution will work.

    The problem is that the menuList ListView is initialized in the document.ready event. After that, the mobile application view re-initializes it, and removes its datasource.

    Although technically correct, this behavior may be misleading - so we are going to prevent secondary widget initialization for the final release.

    Can you please try moving the menuList initialization in the view init method? In the other thread, I gave some examples for that. 
     
    Greetings,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Roland Koops
    Roland Koops avatar
    3 posts
    Member since:
    Aug 2007

    Posted 08 Feb 2012 Link to this post

    I have moved the initialisation from document ready to view init.  It works now.

    Great
Back to Top
Kendo UI is VS 2017 Ready