Question

我需要客户字段是必需的，如果在按下继续按钮时它是空的，则不必允许继续下一步，然后它应该出现一条消息，表明该字段为空并且需要完成。

请，我需要有关如何进行验证的帮助或建议。

使用boostrap。

<ul class="nav nav-pills nav-justified" id="NotTab">
<li class="active disabledTab"><a href="#tab-customer" data-toggle="tab">1. <?php echo $tab_customer; ?></a></li>
<li class="disabled disabledTab"><a href="#tab-payment" data-toggle="tab">2. <?php echo $tab_payment; ?></a></li>
</ul>
<div id="tab-customer" class="tab-pane active">
<div class="control-group">
<label class="control-label" style="color: #F00;"><b><?php echo $entry_customer; ?></b></label>
<div class="controls">
<input type="text" name="customer" value="<?php echo $customer; ?>" class="span3" onclick="this.select();">
<input type="hidden" name="customer_id" value="<?php echo $customer_id; ?>">
<input type="hidden" name="customer_group_id" value="<?php echo $customer_group_id; ?>">
</div></div>
<div class="form-actions">
<button class="btn btn-primary prevtab" type="button" onclick="return showNext()"><span class="glyphicon glyphicon-arrow-right"></span> Next </button></div>

</div>
<script>
 var $tabs = $('#NotTab li');


function showPrev() {
    $tabs.filter('.active').prev('li').removeClass("disabled");
    $tabs.filter('.active').prev('li').find('a[data-toggle]').each(function () {
       $(this).attr("data-toggle", "tab");
    });

    $tabs.filter('.active').prev('li').find('a[data-toggle="tab"]').tab('show');

    $tabs.filter('.active').next('li').find('a[data-toggle="tab"]').each(function () {
        $(this).attr("data-toggle", "").parent('li').addClass("disabled");        
    })
}

function showNext() {
    $tabs.filter('.active').next('li').removeClass("disabled");
    $tabs.filter('.active').next('li').find('a[data-toggle]').each(function () {
        $(this).attr("data-toggle", "tab");
    });

    $tabs.filter('.active').next('li').find('a[data-toggle="tab"]').tab('show');

    $tabs.filter('.active').prev('li').find('a[data-toggle="tab"]').each(function () {
        $(this).attr("data-toggle", "").parent('li').addClass("disabled");;        
    })
}
</script>

感谢。

Answer 1

您可以使用简单的检查来检查输入是否为空。

if( !$('[name=customer]').val() ) {
    alert('Input is empty');
    return;
}

如何在选项卡中验证字段？

1 个答案: