Question

Screenshot

我有表数据（从mysql表中检索数据并获取到表中）。 table包含几个记录。当我点击php中的按钮时，我想显示带有输入框值的复选框值和复选框。选中的复选框值和已检查的输入已使用连接功能正确显示。但选中复选框未正确显示。在我的代码中，当我单击按钮时，将显示所有选中的检查值。我的问题是只显示带有checkbax的复选复选框，使用连接功能。

我的表：

   <table border="0" cellpadding="10" cellspacing="1" width="500" class="tblListForm">
    <tr class="listheader">
    <td></td>
   <td>Username</td>
   <td>First Name</td>
   <td>Last Name</td>
   <td>Permissions</td>
   <td>CRUD Actions</td>
   </tr>
   <?php
      $i=0;
      while($row = mysqli_fetch_array($result)) {
       if($i%2==0)
       $classname="evenRow";
        else
       $classname="oddRow";
          ?>
       <tr class="<?php if(isset($classname)) echo $classname;?>">
        <td><input type="checkbox" class="chk_id" name="chk_id" id="chk_id" value="<?php  echo $row["userId"]; ?>" /></td>
        <td><?php echo $row["userName"]; ?></td>
        <td><input type="text" name="firstName" class="firstName" id="firstName" value="<?php echo $row["firstName"];?>" /></td>
       <td><?php echo $row["lastName"]; ?></td>
      <td><input type="checkbox" name="grant" class="grant" id="grant" value="Y" /></td>
       <td><a href="edit_user.php?userId=<?php echo $row["userId"]; ?>" class="link"><img alt='Edit' title='Edit' src='images/edit.png' width='15px' height='15px' hspace='10' /></a>  <a href="delete_user.php?userId=<?php echo $row["userId"]; ?>"  class="link"><img alt='Delete' title='Delete' src='images/delete.png' width='15px' height='15px'hspace='10' /></a></td>
            </tr>
       <?php
       $i++;
       }
        ?>
      </table>
         <input type="button"  id="save_value" name="save_value" value="Save" />

我的jquery代码我尝试过：

   $('#save_value').click(function () {
            alert("Checkbox running");
                var chk_id = [];
                 var firstName = [];
                  var grant = [];


                 $.each($("input[ id='chk_id']:checked"), function () {
                      chk_id.push($(this).val());
                      firstName.push($(this).parent().parent().find("#firstName").val()); 
                       grant.push($(this).parent().parent().find($("#grant").is(':checked'));
                });

                alert(chk_id);
                alert(firstName);
                alert(grant);
            });

在这里，

我正在检查复选框并检查输入值。我的问题是用勾选值显示选中的复选框。

感谢@

Answer 1

你犯了一些小错误：

您不能拥有多个具有相同ID的元素，ID必须是唯一的。因此，我从您的HTML（id="chk_id"，id="firstName"，id="grant"）中删除了所有重复的ID，并在您的JS中使用了这些类。
您错过了grant.push($(this).parent().parent().find($(".grant").is(':checked')));中的结束括号。
.find($(".grant").is(':checked'))没有按预期工作，也没有必要请改用：.find(".grant:checked")。
最后，你的警报显示两个值的原因是复选框是否被选中：grant.push( ... );总是将某些东西推入数组，如果jQuery选择器没有匹配并返回false，该值仍将被推入数组中实际上，如果您更正了上述所有三点，并且未选中权限复选框，则数组中的值将为undefined。如果您选中此框，则会Y
因此，为了使其正常工作，您只需将grant.push( ... );置于if子句中，然后检查".grant:checked"：
if ($p.find(".grant:checked").length) {grant.push($p.find(".grant:checked").val());}

- $p代表$(this).parent().parent()，我将参考文献存储在var。
- .length检查返回对象的长度是否大于0。没有它，if子句仍然总是true，因为jQuery仍然返回一个对象（值为undefined）。

请参阅下面的代码段以获取演示：

$('#save_value').click(function() {
  var chk_id=[], firstName=[], grant=[];
  
  $.each($("input[class='chk_id']:checked"),function() {
    var $row = $(this).parent().parent();
    chk_id.push($(this).val());
    firstName.push($row.find(".firstName").val()); 
    if ($row.find(".grant:checked").length) {grant.push($row.find(".grant:checked").val());}
  });
  
  console.log(chk_id, firstName, grant);
});

table,input[type=button] {float:left;} /*ONLY SO console.log() DOESN'T COVER BUTTON*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table border="0" cellpadding="0" cellspacing="0" width="500" class="tblListForm">
  <tr class="listheader"><td></td><td>Username</td><td>First Name</td><td>Last Name</td><td>Permissions</td></tr>
  
  <tr class="evenRow">
    <td><input type="checkbox" class="chk_id" name="chk_id" value="4" /></td>
    <td>sardhar</td>
    <td><input type="text" name="firstName" class="firstName" value="sardhar" /></td>
    <td>mohamed</td>
    <td><input type="checkbox" name="grant" class="grant" value="Y" /></td>
  </tr>
  
  <tr class="oddRow">
    <td><input type="checkbox" class="chk_id" name="chk_id" value="3" /></td>
    <td>fg</td>
    <td><input type="text" name="firstName" class="firstName" value="vb" /></td>
    <td>vb</td>
    <td><input type="checkbox" name="grant" class="grant" value="Y" /></td>
  </tr>
</table>

<input type="button" id="save_value" name="save_value" value="Save" />

jsfiddle：https://jsfiddle.net/3utno9at/

需要在php中使用jquery获取Checked输入和复选框值

1 个答案: