2016-09-22 2 views
0

중첩 된 편집 가능한 선택 변경 사항을 제출할 때 onaftersave assigned 함수 ('vm.addOperation()')를 호출하지 않고 편집 가능 선택 항목을 다른 안에 중첩 시키거나, 또한 outter editable-select 편집 양식을 보여줍니다.x 편집 가능 중첩 편집 가능 선택 제출하지 않음

중첩 된 편집 양식과 작동 할 함수 호출 만 표시하면됩니다.

내 HTML 코드 : 나는 다음과 같은 코드로 문제를 해결하기 위해 관리했습니다

<div editable-select="vm.selectedUser" 
    e-ng-options="user.objectId as user.displayName for user in vm.users" 
    onshow="vm.getUsers()" 
    onaftersave="vm.addUser()"> 
     <div class="container" ng-repeat="u in entity.authorizedUsers"> 
      <div class="row"> 
       <div class="col-xs-2"> 
       {{u.id}} 
       </div> 
       <div class="col-xs-4"> 
       <div editable-select="vm.selectedOperation" 
         e-ng-options="operation.id as operation.name for operation in vm.operations" 
         onshow="vm.getOperations()" 
         onaftersave="vm.addOperation()"> 
         <div class="container" ng-repeat="op in u.authorizedOperations"> 
          <div class="row"> 
          <div class="col-xs-3"> 
           {{op.name}} 
          </div> 
          <div class="col-xs-push-2"> 
           <button class="btn btn-xs btn-danger" 
             ng-click="vm.removeOperation(entity.id, u.id, op.id)"> 
            <i class="fa fa-trash-o"></i> 
           </button> 
          </div> 
         </div> 
         </div> 
        </div> 
       </div> 
       <div class="col-xs-push-4"> 
       <button class="btn btn-xs btn-warning pull-left" 
         ng-click="vm.removeuser(entity.id, u.id)"> 
        <i class="fa fa-trash-o"></i> 
       </button> 
       </div> 
      </div> 
     </div> 
    </div> 

답변

0

. 그것은 추한 workaround tho, 제발 누군가가 좀 더 우아한 솔루션을 가지고 있다면 나는 그것을 매우 고맙게 생각합니다. HTML에서

:

<div editable-select="vm.selectedOperation" 
     e-form ="nestedForm" 
     onshow="vm.getOperations()" 
     ng-click="nestedForm.$show(); vm.xEditableNestedFormFix(nestedForm); $event.stopPropagation()" 
     e-ng-options="operation.id as operation.name for operation in vm.operations" 
     onaftersave="vm.addOperation()"> 

JS에서 :

vm.xEditableNestedFormFix = function (form) { 
    var editorElement = form.$editables[0].controlsEl[0].firstChild; 
    editorElement.onclick = function (event) { 
     event.stopPropagation(); 
    } 
    var submitButton = form.$editables[0].buttonsEl[0].firstChild 
    submitButton.onclick = function (event) { 
     form.$submit(); 
     event.stopPropagation(); 
    } 
    var cancelButton = form.$editables[0].buttonsEl[0].lastChild 
    cancelButton.onclick = function (event) { 
     event.stopPropagation(); 
    } 
}