输入字段在表中时的表单验证

时间:2016-07-21 06:42:10

标签: javascript jquery bootstrap-table

我有一个文本框,它在一个表中作为列。

我想在Ok按钮点击时验证整个列是否为空。

请告诉我该怎么做



var formatTableMandatoryValueColumn = function(value, row/* , index*/)  
{
    return '<div class="form-group mandatory-div"><input class="m-value form-control" placeholder="Enter value" type="text" value="' + row.value + '"></div>';
 };
&#13;
@* Mandatory Table *@
<div class="row padding-left-40px padding-right-20px padding-top-10px padding-bottom-10px" id="table-rules-mandatory-ccp-value-modal-div">
    <table class="table-condensed" id="table-rules-mandatory-ccp-value-modal" data-classes="table table-no-bordered table-line-color-white" data-cache="false" data-striped="false" data-page-size="20" data-show-header="false">
         <thead>
              <tr>
                   <th data-field="key"></th>
                   <th data-field="operator" data-sortable="true"></th>                   <th data-field="value" data-sortable="true" data-formatter="BusinessPortal.Rules.CCPModal.formatTableMandatoryValueColumn" data-events="BusinessPortal.Rules.CCPModal.handleCCPTableMandatoryValueColumnEvents"></th>
              </tr>
        </thead>
    </table>
</div>
<button type="button" class="btn btn-primary width-60px" onclick="BusinessPortal.Recommendation.Email.Preview.setCCPValueJson();">OK</button>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

&#13;
&#13;
$('button').click(function() {
  $('table textarea').each(function(i) {
    if($(this).val()) {
        $(this).parent().removeClass('has-error');
    }
    else {
    	$(this).parent().addClass('has-error');
    }
  });
});
&#13;
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<table>
  <tr>
    <th>Some header</th>
  </tr>
  <tr>
    <td>
      <div class="form-group">
        <textarea class="form-control"></textarea>
      </div>
    </td>
  </tr>
</table>
<button type="button" class="btn btn-primary width-60px">OK</button>
&#13;
&#13;
&#13;