Jquery复选框多选和行选择

请参阅下面的代码和屏幕，实际上它是一个配置屏幕。Jquery复选框多选和行选择

虽然点击Fieldname复选框，它将选中所有的复选框，如果我们删除了一个复选框，它将取消选中所有复选框。
单击Field1复选框。子控件将被选择为（添加，编辑，删除），如果我们删除一个检查，它将取消选择复选框。
我的问题是如何能做到这一点的操作，以及如何得到的值
我使用jQuery执行此操作
的所有值均为来自数据库的动态领域。

请帮我解决这个问题。其迫切

<table width="100%"> 
     <tr style="background: #999; color: #FFF;"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="Checkbox1" /> 
       <label for="field_name" class="checkboxlabel"> 
        Field Name</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox2" /> 
       <label for="default" class="checkboxlabel"> 
        Add</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox3" /> 
       <label for="default" class="checkboxlabel"> 
        Edit</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox4" /> 
       <label for="default" class="checkboxlabel"> 
        Delete</label> 
      </td> 
     </tr> 
     <tr class="row1"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_1" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 1</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox5" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox6" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox7" /> 
      </td> 
     </tr> 
     <tr class="row2"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_1" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 2</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox8" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox9" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox10" /> 
      </td> 
     </tr> 
    </table>

来源

2011-12-27 sathish kumar

欢迎SO。请不要使用“紧急”等字样。你可能会得到反对票 – naveen 2011-12-27 06:31:52

你有什么尝试过，哪些是行不通的？我们在这里处理破碎的代码，而不是请求。 – Blender 2011-12-27 06:34:05

我试着检查所有的工作。我不知道如何选择特定的行？ – 2011-12-27 06:37:42

请给像id="mytable"一个ID，你的表，并使用此代码

$("#mytable tr:first input[type=checkbox]").click(function() { 
    var selector = $("#mytable td:first-child input[type=checkbox]") 
    if (this.checked) { 
     $(selector).attr("checked", "checked"); 
    } 
    else { 
     $(selector).removeAttr("checked"); 
    } 
});

工作演示：http://jsfiddle.net/naveen/ETKqx/

来源

2011-12-27 07:13:29 naveen

<script> 
    $(document).ready(function() { 
     $("table tr:first input[type=checkbox]").click(function() { 
      var selector = "input[type=checkbox]:[name=" + $(this).attr("name") + "]"; 
      $(selector).attr("checked", $(this).attr("checked")); 
     }); 
    }); 
</script> 
<table width="100%"> 
     <tr style="background: #999; color: #FFF;"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="Checkbox1" /> 
       <label for="field_name" class="checkboxlabel"> 
        Field Name</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox2" /> 
       <label for="default" class="checkboxlabel"> 
        Add</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox3" /> 
       <label for="default" class="checkboxlabel"> 
        Edit</label> 
      </td> 
      <td> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox4" /> 
       <label for="default" class="checkboxlabel"> 
        Delete</label> 
      </td> 
     </tr> 
     <tr class="row1"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 1</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox5" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox6" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox7" /> 
      </td> 
     </tr> 
     <tr class="row2"> 
      <td> 
       <input class="checkbox" type="checkbox" name="field_name" value="yes" id="field_1" /> 
       <label for="field_1" class="checkboxlabel"> 
        Field 2</label> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Add" value="yes" id="Checkbox8" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="Edit" value="yes" id="Checkbox9" /> 
      </td> 
      <td align="center"> 
       <input class="checkbox" type="checkbox" name="delete" value="yes" id="Checkbox10" /> 
      </td> 
     </tr> 
    </table>

来源

2011-12-27 06:50:57

Jquery复选框多选和行选择

回答

相关问题