CODEWITHSUNDEEP
javascriptangularjs
bomortensen
bomortensen

Reputation: 3396

Working with select binding in angularjs

I'm running my head against the wall here trying to bind a pre-defined select box's selected attribute depending on a property on an object.

What I have is a collection of objects: Items and an Item object has the StatusCode property which is either 0, 1 or 2.

On my markup I have the following:

<div ng-repeat="fb in feedbackItems | orderBy: 'Id'">
    <select>
        <option value="0">Some text</option>
        <option value="1">Some other text</option>
        <option value="2">Text 3</option>
    </select>
</div>

What I need is to check if the StatusCode of my fb object is either 0, 1 or 2 and then set the selected="selected" attribute on the right option.

When the client chooses another option, the fb object should be updated aswell.

My controller looks like this:

app.controller('feedbackController', function($scope, feedbackService, $filter) {
// Fields
var takeCount = 20;
var currentNodeId = $('.current-id').text();

// Constructor for this controller
init();

function init() {
    feedbackService.getFeedbackPaged(currentNodeId, 1, takeCount).then(function(response) {
        $scope.feedbackItems = response.data.Items;
        $scope.CurrentPage = response.data.CurrentPage + 1;
        $scope.TotalPages = response.data.TotalPages;
        $scope.TotalFeedbackItems = response.data.TotalItems;
        $scope.FeedbackCount = response.data.Items.length;
    });
}
});

Is there any way of doing this? :-)

Thanks in advance!

Upvotes: 0

Views: 647

Answers (1)

sasonic
sasonic

Reputation: 784

Make sure to put the model on the there. Not sure what your model looks like but based on how I read your question:

<div ng-repeat="fb in feedbackItems | orderBy: 'Id'">
<select data-ng-model="fb.StatusCode"> <!-- here -->
    <option value="0">Some text</option>
    <option value="1">Some other text</option>
    <option value="2">Text 3</option>
</select>

or if feedback items is actually your option list (like jbird said)

<div >
<select data-ng-model="Item.StatusCode" ng-options="fb.id as fb.text for fb in feedbackItems"></select>
</div>

Upvotes: 1

Related Questions