按钮以选择和取消选择所有无法使用的复选框

学徒程序员

我的按钮可以选中ng-grid中的所有复选框,效果很好。但是,我也想实现使用同一按钮取消选择。

这是原始代码

app.directive('selectAll',function(){
  return{

    restrict: 'A',
    link: function(scope,element,attr){
     element.click(function() {
     $('.ngViewport.ng-scope input[type="checkbox"]').prop('checked', true);
   });
  }
 };
});

我做了一些谷歌搜索并基于其他示例后的尝试:

  app.directive('selectAll',function(){
return{

  restrict: 'A',
  link: function(scope,element,attr){

 element.click(function() {
    if (this.checked) {
     $('.ngViewport.ng-scope input[type="checkbox"]').prop('checked', true);
    }
    else{
    $('.ngViewport.ng-scope input[type="checkbox"]').prop('checked', false);
    }
 });
 }
};
});

由于某种原因,Angular不喜欢this.checked?不知道从这里去哪里。

朋克

http://plnkr.co/edit/zy653RrqHmBiRJ7xDHlV?p=preview

苏珊斯-

您正在检查按钮的Checked属性。

button元素没有这样的属性。

我将向按钮元素添加一个类。并基于此设置复选框的checked属性。这是使用jQuery。

但是使用Angular应该避免使用jQuery作为最后的手段。相反,应该使用模型来保留当前状态的值。

element.click(function() {
     var $this = $(this),
         isChecked = false;

     if ($this.hasClass('checked')) {
        $this.removeClass('checked');
     } else {
        $this.addClass('checked');
        isChecked = true;
     }
     $('.ngViewport.ng-scope input[type="checkbox"]').prop('checked', isChecked);
});

检查编辑的punker

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

全选 | 使用切换按钮取消选择所有复选框

来自分类Dev

使用按钮选择所有复选框

来自分类Dev

选择/取消选择所有复选框

来自分类Dev

选择/取消选择所有复选框元素AngularJS

来自分类Dev

选择/取消选择所有复选框元素AngularJS

来自分类Dev

使用jQuery选择和取消选择复选框

来自分类Dev

当我使用jQuery单击“选择”按钮时,如何选择所有复选框

来自分类Dev

如何选择所有/取消选择所有未禁用的复选框?

来自分类Dev

带有复选框的组合框,C ++ Qt,选择/取消选择所有复选框

来自分类Dev

JSF-2选择/取消选择所有带有复选框的复选框列表

来自分类Dev

按住鼠标按钮选择/取消选择复选框

来自分类Dev

当通过jQuery单击一个复选框时,如何选择所有复选框并取消选择?

来自分类Dev

复选框选择和取消选择

来自分类Dev

使用剔除选择所有复选框

来自分类Dev

如何使用jQuery或JavaScript选择所有复选框?

来自分类Dev

使用剔除选择所有复选框

来自分类Dev

用于选择/取消选择AngularJS表中所有复选框的代码

来自分类Dev

复选框以选择或取消选择列SQL的所有项目

来自分类Dev

JQuery的:当选择另一个复选框复选框如何选择或取消所有复选框

来自分类Dev

使用JQuery的多次选择取消选择复选框

来自分类Dev

选择或取消选择复选框-ReactJS

来自分类Dev

如何使用Laravel选择和清除所有复选框

来自分类Dev

在选择多个复选框时使用 ReactJs 和 BootstrapUI 获取所有值

来自分类Dev

如何使用 jQuery 或 JavaScript 选择和取消选择复选框

来自分类Dev

取消选择带有VBA宏的Excel工作簿中的所有复选框

来自分类Dev

使用复选框名称选择/取消选择复选框

来自分类Dev

Kendo Grid和复选框-为给定列选择全部,为给定行的单元格“选择所有先前的” /“取消所有之后的”

来自分类Dev

如果我选择标题复选框,则应选择所有行,但如果未选中任何行,则应取消选择表格中的标题复选框

来自分类Dev

如何在DataGridView中取消选择所有选中的复选框

Related 相关文章

  1. 1

    全选 | 使用切换按钮取消选择所有复选框

  2. 2

    使用按钮选择所有复选框

  3. 3

    选择/取消选择所有复选框

  4. 4

    选择/取消选择所有复选框元素AngularJS

  5. 5

    选择/取消选择所有复选框元素AngularJS

  6. 6

    使用jQuery选择和取消选择复选框

  7. 7

    当我使用jQuery单击“选择”按钮时,如何选择所有复选框

  8. 8

    如何选择所有/取消选择所有未禁用的复选框?

  9. 9

    带有复选框的组合框,C ++ Qt,选择/取消选择所有复选框

  10. 10

    JSF-2选择/取消选择所有带有复选框的复选框列表

  11. 11

    按住鼠标按钮选择/取消选择复选框

  12. 12

    当通过jQuery单击一个复选框时,如何选择所有复选框并取消选择?

  13. 13

    复选框选择和取消选择

  14. 14

    使用剔除选择所有复选框

  15. 15

    如何使用jQuery或JavaScript选择所有复选框?

  16. 16

    使用剔除选择所有复选框

  17. 17

    用于选择/取消选择AngularJS表中所有复选框的代码

  18. 18

    复选框以选择或取消选择列SQL的所有项目

  19. 19

    JQuery的:当选择另一个复选框复选框如何选择或取消所有复选框

  20. 20

    使用JQuery的多次选择取消选择复选框

  21. 21

    选择或取消选择复选框-ReactJS

  22. 22

    如何使用Laravel选择和清除所有复选框

  23. 23

    在选择多个复选框时使用 ReactJs 和 BootstrapUI 获取所有值

  24. 24

    如何使用 jQuery 或 JavaScript 选择和取消选择复选框

  25. 25

    取消选择带有VBA宏的Excel工作簿中的所有复选框

  26. 26

    使用复选框名称选择/取消选择复选框

  27. 27

    Kendo Grid和复选框-为给定列选择全部,为给定行的单元格“选择所有先前的” /“取消所有之后的”

  28. 28

    如果我选择标题复选框,则应选择所有行,但如果未选中任何行,则应取消选择表格中的标题复选框

  29. 29

    如何在DataGridView中取消选择所有选中的复选框

热门标签

归档