1

Is there any way I can set a kendo ui dropdowns data source to a property of an object? Example.

If I have following object

Person:{ FirstName: 'Nilesh', Gender: 'Male', GenderList:['Male','Female'] }

If I have a form in which I show a text box for the first name and a dropdownlist for the gender, I want to bind the kendo ui dropdownlist to the GenderList Property of the object.

I want to do this in angularjs

Is this even possible? If yes how can we get this to work?

I used following html to render the kendodropdown list.

<input kendo-drop-down-list k-data-source="Person['GenderList']" />

but this does not work.

Any help appreciated.

Nilesh
  • 2,583
  • 5
  • 21
  • 34

1 Answers1

1

I have tested your code and this works for me:

In your controller:

$scope.Person = {
        FirstName: 'Nilesh',
        Gender: 'Male',
        GenderList: ['Male', 'Female']
    }

In your html:

<input kendo-drop-down-list k-data-source="Person['GenderList']" />

The only difference is var Person is declarate into $scope. This is necessary for angular data-binding.

robBerto
  • 196
  • 2
  • 14
  • Hey thanks @robBerto, I found the problem. The form I am rendering is completely dynamic and the GenderList that I was popuplating was in the kendo grid click event. The only thing I had to do is use '$scope.$apply(function(){ ctrl.Person['GenderList'] = ctrl.SampleRow['GenderList'] })`. The `$scope` word in your post took me towards the correct solution. – Nilesh Aug 21 '15 at 10:25