我正在构建一个表单，当用户单击“创建测试用例”按钮时，该表单将显示为弹出模式。模态本身包含两个选项卡。一个选项卡显示测试详细信息的表单字段，第二个选项卡显示测试属性的表单字段。
在第一个选项卡“测试”中，如果用户填写表单并单击“添加测试”，则表单应触发后端php处理并将数据写入MYSQL数据库。模态形式也应该关闭。另一方面，如果用户单击“属性”选项卡，它应该允许它们动态添加属性并插入到mysql数据库中。每次添加新属性时都应重新加载属性页。
我遇到的问题是，每次单击属性页面上的“添加”时，模态窗口都会关闭。
有人能告诉我如何让模态窗口重新加载属性表单页面，并防止模态窗口每次按下添加按钮时关闭？
这是我的代码：
<!-- page content -->
<div class="right_col" role="main">
<div class="">
<div class="page-title">
<div class="title_left">
<h3>Test Management <small></small></h3>
</div>
</div>
<div class="clearfix"></div>
<!-- start real -->
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2>Add Test Cases <small><?php echo $filenamePrefix; ?></small></h2>
<ul class="nav navbar-right panel_toolbox">
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Settings 1</a>
</li>
<li><a href="#">Settings 2</a>
</li>
</ul>
</li>
<li><a class="close-link"><i class="fa fa-close"></i></a>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="x_content">
<p class="text-muted font-13 m-b-30">
Add new test cases to current project.
</p>
<button type="button" class="btn btn-success" data-toggle="modal" data-target=".bs-example-modal-lg">Create new test case</button>
<!-- begin modal-->
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Create new test case</h4>
</div>
<div class="modal-body">
<div class="" role="tabpanel" data-example-id="togglable-tabs">
<ul id="myTab" class="nav nav-tabs bar_tabs" role="tablist">
<li role="presentation" class="active"><a href="#tab_content1" id="home-tab" role="tab" data-toggle="tab" aria-expanded="true">Tests</a>
</li>
<li role="presentation" class=""><a href="#tab_content2" role="tab" id="profile-tab" data-toggle="tab" aria-expanded="false">Properties</a>
</li>
</ul>
<form name="variables" id="variables" class="form-horizontal form-label-left" action=<?php echo htmlspecialchars($_SERVER[ "PHP_SELF"]); ?> method="post" enctype="multipart/form-data">
<div id="myTabContent" class="tab-content">
<div role="tabpanel" class="tab-pane fade active in" id="tab_content1" aria-labelledby="home-tab">
<div class="form-group">
<div class="row">
<div class="span col-md-2">
<label>Test Details</label>
<select class="form-control" name="rest_method">
<option value="GET">GET</option>
<option value="POST">POST</option>
<option value="PUST">PUT</option>
</select>
</div>
</div>
<div class="ln_solid"></div>
<div class="form-group">
<div class="row">
<div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-5">
<button type="submit" class="btn btn-primary">Cancel</button>
<button id="addTests" type="submit" value="true" name="addTests" class="btn btn-success">Add Test</button>
</div>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="tab_content2" aria-labelledby="profile-tab">
<div class="form-group">
<div class="row">
<div class="span col-md-4">
<label>Property Name</label>
<input type="text" class="form-control" id="variable_name" name="variable_name">
</div>
<div class="span col-md-2">
<label>Add Properties</label>
<button type="submit" class="btn btn-success" id="addVariables" value="true" name="addVariables">Add</button>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<!-- end MyyContentTab-->
</div>
</div>
<!-- end modal body -->
</div>
</div>
<!-- end modal -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /page content -->