X-Editable。在編輯模式下通過主複選框關閉/打開復選框

假設我有可編輯的表單，其中有一些複選框。在編輯模式中，我應該能夠通過主複選框控制其他複選框的狀態。當它處於選擇狀態時，我可以檢查其他複選框，當它處於關閉狀態時，它們都應該被取消選中並禁用。X-Editable。在編輯模式下通過主複選框關閉/打開復選框

這裏我的HTML表單：

<body ng-app="app"> 
    <h4>x-editable checkbox test</h4> 
    <div ng-controller="Ctrl"> 
    <form editable-form name="editableForm3" onaftersave=""> 

    <div> <span e-title="Maincb" editable-checkbox="useAll" e-name="maincb"> 
            <b>Maincb</b>: {{useAll ? "&#x2714;" : "&#x2718;" }} 
     </span> 
    </div> 

    <div> 
    <span class="title"><h4><b>Supplementary</b></h4></span> 
    <div> 
     <span e-title="1" editable-checkbox="sup[0]" e-name="1"> 
      {{sup[0] ? "&#x2714" : "&#x2718;"}}1 
     </span> 

     <span e-title="2" editable-checkbox="sup[1]" e-name="2"> 
      {{sup[1] ? "&#x2714" : "&#x2718;" }}2 
     </span> 

     <span e-title="3" editable-checkbox="sup[2]" e-name="2"> 
      {{sup[2]? "&#x2714" : "&#x2718;" }}3 
    </span> 
    </div> 

</div> 

    .... 
</form>

的問題是，是否有可能通過X編輯和/或angularjs方法呢？我試圖在maincb上使用e-ng-change，並將它的狀態轉移到某些控制器功能，但是我無法關閉補充複選框...我想這是通過jquery definitly可能的，但我想使用angularsjs/x-editable框架。這裏是我的fiddle

在此先感謝。

來源

2015-04-06 Sharov

使用jQuery，你可以這樣做：

$(document).on('click', 'input[name=maincb]', function(){ 
    $('.editable-input').prop('checked', $(this).is(':checked')); 
});

DEMO：http://jsfiddle.net/NfPcH/7474/

你好，山姆。對不起，延遲響應。 Formaly你的回答是正確的但正如我上面提到的，jquery不處理angularjs模型（或範圍）。所以你可以看到使用後關掉所有的複選框並保存，仍然有unchenged狀態。如何粘貼複選框狀態與模型？ - 沙羅夫26分鐘前

我不是一個開發商的角度，我敢肯定有一種方法可以做到這一點與棱角分明，但這裏是一個解決辦法使用jQuery

做

DEMO：http://jsfiddle.net/NfPcH/7505/

$(document).on('click', 'input[name=maincb]', function(){ 
    var checked = $(this).is(':checked'); 
    $('form > div').eq(1).find('.editable-input').each(function(){ 
     if($(this).is(':checked') != checked){ 
      $(this).trigger('click'); 
     } 
    }); 
});

來源

2015-04-06 17:47:56

是的，用jQuery它並不那麼難。我認爲當我們在範圍內改變模型時有解決方案，並且它被反映出來，但它似乎並不那麼容易...... – Sharov

嗨，山姆。對不起，延遲響應。形式上你的回答是正確的，但正如我上面提到的，jquery不處理angularjs模型（或範圍）。所以你可以看到，使用後關閉所有複選框並保存，仍然有unchenged狀態。如何粘貼複選框狀態和模型？ – Sharov

太棒了，非常感謝你！ – Sharov

X-Editable。在編輯模式下通過主複選框關閉/打開復選框

回答

相關問題