2016-01-02 92 views
0

我正在使用angular with Datatables,我正在嘗試使用Xeditable編輯一行,我的問題是沒有xeditables元素,跨度沒有變成可編輯範圍。Datatables + angular.js + xeditable不能正常工作

這裏是我的代碼:

<div class="dataTables_wrapper"> 
     <table datatable="ng" class="table table-bordered table-hover dataTable" role="grid"> 
     <thead> 
     <tr> 
      <th>{{texts.fullName}}</th> 
      <th>{{texts.title}}</th> 
      <th>{{texts.email}}</th> 
      <th>edit</th> 
     </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="contact in contacts track by $index"> 
      <td> 
       {{contact.fullName}} 
      </td> 
      <td> 
       {{contact.title}} 
      </td> 
      <td> 
       <span editable-text="contact.email" e-name="email" e-form="rowform"> 
       {{ contact.email || 'empty' }} 
       </span> 
      </td> 
      <td> 
       <!-- form --> 
    <form editable-form name="rowform" onbeforesave="saveUser($data, user.id)" ng-show="rowform.$visible" class="form-buttons form-inline"> 
     <button type="submit" ng-disabled="rowform.$waiting" class="btn btn-primary"> 
     save 
     </button> 
     <button type="button" ng-disabled="rowform.$waiting" ng-click="rowform.$cancel()" class="btn btn-default"> 
     cancel 
     </button> 
    </form> 
    <div class="buttons" ng-show="!rowform.$visible"> 
     <button class="btn btn-primary" ng-click="rowform.$show()">edit</button> 
     <button class="btn btn-danger" ng-click="removeUser($index)">del</button> 
    </div> 
      </td> 
      </tr> 
     </tbody> 
     </table> 
    </div> 

我可以看到xeditable代碼找不到$ editables元素,我想因爲如果我試圖用常規表是涉及到數據表它效果很好。

關於如何解決它的任何想法?

最佳, 歐米

回答

0

editable-text不在editable-form,這可能是問題。 我認爲下面的代碼會解決它。

<form editable-form name="rowform" onbeforesave="saveUser($data, user.id)" ng-show="rowform.$visible" class="form-buttons form-inline"> 
     <span editable-text="contact.email" e-name="email" e-form="rowform"> 
      {{ contact.email || 'empty' } 
     </span> 
     <button type="submit" ng-disabled="rowform.$waiting" class="btn btn-primary"> 
      save 
     </button> 
     <button type="button" ng-disabled="rowform.$waiting" ng-click="rowform.$cancel()" class="btn btn-default"> 
      cancel 
     </button> 
</form>