I was wondering how to set placeholder for drop down list in kendo ui + angular.
Currently I have:
Template
<select kendo-drop-down-list ng-model="selectedElement" k-options="options" >
</select>
Controller
...
$scope.options = {
dataTextField: 'label',
dataValueField: 'id',
dataSource: {
data: [
{
"label": "Please Select..."
},
{
"id": "linear",
"label": "Sample Linear"
},
{
"id": "bar",
"label": "Sample Bar"
}
]
}
};
...
If I replace the datasource by a backend call, I cannot have 'Please Select' there. Is there another way of solving this problem?
I tried using data-option-label="Please Select" following instructions in this link, but no luck.
Well, you can either define it as a data attribute (more information here)
Template
<select kendo-drop-down-list k-option-label="'item1'" ng-model="selectedElement" k-options="options" >
</select>
or set the optionLabel option in the $scope
Controller
...
$scope.options = {
optionLabel: "Item...",
dataTextField: 'label',
dataValueField: 'id',
dataSource: {
data: [
{
"label": "Please Select..."
},
{
"id": "linear",
"label": "Sample Linear"
},
{
"id": "bar",
"label": "Sample Bar"
}
]
}
};
...