ComboBox Initial Value with Angular

2 posts, 0 answers
  1. Christian
    Christian avatar
    31 posts
    Member since:
    Jul 2014

    Posted 06 Feb 2015 Link to this post

    Hello,

    I am really stuck for some hours now...
    Is there any example available how to bind a ComboBox with an initial value to a MVC backend in an Angular frontend?

    I have tried so many ways. Sometimes the ID is displayed instead of the name. Or the ComboBox shows only the placeholder value.

    Here, test.companyId is predefined in the controller with an existing ID.
    <select kendo-combo-box="kendoObject" name="test" ng-model="test.companyId" k-options="companyOptions" />


    Here is my Angular controller:
    $scope.companyDataSource = {
        type: 'aspnetmvc-ajax', // I think I need the DataSourceRequest object for serverside filtering
        serverFiltering: true,
        transport: {
            read: {
                url: '/Company/Autocomplete',
                data: function() { return { id: $scope.test.companyId } } // server needs to know initial value so that it is surely included in the response
            }
        },
        schema: {
            data: "Data",
            total: "Total",
            errors: "Errors",
            model: {
                id: "id",
                fields: {
                    id: { "editable": false, "type": "number" },
                    name: { "type": "string" }
                }
            }
        }
     
    }
     
    $scope.companyDataSourceOld = { // other variant with plain json
        type: 'json',
        serverFiltering: true,
        transport: {
            read: {
                url: '/Company/AutocompleteOld',
                data: function() { return { id: $scope.test.companyId } }
            }
        },
    }

                $scope.companyOptions = {
                    dataTextField: 'name',
                    dataValueVield: 'id',
                    filter: 'contains',
                    placeholder: 'Select company...',
                    dataSource: $scope.companyDataSourceOld,
    }

    The server request is always performed without any errors. The element with the predefined ID is contained in the response.

    when I query kendoObject.value() in the browser console, I get an empty string....

    What am I missing here? hmmm....

    Thank you!
    Chris
  2. Christian
    Christian avatar
    31 posts
    Member since:
    Jul 2014

    Posted 06 Feb 2015 Link to this post

    Stupid me! I had a typo in the options and looked over it all the time
  3. Kendo UI is VS 2017 Ready
Back to Top