Question

我开发了一个表单，我希望在表单末尾添加 Next 按钮，以便在不加载页面的情况下加载另一个表单。我无法达到这个目标。

<form action="#" id="form_sample_1" class="form-horizontal form-bordered">
  <div class="form-body">
    <div class="form-group">
      <label class="label1 col-md-4">Enter the name
        <span class="required"> * </span>
      </label>
      <div class="col-md-7">
        <input id="templateName" type="text" name="name" data-required="1" class="form-control" />
      </div>
    </div>

    <div class="form-group">
      <label class="label1 col-md-4">Enter Birth Year
        <span class="required"> * </span>
      </label>
      <div class="col-md-7">
        <input id="admissionYear" type="date" name="name" data-required="1" class="form-control" maxlength="4" />
      </div>
    </div>

    <div class="form-group">
      <label class="label1 col-md-4">Select the type of room
        <span class="required"> * </span>
      </label>
      <div class="col-md-7">
        <select id="levelSelect" class="form-control" data-placeholder="Select" tabindex="1">
          <option value="0" disabled selected default>--Select--</option>
          <option value="AC">AC</option>
          <option value="non-AC">non-AC</option>
        </select>
      </div>
    </div>

    <div class="form-group">
      <label class="label1 col-md-4">Enter total number of room
        <span class="required"> * </span>
      </label>
      <div class="col-md-7">
        <input type="text" class="form-control" id="room">
      </div>
    </div>

    <div class="form-group">
      <div class="col-md-offset-4 col-md-3">
        <button id="SubmitEligibility" type="button" class="btn blue">Save &#38 Continue</button>
      </div>
    </div>
  </div>
</form>

Save＆amp;继续，我想展示一些其他形式。请告诉我如何做到这一点。

Answer 1

您可以创建一个新的html按钮并将它们与js中的脚本相关联：

<button id="Next" type="button" onclick="nextFunction();">Next</button>

js功能是：

nextFunction(){
$('#form-group').hide();
$('#newForm').show();
}

如何向表单添加有状态按钮

1 个答案: