Bootstrap Form和UITab窗口验证问题

Question

在我的项目中，用户需要提交一个包含四个不同部分的表单。以下是他的表格样本：

我正在使用jquery validation在客户端进行验证。 提交按钮显示在最后一个选项卡中，但在提交时，仅验证最后一个选项卡值和字段。

如果我使用表单外部的提交按钮，则验证工作正常，表单仅提交打开选项卡的值，并且不验证其他选项卡选项卡。

如何在移动到下一个标签之前验证每个标签并在最后一个标签上提交表单？

或者，如果可能，onclick提交所有标签字段都已经过验证

<form class="bs-example form-horizontal" id="xxxxx" method="post">
    <div class="bs-example">
        <ul class="nav nav-tabs" style="margin-bottom: 15px;">
            <li class="active"><a href="#Step1" data-toggle="tab">Step 1: Personal Info</a>
            </li>
            <li><a href="#Step2" data-toggle="tab">Step 2: Qualification</a>
            </li>
            <li><a href="#Step3" data-toggle="tab">Step 3: Questionnaire</a>
            </li>
            <li><a href="#Step4" data-toggle="tab">Step 4: Case Study</a>
            </li>
        </ul>
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="Step1">
                <fieldset>
                    <legend>User Info</legend>
                    <div class="form-group">
                        <label for="name" class="col-lg-2 control-label">Full Name</label>
                        <div class="col-lg-10">
                            <input class="form-control" id="name" name="name" placeholder="Write your Name" type="text" value="">
                        </div>
                    </div>
                </fieldset>
            </div>
        </div>
        <div>
            <div class="form-group">
                <div class="col-lg-4 col-lg-offset-4">
                    <input type="hidden" class="submit" value="Save" name="cccc">
                    <button type="submit" class="btn btn-primary btn-lg">Submit and Send</button>
                </div>
            </div>
            </form>