headerTemplate: my header template is not showing

2 posts, 0 answers
  1. Richard
    Richard avatar
    5 posts
    Member since:
    Dec 2013

    Posted 24 Jan 2014 Link to this post

    We have a kendoAutoComplete field where we need the autocomplete list to have column titles at the top.  The AutoComplete documentation describes as headerTemplate property that take a string or a function.

    I am assigning html to the headerTemplate property.  But it does not appear with the autocomplete list.  Nor are the header items present when I search the DOM for those header items.

    The headerTemplate is our only issue with autoComplete.  Please let us know how we can fix or at least work around this issue.

    Code...

                    $this.kendoAutoComplete({
                        placeholder: settings.placeholder,
                        minLength: settings.minLength,
                        dataSource: settings.dataSource,
                        dataTextField: settings.dataTextField,
                        delay: settings.delay,
                        height: settings.listHeight,
                        highlightFirst: settings.highlightFirst,
                        select: function (e) {
                            //console.log("autocomplete select");
                            if (settings.onSelect)
                                settings.onSelect(this.dataItem(e.item.index()));
                        },
                        close: function(e) {
                            if (settings.onClose)
                                settings.onClose(e);
                        },
                        dataBound: function(e) {
                            if (settings.onDataBound)
                                settings.onDataBound(e);
                        },
                        open: function (e) {
                            if (settings.onOpen)
                                settings.onOpen(e);
                        },
                        template: settings.contentTemplate,
                        headerTemplate: settings.headerTemplate
                    });
    Suffice to say, I am confident that the value of settings.headerTemplate is valid html 

    Thanks,
    Rod Early
    McKesson, Inc.
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 28 Jan 2014 Link to this post

    Hello Richard,

    I am afraid that the provided information is not sufficient enough in order to determine where exactly the problem comes from. I prepared a small sample where the headerTemplate is working as expected. Could you please check it and let me know what I am missing?

    In addition which version of the framework you are using? Does the problem occurs only in a specific browser?

    Regards,
    Alexander Valchev
    Telerik
    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
Back to Top