 <p><strong>To display text instead of ID from dropdown list</strong>:</p> <p>You can create a function in the directive that loops through the options, and returns the <code>name</code> when the <code>id</code> matches the value you're binding on. For example:</p> <pre><code>scope.statusText = function(){ var text = ''; angular.forEach(scope.statusOptions, function(item){ if(item.id == scope.task.status) text = item.name; }); return text; } </code></pre> <p><strong>To auto-focus the element</strong></p> <p>Create a function in the directive that is called on the <code>ng-click</code> of the "display" span. This will set <code>scope.editStatusMode = true</code>, then call <code>.focus</code> on the element.</p> <pre><code>scope.setStatusFocus = function(){ scope.editStatusMode = true; var el = element.find('select'); $timeout(function(){ el.focus(); }); }; </code></pre> <p>Wrapping the <code>el.focus()</code> in <code>$timeout</code> will delay the call to focus until the DOM is done rendering. The HTML looks like this:</p> <pre><code>&lt;span ng-hide="editStatusMode" ng-click="setStatusFocus()" ng-bind="statusText()"&gt;&lt;/span&gt; </code></pre> <p><strong>How do you know which object you're updating</strong></p> <p>Create an <code>update()</code> function in the directive that is bound to 'ng-blur<code>. In that function, you can access</code>scope.task`, which you can send off to your server to save. </p> <pre><code>scope.update = function(){ scope.editPriorityMode = false; //Save scope.task here. console.log(scope.task); } </code></pre> <p>This works for <code>description</code> and <code>priority</code>. It doesn't work for <code>status</code> because when you change the status, it immediately disappears from whichever list it is in and is added to a different list, and the <code>blur</code> event is never fired. To deal with <code>status</code>, you can create a <code>$watch</code> on <code>task.status</code>, and call the <code>update()</code> function from there.</p> <pre><code>scope.$watch('task.status', function(oldValue, newValue){ scope.update(); }) </code></pre> <p><a href="http://plnkr.co/edit/MBwAUkPZvYUhDAVW7KZN?p=preview" rel="nofollow">Plunker</a></p>