循环遍历行并在屏幕上检查选中的复选框

时间:2017-12-01 08:39:53

标签: javascript jquery

function checkPeriods(ePeriodId, eType, eStart, eEnd)
{
     var found = false;


     #foreach($e in $existing_periods)
              if(document.getElementById("chk").checked)
             {

             $('#periods tbody tr').each(function()
                {
                    var stDt = $('select[name$="start_y"]', this).val() + $('select[name$="start_m"]', this).val();
                    var enDt = $('select[name$="end_y"]',   this).val() + $('select[name$="end_m"]',   this).val();
                    var Ttype = $('select.type', this).val();

                    if(eType == Ttype && stDt == eStart && eEnd == enDt)
                         found = false;
                });

             }
                else
             {
                 $('#periods tbody tr').each(function()
                 {
                    var stDt = $('select[name$="start_y"]', this).val() + $('select[name$="start_m"]', this).val();
                    var enDt = $('select[name$="end_y"]',   this).val() + $('select[name$="end_m"]',   this).val();
                    var Ttype = $('select.type', this).val();

                    if(eType == Ttype && stDt == eStart && eEnd == enDt)
                         found = true;
                });

             }
    #end

   if(found == false)
    {
        alert('Selected Period is not defined. Please define same and check this existing period');
        document.getElementById("chk").checked = false;
        return false;
    }

    return true;
}

// HTML

           <td><input type="checkbox" id="chk" name="chkPeriodID[$e.Periodid]" onclick="checkPeriods('$e.Periodid', '$e.Type1', '$e.Start1', '$e.End1');"/></td><td>$e.Type</td><td>$e.Start</td><td>$e.End</td><td>$e.Requestno</td><td>$e.Proposalno</td><td>$e.Workflowstatus<td>$e.Approved_On</td>
        </tr>

我想循环访问数据($ existing_periods),我的屏幕包含4个具有相同ID的chechbox,即(&#34; chk&#34;)。我的要求是 - 1)如果2个复选框检查具有相同的数据行,则应显示验证消息。

1 个答案:

答案 0 :(得分:0)

如果您需要获取页面上所有选中复选框的列表,则无需循环浏览任何内容,只需使用此选择器:

$('input[type="checkbox"]:checked')

您确实需要修复重复ID问题:元素ID在DOM中必须是唯一的。最好将其更改为className:

<input class="chk" type="checkbox" ...>

(然后可以在选择器中使用该类名,只选择已选中的类名):

$('input.chk:checked');

至于您的具体要求,

  

1)如果使用相同的数据行检查2个复选框,则应显示验证消息。

你没有提供足够的背景来给出确切的答案,但根据描述它可能看起来像这样:

$('tr').each(function() { // iterate over data rows, assuming they're in a table
  if ($(this).find('input.chk:checked').length === 2) { // two checked boxes in this row
    // show the validation message for this row:
    $(this).find('.classnameForValidationMessage').show();
  } else { /* hide it */ } 
});