如何使用jQuery确定表行中的文本框是否为空?

时间:2010-05-05 13:21:39

标签: jquery

我有以下功能:

 var emptyFields = false;

 function checkNotEmpty(tblName, columns, className){

    emptyFields = false;

     $("."+className+"").each(function() {
          if($.trim($(this).val()) === "" && $(this).is(":visible")){
             emptyFields = true;
             return false; // break out of the each-loop
          }
     });

      if (emptyFields) {
             alert("Please fill in current row before adding a new one.")
       } else {
              AddRow_OnButtonClick(tblName,columns);
       }
}

在添加新行之前检查表中的所有元素都不是空的,而我只需要检查表的最后一行是否至少有一个非空的元素而不是整个表

它应用于表的className。请注意,问题是我检查了最后一行,并且该行中只有一个元素必须包含一些文本。 (例如,每行有5个文本框,至少有一个文本框需要在其中包含一些文本,以便能够添加另一行,否则,警报会出现)。

3 个答案:

答案 0 :(得分:2)

这应该有效:

if ($('.' + className + ' tr:last input:text:visible[value]').length > 0) {
    AddRow_OnButtonClick(tblName,columns);
} 
else {
    alert("Please fill in current row before adding a new one.")
}

这当然假定您使用的className用于table元素。

工作示例:

<script type="text/javascript">
$(function(){
    $('#btn').click(function(){
        if ($('.test tr:last input:text:visible[value]').length > 0) {
            alert('SUCCESS - at least 1 value is filled in!');
        } 
        else {
            alert("FAIL - all textboxes on last row are empty.")
        }
    });
});
</script>

<table class="test" border="1">
<tr>
<td><input type="text" value="filled" /></td>
<td><input type="text" value="in" /></td>
</tr>
<tr>
<td><input type="text" value="" /></td>
<td><input type="text" value="" /></td>
</tr>
</table>

<input id="btn" type="button" value="Click Me!" />

答案 1 :(得分:1)

除了"."+classname之外,您是否考虑过:last选择器和一些孩子? $("."+classname+" tr:last td")的某些内容应检查最后一行中的每个单元格。

编辑: 最初建议last-child,但在评论时切换到符合OP需求的东西。

答案 2 :(得分:1)

不需要循环:

if($("." + className + ":visible[value]").length) {
   // one or more has been filled out, and is visible
   // [value] matches non-empty values only
}