编辑后的列对齐答案

【问题标题】：Column Alignment After Edit编辑后的列对齐
【发布时间】：2013-04-26 11:57:59
【问题描述】：

我在我的 c#MVC4 应用程序中使用Datatables。我的一个表使用 jeditable 来允许用户双击表中的任何单元格，更改该单元格中的值，然后单击 Enter 保存对数据库的更改，这些更改仍然反映在屏幕上。

问题在于，更改值后，列对齐变得混乱，列的数据可能会在它所属的标题右侧显示多达 4、5 或 6 列长度。

这是脚本：

<script src="@Url.Content("~/Scripts/jquery.jeditable.js")" 
type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.dataTables.editable.js")" 
type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        var oTable1 = $('#BodyTable').dataTable({
            sScrollX: "100%",
            sScrollY: "200px",
            bFilter: false,
            bScrollCollapse: true,
            bPaginate: false,
            bScrollInfinite: true,
            bSort: false,
            //iScrollLoadGap: 10,
            oLanguage: {
                sZeroRecords: "There are no records that match your search criterion"
            }
        }).makeEditable({ sUpdateURL: '@Url.Action("UpdateData", "Home")',});

动作结果：

public string UpdateData(string id, string value, int? rowId, int? columnPosition, int? columnId, string columnName)
    {
        PViewModel H = new PViewModel();
        H.UpdateSValue(Convert.ToInt32(rowId), columnName, value, id);
        return value;
    }

【问题讨论】：

编辑数据后如何更新行？ DataTables 具有内置的特定方法来更新行的基础数据。见fnUpdate。如果您手动插入行（或者 jeditable 是..不熟悉该插件），那么您很容易遇到这个问题

标签： c# asp.net-mvc-4 jeditable jquery-datatables

【解决方案1】：

我在调整窗口大小时遇到了类似的问题。看看

http://datatables.net/api#fnAdjustColumnSizing

这将调整列的大小以正确适应。

【讨论】：