Search code examples
angularjsng-options

Accessing text of selected drop-down list option using AngularJS

This should so be so very, very simple, but I can't seem to find a straight-forward answer.

I have a drop-down list that I'm populating like this:

<select ng-model="SelectedItem.RegulationId" id="ddlRegulation" name="ddlRegulation" ng-options="reg.Id as reg.Title for reg in Regulations"></select>

Now, all I want to do, in the save() function I've set up (which has access to $scope, BTW), is simply display for the user the text of the option they chose.

Something like:

alert($scope.SelectedItem.Regulations.Title);

Or

alert($scope.ddlRegulation.text());

I just don't know enough about AngularJS to know where I should be looking for this property. I suppose I could just import the jQuery library and do it that way, but I suspect there's an easy way to do this with AngularJS that I just don't know about yet.

Solution

  • Use object as model, not id (And remove crap name and id):

    <select ng-model="SelectedItem.Regulation" ng-options="reg as reg.Title for reg in Regulations"></select>

    http://plnkr.co/edit/kBbfJgi3ysNptskniyXA