How to set x-editable select box

Question

I am using the x-editable form in my project. everything is working except the default view. It is showing as empty but when I click to edit the field the correct State that is in the database is selected. And the list of all states are available.

<span editable-select="active.ClientState" e-name="ClientState" e-ng-options="s for s in main.states">{{ (states | filter:{value: active.ClientState})[0].text || 'Not set' }}</span> 

Default View

After Edit Button Is clicked

Answer 1

Please upload your code sample for better help.

When you click on text, Angular-xeditable hides that span and add a form at that place. check editable-text value, If this is wrong, it will bind your text to wrong variable.

Check this fiddle

<h4>Angular-xeditable Text (Bootstrap 3)</h4>

<div ng-app="app" ng-controller="Ctrl"> 
     <a href="#" editable-text="user.name1">{{ user.name || 'empty' }}</a><br>
     <a href="#" editable-text="user.name">{{ user.name || 'empty' }}</a>
</div>

In the above example, first anchor having wrong editable-text value so it will retrieve and update to wrong property of scope. For better debugging, try printing your object which holds data.