模式框在导航栏选项卡内无效(引导程序)

时间:2016-11-08 10:18:16

标签: html css twitter-bootstrap

我已经尝试了很多次但仍然没用,我无法在导航栏标签中显示我的模态。当我点击它时会触发模糊。有人可以帮助我吗?

enter image description here

我的模板,

addnewrecord() {
  $('#editmodel').modal('show');
}
<div class="col-xs-12">
  <div class="row">
    <div class="col-xs-12">
      <div class="tabbable tabs-left mb-lg">
        <ul id="tabs2" class="nav nav-tabs">
          <li class="nav-item"><a class="nav-link" href="#tab1" data-toggle="tab">Home</a>
          </li>
          <li class="nav-item"><a class="nav-link active" [routerLink]="['/app/tables/basic']" data-toggle="tab">Chatter</a>
          </li>
        </ul>
        <div id="tabs2c" class="tab-content bg-info-light">
          <div class="tab-pane active">
            <div class="page-title">
              <div class="btn-group">
                <button class="btn btn-sm btn-default" (click)='addnewrecord()'>
                  New
                </button>
              </div>
            </div>

            <div class="modal fade" id="editmodel" role="dialog">
              <div class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <div class="modal-body">
                      <form id='form' class="form-horizontal form-label-left parsleyjs" method="post" data-parsley-priority-enabled="false" novalidate="novalidate">
                        <div class="form-group">
                          <label for="email">FirstName:</label>
                          <input type="text" [(ngModel)]='student.accountname' name='accountname' class="form-control" id="email" placeholder="Enter Firstname" required='required'>
                        </div>
                        <button type="submit" class="btn btn-primary" (click)='insertdata(student,student._id)'>{{buttonname}}</button>
                      </form>
                    </div>
                    <div class="modal-footer">
                      <button type="button" class="btn btn-default" data-dismiss="modal" (click)='resetform()'>Close</button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

1 个答案:

答案 0 :(得分:0)

请尝试使用此代码,

$('#editmodel').show();