私のC#MVC4アプリケーションでDatatablesを使用しています。私のテーブルの 1 つは jeditable を使用して、ユーザーがテーブル内の任意のセルをダブルクリックし、そのセルの値を変更し、クリックするとデータベースに変更を保存して画面に反映されるようにします。
問題は、値を変更した後、列の配置が乱れ、列のデータが関連するヘッダーの右側に 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;
}