Question

我需要在child tr标记内检查所有值是否为空，并更新parent tr tag。我的表格格式如下：

根据图片，我需要根据parent tr tag代码Assigned列更新专栏child tr的{{1}}状态。

如果assetID中的任何一个为空，我需要将child assetID column values添加到Amber color。

如果所有parent assigned column为空我需要添加child assetID column values 如果全部填写完毕，则Red color to parent tr改为green color。

＆＃13;

parent tr tag

＆＃13;

$( document ).ready(function() {
  var val = className = number ='';
    $('.assignedAssetID').each(function() {

      val = $(this).val();
      if( val != '' )
      {
          $(this).closest('tr').find("td:eq(6) .assig_noti").addClass('assign_complete');
      }else
      {

       $(this).closest('tr').find("td:eq(6) .assig_noti").addClass('not_assign');
      }

       className = $(this).closest('table').attr('class').split(' ')[0];
       number = parseFloat(className.match(/-*[0-9]+/));

         $('.ParentBundle'+number).each(function() {

          if( val != '' )
          {
              $(this).closest('tr').find("td:eq(8) .assig_noti").addClass('assign_complete');
          }else
          {

           $(this).closest('tr').find("td:eq(8) .assig_noti").addClass('not_assign');
          }

        });

    });



});

＆＃13;

但我不知道如何检查<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> <table> <tr class="ParentBundle21393114881"> <td style="display: none"> </td> <td> <p class="mar">1XPaver 2XRoller</p> </td> <td> <input type="text" value="25/07/2017" name="est_start_date[]" placeholder="Date Start" class="StartDate form-control date"> </td> <td> <input type="text" value="27/07/2017" name="est_off_date[]" placeholder="Date Off" class="OffDate form-control date"> </td> <td> <input type="text" name="week_count[]" value="3" placeholder="" class="WeekDayCount21393114881 form-control wdCount"> </td> <td> <input type="text" name="nonweek_count[]" value="0" placeholder="" class="WeekEndCount21393114881 form-control weCount"> </td> <td> <input type="text" name="row_total[]" id="RowTotal21393114881" value="1140.00" readonly="" class="RowTotal form-control"> </td> <td class="ExtraCheckbox_main"> <input type="checkbox" name="extra[]" class="js-switch" style="position: absolute; opacity: 0;"> </td> <td> <div class="assig_noti"></div> </td> <td> <div class="btn-group pull-right"> <button type="button" class="btn btn-default BundleExpand"><i class="fa fa-list"></i></button> <button data-toggle="modal" data-target="#commentModal" type="button" class="btn btn-default"><i class="fa ficon fa-comment-o" aria-hidden="true"></i></button> <button type="button" data-code="B21393114881" data-id="1" data-type="bundle" class="btn btn-default DeleteBundleRow"><i class="fa fa-trash-o"></i></button> </div> </td> </tr> <tr class="ChildBundle21393114881" style="background: rgb(249, 249, 249) !important;"> <td colspan="9" style="padding: 0!important;"> <table cellpadding="5" border="0" class="ChildTable21393114881 child_tbl table" width="100%" style="background: #f9f9f9!important;"> <thead> <tr> <th width="20%"></th> <th width="20%"> ASSET ID </th> <th width="16%" colspan="2">RATES</th> <th width="10%"> </th> <th width="5%"> </th> <th width="14%"> </th> <th width="15%"> </th> </tr> </thead> <tbody> <tr> <td> Paver </td> <td> <select style="width:100%" name="assigned_asset[]" class="form-control select2_demo_2 assignedAssetID" tabindex="-1" aria-hidden="true"> <option value="">--Not Assigned --</option> <option value="PV01">PV01</option> </select> </td> <td><input type="text" name="week_rate[]" value="150.00" placeholder="" class="Week form-control"></td> <td><input type="text" name="nonweek_rate[]" value="200.00" placeholder="" class="NonWeek form-control"></td> <td><input type="text" value="450.00" name="rate[]" readonly="" placeholder="" id="ChildRowTotal62" class="ChildRowTotal form-control"></td> <td> </td> <td> <div class="assig_noti not_assign"></div> </td> <td width="15%" style="text-align: right; padding-right: 43px;"><input type="hidden" id="comment62" name="comments[]" class="form-control ctext"> <button data-toggle="modal" data-target="#commentModal" type="button" class="Comment btn btn-default"><i class="fa ficon fa-comment-o" id="fa62" aria-hidden="true"></i></button> </td> </tr> <tr> <td> Small Roller </td> <td> <select style="width:100%" name="assigned_asset[]" class="form-control select2_demo_2 assignedAssetID " tabindex="-1" aria-hidden="true"> <option value="">--Not Assigned --</option> <option value="RL01" selected="">RL01</option> <option value="RL02">RL02</option> <option value="RL03">RL03</option> <option value="RL04">RL04</option> <option value="RL05">RL05</option> </select> </td> <td><input type="text" name="week_rate[]" value="110.00" placeholder="" class="Week form-control"></td> <td><input type="text" name="nonweek_rate[]" value="160.00" placeholder="" class="NonWeek form-control"></td> <td><input type="text" value="330.00" name="rate[]" readonly="" placeholder="" id="ChildRowTotal71" class="ChildRowTotal form-control"></td> <td> </td> <td> <div class="assig_noti"></div> </td> <td width="15%" style="text-align: right; padding-right: 43px;"><input type="hidden" id="comment71" name="comments[]" class="form-control ctext"> <button data-toggle="modal" data-target="#commentModal" type="button" class="Comment btn btn-default"><i class="fa ficon fa-comment-o" id="fa71" aria-hidden="true"></i></button> </td> </tr> <tr> <td> Medium Roller </td> <td> <select style="width:100%" name="assigned_asset[]" class="form-control select2_demo_2 assignedAssetID " tabindex="-1" aria-hidden="true"> <option value="">--Not Assigned --</option> <option value="MRL01">MRL01</option> <option value="MRL02">MRL02</option> </select> </td> <td><input type="text" name="week_rate[]" value="120.00" placeholder="" class="Week form-control"></td> <td><input type="text" name="nonweek_rate[]" value="220.00" placeholder="" class="NonWeek form-control"></td> <td><input type="text" value="360.00" name="rate[]" readonly="" placeholder="" id="ChildRowTotal84" class="ChildRowTotal form-control"></td> <td> </td> <td> <div class="assig_noti"></div> </td> <td width="15%" style="text-align: right; padding-right: 43px;"><input type="hidden" id="comment84" name="comments[]" class="form-control ctext"> <button data-toggle="modal" data-target="#commentModal" type="button" class="Comment btn btn-default"><i class="fa ficon fa-comment-o" id="fa84" aria-hidden="true"></i></button> </td> </tr> </tbody> </table> </td> </tr> </table>子tr列以满足父tr的状态。

任何建议请。

Answer 1

code
----

<table id="tbl">
<tr>
  <td><input type="text" id="tb1"></td>
  <td><input type="text" id="tb2"></td>
  <td>
<select class="select" onchange="checkIndex()">
        <option value="1">select</option>
        <option value="2">V2</option>
        <option value="3">V3</option>
    </select></td>
    <td><h1  id="status">
    status
    </h1></td>
</tr>
</table>
    <script>function checkIndex(){ 
    var boolTxtBox=false;
        var selectBoxselectedIndex=$(".select")[0].selectedIndex;
//alert(selectBoxselectedIndex);
        if(selectBoxselectedIndex>0){
             // set the background to green

             var txtboxes =$('#tbl input:text');
             $.each(txtboxes,function(i,v){ 
            if($(v).val().length>0){
                    boolTxtBox=true;
                }
                else{
                    boolTxtBox=false;
                }
             });
             if(boolTxtBox==true){
                $('#status').css({'color':'green'});
             }else{
                $('#status').css({'color':'red'});
             }
        }
        else{
            //set the background to red
            $('#status').css({'color':'red'});
        }
    }</script>

工作演示jsFiddle working demo

如何使用jquery检查所有值是否为空

1 个答案: