I need to filter the countries that are already selected. I have written the code from the below link.

When i defined the datasource dynamically i am not getting the records.

var countriesDS = new kendo.data.DataSource({
    transport: {
        read: {
            url : "/Home/Countries",
            type: "POST",

            dataType: "json"
        }
    },
    schema: {
        model: {
            id: "id",
            fields: {
                id  : { type: "id" },
                name: { type: "string" }
            }
        }
    }
});

Then i will able to redirect to that action method and retrieve the values but in autoplete i am not getting records. Any help is appreciated

I need to filter the countries that are already selected. I have written the code from the below link.
http://jsbin./oqucix/4

When i defined the datasource dynamically i am not getting the records.

var countriesDS = new kendo.data.DataSource({
    transport: {
        read: {
            url : "/Home/Countries",
            type: "POST",

            dataType: "json"
        }
    },
    schema: {
        model: {
            id: "id",
            fields: {
                id  : { type: "id" },
                name: { type: "string" }
            }
        }
    }
});

Then i will able to redirect to that action method and retrieve the values but in autoplete i am not getting records. Any help is appreciated

• javascript
• jquery
• asp-mvc-3
• kendo-ui

• Your jsFiddle works for me. It I type in "tur" then I get Turkey as an option. If I select Turkey, so the text box now contains "Turkey, " and I type in "tur" again, this time I don't get Turkey in the autoplete options. What is the problem? – CodingWithSpike Commented Dec 19, 2012 at 13:02
• How does look like the JSON that you are serving with /Home/Countries. I'm afraid that the problem is that id does not contain an array of elements containing id and name. – OnaBai Commented Dec 19, 2012 at 13:10
• @EmilianoBartolome yes may be that's the problem. How can i resolve that – Jonathan Commented Dec 19, 2012 at 13:17

1 Answer 1

This is the DataSource and AutoComplete definition:

// create a datasource bound to the local data
var countriesDS = new kendo.data.DataSource({
    transport: {
        read: {
            url     : "/Home/Countries",
            type    : "POST",
            dataType: "json"
        }
    },
    schema   : {
        model: {
            id    : "id",
            fields: {
                id  : { type: "id" },
                name: { type: "string" }
            }
        }
    }
});

var autoComplete = $("#auto").kendoAutoComplete({
    minLength      : 3,
    separator      : ", ",
    dataSource     : countriesDS,
    serverFiltering: true,
    dataTextField  : "name"
}).data("kendoAutoComplete");

and this is how Countries list should be returned by the server.

[
    { "id":1, "name":"Albania" },
    { "id":2, "name":"Andorra" },
    { "id":3, "name":"Armenia" },
    { "id":4, "name":"Austria" },
    { "id":5, "name":"Azerbaijan" },
    ...
]