大家好日子。
我使用ASP.NET MVC 4和datatable作为表设计的主要来源。 我能够创建DataTable按钮，在单击时显示模态，但问题是模态的高度大于页面。据说当我向下滚动模态的下半部分应该出现，但它是向下滚动的主页面，并且模式的下半部分没有显示。
任何帮助将不胜感激。
这是我的DataTable的代码
<table id="exampledatatable" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" >
<thead>
<tr>
<th>Customer Code</th>
<th>Customer Name</th>
<th>Customer Type</th>
<th>Industry Type</th>
<th>Website</th>
<th>Email</th>
<th>Off Day 1</th>
<th>Off Day 2</th>
<th>E-mail</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
<td>Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
<td>5421</td>
<td>t.nixon@datatables.net</td>
</tr>
这是我调用html模式
的DataTable按钮的脚本$(document).ready(function () {
$('#exampledatatable').DataTable({
dom: 'Bfrtip',
buttons: [
{
extend: 'copyHtml5',
text: '',
titleAttr: 'Create New Record',
action: function (e, dt, node, config)
{
$('#generalCusModal12').show();
}
}]
});
});
这是我的html Modal代码
<div id="generalCusModal" class="modal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header modal-header-employee">
<button type="button" class="close" data-dismiss="modal">×</button>
<h3 class="modal-title"><img class="crud" src="~/Images/profile.png" />Customer Records Management</h3>
</div>
<div class="modal-body">
<h4 class="lbl_custinfo">General</h4>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Customer Code</label>
<div class="col-xs-8 col-sm-6">
<input class="form-control" type="text" placeholder="<Auto>" disabled>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Customer Name</label>
<div class="col-xs-8 col-sm-6">
<input class="form-control" type="text">
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Company Type</label>
<div class="col-xs-8 col-sm-6">
<select class="form-control" id="sel1" disabled>
<option value="">CUSTOMER</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Customer Type</label>
<div class="col-xs-8 col-sm-6">
<select class="form-control" id="sel1">
<option value="" selected></option>
<option>WALK-IN</option>
<option>RESIDENTIAL</option>
<option>COMPANY</option>
<option>SCHOOL</option>
<option>BANK</option>
<option>CLINIC</option>
<option>RESTAURANT</option>
<option>HOSPITAL</option>
<option>HOTEL</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Industry Type</label>
<div class="col-xs-8 col-sm-6">
<select class="form-control" id="sel1">
<option value="" selected disabled></option>
<option>ADVERTISING AGENCIES</option>
<option>BUSINESS PROCESS OUTSOURCING</option>
<option>ENTERTAINMENT COMPANY</option>
<option>FOOD COMPANY</option>
<option>TECHNOLOGY</option>
<option>TELECOMMUNICATION</option>
<option>PHARMACEUTICAL</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Day Off 1</label>
<div class="col-xs-8 col-sm-6">
<select class="form-control" id="sel1">
<option value="" selected disabled></option>
<option>MONDAY</option>
<option>TUESDAY</option>
<option>WEDNESDAY</option>
<option>THURSDAY</option>
<option>FRIDAY</option>
<option>SATURDAY</option>
<option>SUNDAY</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Day Off 2</label>
<div class="col-xs-8 col-sm-6">
<select class="form-control" id="sel1">
<option value="" selected disabled></option>
<option>MONDAY</option>
<option>TUESDAY</option>
<option>WEDNESDAY</option>
<option>THURSDAY</option>
<option>FRIDAY</option>
<option>SATURDAY</option>
<option>SUNDAY</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Email</label>
<div class="col-xs-8 col-sm-6">
<input class="form-control" type="text">
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label">Website</label>
<div class="col-xs-8 col-sm-6">
<input class="form-control" type="text">
</div>
</div>
<div class="form-group row">
<label class="col-xs-4 col-sm-offset-1 col-sm-4 control-label"></label>
<div class="col-xs-8 col-sm-6">
<textarea class="form-control" rows="4" style="min-width: 100%"></textarea>
</div>
</div>
</div><!--MODAL BODY-->
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-target="#custLocationModal" data-toggle="modal" data-dismiss="modal">Next</button>
<button type="button" class="btn btn-default">Clear</button>
</div>
</div>
</div>
</div>
提前致谢。