I need to create a dropdownlist in my custom edit view. This is what I've done so far, and shows all the inputs except the dropdownlist

<!--Edit template-->
<script type="text/x-kendo-template" id="editNominationsTmpl">
    <div id="editContainer">
        <table>
            <thead>
                <tr>
                    <td></td>
                    <th>Nominee</th>
                    <th>Nominator</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>Name:</th>
                    <td><input type="text" class="k-input k-textbox" name="NominatedName" value=" #= NominatedName # " /></td>
                    <td><input type="text" class="k-input k-textbox" name="NominatorName" value=" #= NominatorName # " /> </td>
                </tr>
                <tr>
                    <th>Job Title:</th>
                    <td><input type="text" class="k-input k-textbox" name="NominatedTitle" value=" #= NominatedTitle # " /></td>
                    <td><input type="text" class="k-input k-textbox" name="NominatorTitle" value=" #= NominatorTitle # " /> </td>
                </tr>
                <tr>
                    <th>Department:</th>
                    <td>
                        <input id="dropdownlistNominee" name="DeptId" />
                    </td>
                    <td><input type="text" class="k-input k-textbox" name="NominatorDept" value=" #= NominatorDept # " /></td>
                </tr>
                <tr>
                    <th>Email:</th>
                    <td>
                        <input type="hidden" name="Index" value=" #= NominatedIndex # " />
                        <input type="hidden" name="RequestInfoID" value="#= NominatorIndex # " />
                    </td>
                    <td><input type="email" class="k-input k-textbox" name="NominatorEmail" value=" #= NominatorEmail # " /></td>
                </tr>
            </tbody>
        </table>
        <div class="edit-buttons">
            <a class="k-button k-button-icontext k-update-button" href="\\#"><span class="k-icon k-update"></span>Save</a>
            <a class="k-button k-button-icontext k-cancel-button" href="\\#"><span class="k-icon k-cancel"></span>Cancel</a>
        </div>
    </div>
</script>

//Creates a global object called templateLoader with a single method "loadExtTemplate"
var templateLoader = (function ($, host)
{
    //Loads external templates from path and injects in to page DOM
    return {
        //Method: loadExtTemplate
        //Params: (string) path: the relative path to a file that contains template definition(s)
        //Params: (int) index: user index
        loadExtTemplate: function (path, fileName, index)
        {
            //Use jQuery Ajax to fetch the template file
            $.get(path, { name: fileName },
                function (result) {
                    console.log(result);
                    $(host.body).append(result);
                    console.log($(host.body).html());
                })
                .done(function (data)
                {
                    $(host).trigger("TEMPLATE_LOADED", [path , index]);
                    console.log("Published an event that indicates when a template is done loading");
                });
        }
    };
})(jQuery, document);

// waits until the template is fully loaded
        $(document).bind("TEMPLATE_LOADED", function (e, path, index)
        {
            // send to create the dropdownlist
            createDropdownList(index);

            var wnd = $("#nominationsEdit").data("kendoWindow");
            console.log(wnd);

            var templateContent = $("#editNominationsTmpl").html();
            console.log(templateContent);

            var editTemplate = kendo.template(templateContent);
            console.log(editTemplate);

            $.get("/Admin/GetEditNominations",
                {
                    index: index
                },
                function (data) {
                    console.log(data);
                    //dataTemplate = data;
                    //dataDropwDown = loadDropdownListInfo();
                },
                "json")
                .done(function (data)
                {
                    console.log("success getting the information... now create the dropdaownlist");

                    // populate the template with the information
                    var result = kendo.render(editTemplate, data);

                    // set the default value the dropdownlist will show
                    // $("#dropdownlistNominee").kendoDropDownList().index(data.DeptID);

                    // append the information to the new window
                    wnd.content(result);

                    // show the window
                    wnd.center().open();
                });
        });

function createDropdownList(index)
{
    //create the dropdownlist
    $("#dropdownlistNominee").kendoDropDownList(
        {
            dataTextField: "DeptName",
            dataValueField: "DeptID",
            dataValueField: index,
            dataSource:
                {
                    transport:
                        {
                            read:
                                {
                                    url: "/Admin/GetDeptInfo"
                                }
                        }
                }
        });
}

with this code the custom edit window shows all the inputs information, except the dropdownlist this input, that it shows empty.

What I'm missing?

thanks in advance.

Hi

We have a client requirement to display a graph as per the example attached. We recommended Kendo UI as a platform now we need some assistance to implement this. Has anyone done something like this? My initial thoughts was to combine a line chart with an area chart but was unable to get this working as per the example. (The example was done in excel 2007)

Thanks for the assistance

Hi.

I have a Devcraft UI subscription and would like to have access the server wrappers and the kendo complete options.  Do I need to buy a new $999 license for that?

regards,
Olafur

When I create the items in the panelbar, I am passing in an id like this:

panelbar.append({text:m.text, id:m.id});

I need a way to get this id back when an item is selected, but I can't figure out how to do it.

Getting just the text isn't sufficient.

Thanks,
Adam

I can't seem to initialize the chart's seriesDefaults.type property by using data attributes:

data-series-defaults-type="line"

Should this work, or am I doing something wrong?

I have a grid that has worked perfectly fine for nearly a year now, however when I updated to the latest kendo release it has started generating an error when trying to sort by any of the columns.

It's generating the following error
Invalid property or field - 'undefined' for type: worldStatsItem

Where worldStatsItem is the type of item used in the grid.

I'm using teh MVC bindings for this and the code for the grid is below.

Hi

I have an EditorTemplate which contains a Kendo DropdownList as below and the editortemplate is called inside one of my kendo UI grid’s column.


In my data I have “#” which cause having Invalid Template error.

I checked the below link which explains we have to escape the “#” by using “\\#” in JavaScript and “\#” in Html Script:

http://docs.telerik.com/kendo-ui/getting-started/framework/templates/overview

 
I replaced the “#” in server side to “\\#” then the template was created without any issue but when I click on dropdown to select an item the text contains “\\#” .

How can I escape the “#” in above code without making any changes on server side.

Thanks.

Hi,

I have struggled for hours to change the sparkline height, with the latest commercial version of Kendo UI Complete v.2014.1.318.

I have poured through the demos and forums and the references to setting line-height inline; none of these solutions work!  I have since found a solution, that is  font-size, if you set the font-size to the desired height the sparkline indeed takes the correct height.  Hopefully this saves someone else wasting hours!  Is this a bug or the intended method of setting the height of a sparkline?


Regards,
Nomdeplume

I'm looking out for a ListView with following features:

1. Search Option
2. Endless Scroll
3. Fixed Headers ( using groups )
4. Pull To Refresh

All 4 features doesn't work together. For eg, The FixedHeader doesn't seems to work in combination with Endless Scroll and Pull to refresh. Also the search option never works. Also the "sort" option never works.

Below is my code which I'm calling on data-init of my View.

function loadContactListView(){ 
  
    var dataSource = new kendo.data.DataSource({
           
        transport: {
            read: function(options){
                app.db.transaction(function (tx){
                   
                    if(localStorage.getItem('userCompany')){
                        fetchQuery = "SELECT FirstName , ImageFilePath, Company, Mobile_Number, id from employee_db WHERE Company = '"+localStorage.getItem('userCompany')+"'";
                    }else{
                        fetchQuery = "SELECT FirstName, ImageFilePath, Company, Mobile_Number, id from employee_db";
                    }
                    
                    tx.executeSql(fetchQuery, [], function (tx, result) {
                        var data = [];
                        for (var i = 0; i < result.rows.length; i++) {
                            data[i] = result.rows.item(i);
                            
                        }
                        options.success(data);
                    });
                });
            }
        },
        sort: {
            field: "FirstName",
            dir: "desc"
        },      
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true,
        pageSize: 50,
        group: "Company"
    });    
   
    $("#filterable-listview").kendoMobileListView({
        dataSource: dataSource,
        template: $("#mobile-listview-filtering-template").html(),
        
        fixedHeaders: false,
        
        filterable: {
            field: "FirstName",
            operator: "startswith"
        },
        pulltorefresh: true,
        endlessScroll: true
    });   
     
}

Since Q1 2014 my views haven't been rendering properly.  If I don't have a single tag wrapping the entire template, the view is renders each element in the template with a wrapped div.  I've prepared a sample with two different views.  One is wrapped with a single div element and the other has multiple root elements.  After they are rendered you can look at the html and see that the unwrapped view has a new div around each root element in the template (see attached screen shot).  The sample can be run here: http://jsfiddle.net/9DF9k/

Thanks in advance!