繁体   English   中英

JQUERY根据表列值“状态”(1或0)将选中的属性添加到复选框

[英]JQUERY Add checked attribute to checkbox depending on Table column value `Status` (1 or 0)

我一直在努力地研究这一点,但是将关键字checkbox和table放在一起给了我“获取选中行的行值”的结果。

而且,我也遇到了同样关注的罕见问题,但都是高级的(ajax,angularjs),我只是一个学生级的程序员(最多是基本的jquery)。

所以我有这个:所以它的作用是将单元格的值放入文本框,在那里没有问题,但是我想将status的值设为1(对于活动状态)并将其放入复选框,如果值为1时,将选中该复选框,如果为0,则将不选中该复选框。

我要先谢谢大家,并请您原谅学生编码,尽管我的理解有限,但我仍希望得到一些纠正,但我仍在不断努力扩大知识面。

 $(document).ready(function(){ $(".buttonedit").click(function(){ var Lastname = $(this).closest("tr").find("td:eq(0)").text(); var Firstname = $(this).closest("tr").find("td:eq(1)").text(); var Status = $(this).closest("tr").find("td:eq(2)").text(); $("#lname").val(Lastname); $("#fname").val(Firstname); }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border="solid"> <thead> <tr> <td>lastnmae</td> <td>firstname</td> <td>status</td> <td>action</td> </tr> </thead> <tbody> <tr> <td>gates</td> <td>bill</td> <td>1</td> <td><button class="buttonedit">Edit</button></td> </tr> </tbody> </table> <form action=""> <input type="text" placeholder="enter lastname"id="lname"><br> <input type="text" placeholder="enter firstname"id="fname"><br> <input type="checkbox" name="status" id="status">Active?<br> </form> 

做得很好,只需添加以下行:

$('#status').attr('checked',Status=='1'); 

在您的脚本中。

在这里,您可以使用解决方案https://jsfiddle.net/n5s721bv/

 $(document).ready(function(){ $(".buttonedit").click(function(){ var Lastname = $(this).closest("tr").find("td:eq(0)").text(); var Firstname = $(this).closest("tr").find("td:eq(1)").text(); var Status = $(this).closest("tr").find("td:eq(2)").text(); $("#lname").val(Lastname); $("#fname").val(Firstname); $('#status').prop('checked', parseInt(Status)); }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border="solid"> <thead> <tr> <td>lastnmae</td> <td>firstname</td> <td>status</td> <td>action</td> </tr> </thead> <tbody> <tr> <td>gates</td> <td>bill</td> <td>1</td> <td><button class="buttonedit">Edit</button></td> </tr> <tr> <td>Test</td> <td>Test11</td> <td>0</td> <td><button class="buttonedit">Edit</button></td> </tr> <tr> <td>Test9</td> <td>bill</td> <td>1</td> <td><button class="buttonedit">Edit</button></td> </tr> </tbody> </table> <form action=""> <input type="text" placeholder="enter lastname"id="lname"><br> <input type="text" placeholder="enter firstname"id="fname"><br> <input type="checkbox" name="status" id="status">Active?<br> </form> 

由于Status变量包含数据,但它的typeof是字符串,因此我将使用parseInt选中/未选中复选框将其更改为整数。

为此,您可以使用prop()设置复选框的选中状态。 要使其工作,您需要将值设置为布尔值。 为此,可以使用Status == '1'的结果,如下所示:

 $(document).ready(function() { $(".buttonedit").click(function() { var Lastname = $(this).closest("tr").find("td:eq(0)").text(); var Firstname = $(this).closest("tr").find("td:eq(1)").text(); var Status = $(this).closest("tr").find("td:eq(2)").text(); $("#lname").val(Lastname); $("#fname").val(Firstname); $('#status').prop('checked', Status == '1'); // note this line }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border="solid"> <thead> <tr> <td>lastnmae</td> <td>firstname</td> <td>status</td> <td>action</td> </tr> </thead> <tbody> <tr> <td>gates</td> <td>bill</td> <td>1</td> <td><button class="buttonedit">Edit</button></td> </tr> <tr> <td>ballmer</td> <td>steve</td> <td>0</td> <td><button class="buttonedit">Edit</button></td> </tr> </tbody> </table> <form action=""> <input type="text" placeholder="enter lastname" id="lname"><br> <input type="text" placeholder="enter firstname" id="fname"><br> <input type="checkbox" name="status" id="status">Active?<br> </form> 

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM