2017-07-19 12 views
0

角度ui-gridを初めて使用しました。角度UIグリッドのドロップダウンで変更がキャプチャされていません

インライン編集用のドロップダウンボックスを実装したいのですが、このチュートリアル(性別の列)に従います:http://ui-grid.info/docs/#/tutorial/201_editableと、代わりにデータベースからオプションを設定したいので、新しいcshtmlページを使用して変更しましたオプションを手動で入力します。私は、ドロップダウンボックスを実装どこ

以下のコードは次のとおりです。

name: app.localize('Roles'), 
field: 'getRoleNames()', 
minWidth: 160, 
editableCellTemplate: '~/App/common/views/users/roleDropDownList.cshtml' 

そして、ここではroleDropDownList.cshtml

<div ng-controller="common.views.users.index as vm"> 
    <select> 
     <option ng-repeat="role in vm.roles">{{role.displayName}}</option> 
    </select> 
</div> 

のコードである今、私はオプションを選択することができるよ、それは同様です1つのオプションを選択したときに変更をキャプチャしません。ここで

は一例です: DropDown sample

あなたが画像で見ることができるように、赤色の行は、汚れて行(編集済み)だ意味が、私はドロップダウンリストで編集した行が赤い色ではありませんが、それはです意味します編集されておらず、保存できません。

答えて

1

私が望むものをより簡単に実装する方法を見つけました。

name: app.localize('Roles'), 
field: 'getRoleNames()', 
minWidth: 160 
editableCellTemplate: 'ui-grid/dropdownEditor', 
editDropdownValueLabel: 'displayName', 
editDropdownIdLabel: 'displayName' 

editDropdownValueLabelが、それ以外の場合は画像として表示「未定義」と

Example of dropdown undefined options

editDropdownIdLabel下に表示されるオプションの値を設定することであるそうでなければ選択されたオプションの値を、それがあろう表示します下記の画像のようにIDを表示する

Showed Id

以下のコードはデータベースからデータを取得することです:

vm.userGridOptions.columnDefs[3].editDropdownOptionsArray = result.data.items; 
関連する問題