Question

我用工具栏创建了一个表格，其中包含两个按钮。一切都会正确显示，直到数据从控制器返回并显示为止。然后，工具栏和表格会相互重叠。我不太确定要在哪里进行更改，因为这仅在用数据重新呈现表之后才发生。在下面的示例中，我显示了数据返回之前，填充之后以及调整浏览器大小之后的表。

index.cshtml

<div class="form-group">
<h3>Pending Users</h3>
<p>
    Users who have been invited to your business, but haven't accepted yet.
</p>
<table id="pending-users" data-striped="true" data-pagination="true" data-cache="false" data-page-list="[10, 25, 50, 100, 200]" data-side-pagination="server" data-toggle="table" data-toolbar="#toolbar" data-url="@Url.Action("GetPendingUsers", "Users")">
    <thead>
        <tr>
            <th data-field="BusinessUserId"  data-visible="false"></th>
            <th data-field="FirstName">First Name</th>
            <th data-field="LastName">Last Name</th>
            <th data-field="EmailAddress">Email Address</th>
            <th data-field="action" data-formatter="pendingUsersActionFormatter" data-events="pendingUsersActionEvents">Invitation</th>
        </tr>
    </thead>
</table>

<div id="toolbar" class="btn-group">
    <button id="add-user-button" type="button" class="btn btn-default">
        <i class="glyphicon glyphicon-plus"></i>
        Add Individual User
    </button>
    <button id="bulk-upload-button" type="button" class="btn btn-default">
        <i class="fa fa-cloud-upload"></i>
        Import Multiple Users
    </button>
</div>

UsersController.cs

public ActionResult GetPendingUsers(int limit, int offset) {
    var business = _businessService.GetBusinessFromUserId(UserProfile.Current.UserId);
    var results = _businessService.GetBusinessUsers(business.Id);
    var businessUserListItems = new List<BusinessUserListItemModel>();

    return Json(new { rows = businessUserListItems, total = results.TotalItems }, JsonRequestBehavior.AllowGet);
}

Before Data

Overlapped Toolbar

After Resize

工具栏在引导程序中重叠表内容

0 个答案: