`
wanggeying
  • 浏览: 66464 次
  • 性别: Icon_minigender_2
  • 来自: 济南
社区版块
存档分类
最新评论

checkbox事件

阅读更多

需求描述:

复选框,点击时勾选,再次点击是取消勾选,数组值跟着变化

 

jsp:

<tr data-ng-repeat="data in pagedResultInfo.list">

   <td data-ng-click="ckEvent(this,'{{data.id}}');">

   <label>

      <input type="checkbox" name="ckdict"  data-ng-checked="isSelected(data.id)" >

   </label>

   </td>

<td data-ng-click="queryValuePagedResult('{{data.id}}');"><a href="#">{{data.name}}</a></td>

<td>{{data.description}}</td>

</tr>

 

js

/**

* checkbox事件

*/

var ckvalues=[];

var datas=[];//方便移除数据使用

Array.prototype.indexOf = function(val) {

for (var i = 0; i < this.length; i++) {

if (this[i] == val)

return i;

}

return -1;

};

Array.prototype.remove = function(val) {

var index = this.indexOf(val);

if (index > -1) {

this.splice(index, 1);

}

};

$scope.ckEvent=function($event, id){

$scope.isSelected = function(id){          

           return ckvalues.indexOf(id)!=-1; 

}

if(ckvalues.indexOf(id)>=0){

ckvalues.remove(id);

datas.remove($event.data);

}else{

ckvalues.push(id);

datas.push($event.data);

}

// console.log(ckvalues);

// console.log(datas);

}

分享到:
评论

相关推荐

    FlexViewer 树形结构带checkbox事件处理

    总的来说,理解和实现"FlexViewer 树形结构带checkbox事件处理"涉及对Flex编程、GIS应用开发以及地图服务的深入理解。通过灵活运用事件驱动编程,我们可以创建出用户友好的GIS应用,使用户能够轻松地控制地图上的...

    XtarGrid应用实例(列标题分组,单元格的时间控件、钱币符号显示、计算器控件、CheckBox事件)

    CheckBox(复选框)是用户界面中常见的交互元素,XtarGrid提供了完善的CheckBox事件处理机制。当用户改变CheckBox的状态时,可以触发事件,执行相应的逻辑操作,比如更新数据库、计算总计等。这在需要多选或者状态...

    EXT checkbox 的 check 事件

    EXTjs2 的treeNode 带有checkbox,可是API中,关于checkbox的事件就只有一个checkchange事件,所以写个方法传上来。

    关于表格(table)中checkbox等相关事件操作(动态添加行+隔行换色等相关)(jquery)

    本篇将详细探讨如何利用jQuery实现表格中checkbox的相关事件操作,包括动态添加行、隔行换色、选中变色、全选与反选等功能。 首先,让我们了解jQuery的基本概念。jQuery是一个快速、简洁的JavaScript库,它简化了...

    PB 11.5 CheckBox三种状态的实例

    本实例将详细讲解如何实现CheckBox控件的三种状态:未选中、已选中以及灰色禁用状态,并探讨它们在实际应用中的配置和事件处理。 1. CheckBox的基本结构: CheckBox控件在界面中通常表现为一个小方框,里面可能有...

    WPF 带CheckBox的TreeView

    3. **CheckBox事件处理**:当CheckBox的状态改变时,我们需要更新相关数据模型的IsChecked属性,并可能触发其他CheckBox的联动更新。这通常通过处理CheckBox的Click或Checked/Unchecked事件来实现。 4. **联动逻辑*...

    CheckBox简单样例.7z

    在“MyCheckBox”这个示例项目中,可能包含了如何创建、配置以及响应CheckBox事件的完整代码。通过学习这个示例,开发者可以更好地理解和掌握在Android应用中如何有效地使用CheckBox控件,从而提供更友好的用户交互...

    wpf-DataGrid-checkBox

    同时,我们需要处理CheckBox的Click事件来切换所有行的选中状态。在XAML中,可能的实现如下: ```xml &lt;CheckBox IsChecked="{Binding Path=IsAllItemsSelected, RelativeSource={RelativeSource ...

    c# 自定义多选checkbox

    - 在C#中,我们可以从现有的UI控件(如System.Windows.Forms.CheckBox)继承,然后添加新的属性、方法和事件来扩展其功能。这将使我们能创建一个具有多选特性的新控件。 2. **多选逻辑**: - 需要实现一个机制来...

    layui的table单击行勾选checkbox功能方法

    //单击行勾选checkbox事件 $[removed](click,.layui-table-body table.layui-table tbody tr, function () { var index = $(this).attr('data-index'); var tableBox = $(this).parents('.layui-table-box'); //...

    DataGrid和AdvancedDataGrid CheckBox全选功能

    2. **监听CheckBox事件**: 当用户点击全选CheckBox时,需要监听`ChangeEvent`事件,触发相应的处理函数。在这个函数中,你可以遍历`DataGrid`或`AdvancedDataGrid`的所有数据项,并改变每个条目的选中状态。 3. *...

    winform中gridview的checkbox使用案例

    六、Checkbox事件综合应用 在实际项目中,可能需要根据Checkbox的选择情况执行其他操作,如删除、修改等。这通常会在CheckBox状态改变后触发一个业务逻辑处理方法。 七、性能优化 如果数据量大,为提高性能,可以...

    flex tree+checkbox级联勾选

    4. **监听Checkbox事件**:当Checkbox状态改变时,触发事件处理器。在处理器中,根据级联勾选的需求,更新关联的父节点或子节点的选中状态。 5. **级联逻辑**:在事件处理器内,遍历数据源,根据当前节点的选中状态...

    flex checkbox选中

    flex checkbox选中,自定义选中状态的数据。

    ListView+CheckBox

    最后,关于“ListViewCheckBoxTest”这个文件名,可能是一个测试项目或者示例代码,它可能包含了上述解决方案的实现,包括自定义适配器、数据模型以及处理CheckBox事件的相关代码。通过运行和调试这个测试项目,...

    DataGridView DataGridViewCheckBoxColumn编辑时实时触发事件代码

    当你需要处理包含复选框列(`DataGridViewCheckBoxColumn`)的数据时,实时触发事件是提高用户体验和实现动态功能的关键。`DataGridViewCheckBoxColumn`允许用户通过点击来选择或取消选择一个条目,而实时触发事件则...

    Qt:在TreeModel+QTreeView中使用复选框(checkbox)

    QTreeView Checkboxes 需要实现一个功能:在QT的TreeView中,能够使用复选框,并且选中父节点的复选框可以全选或取消子节点的复选框。 参考链接: http://blog.csdn.net/ajaxhe/article/details/7518285

    pyqt treemodel使用checkbox例子代码

    然后,我们需要创建一个视图类`CheckBoxTreeView`,它将使用`CheckBoxTreeModel`作为数据模型,并确保正确处理复选框的事件。 ```python class CheckBoxTreeView(QTreeView): def __init__(self, parent=None): ...

    flex中tree和checkbox结合使用的插件

    通过查看示例,开发者可以了解如何创建Tree,如何加载数据,以及如何配置和监听Checkbox事件。 6. 应用场景:这种结合不仅适用于文件管理器,还可以应用于组织架构、权限管理、设置菜单等任何需要层级选择的场景。...

    JQuery对checkbox的操作 (01).zip

    **处理checkbox事件** 1. **点击事件:** 当用户点击checkbox时,可以监听`click`事件。这通常用于更新数据或执行某些操作: ```javascript $('.myCheckbox').on('click', function() { if ($(this).is(':...

Global site tag (gtag.js) - Google Analytics