hansontable を使用してセルからデータを保存するときにいくつかの問題が発生しており、いくつかの提案を使用できます。
問題は次のとおりです。
- Autosave 1 セルは undefined を送信します。
- 複数のセルを自動保存すると、未定義も渡されます。
- 保存ボタンをクリックすると、コンソールに次のように表示されます。
Save error. POST method is not allowed on GitHub Pages. Run this example on your own server to see the success message
コード:
<script>
var $container = $("#excel");
var $console = $("#excelconsole");
var $parent = $container.parent();
var autosaveNotification;
$container.handsontable({
startRows: 1,
startCols: <?=$num_rName+1?>,//count room type name from db
rowHeaders: true,
//colHeaders: ['Date/Room Types', 'Year', 'Price'],
colHeaders: <?echo json_encode($_array);?>,
minSpareCols: 0,
minSpareRows: 1,
contextMenu: true,
onChange: function (change, source) {
if (source === 'loadData') {
return; //don't save this change
}
if ($parent.find('input[name=autosave]').is(':checked')) {
clearTimeout(autosaveNotification);
$.ajax({
url: "inc/excel_save.php",
dataType: 'json',
type: "POST",
data: change, //contains changed cells' data
complete: function (data) {
$console.text('Autosaved (' + change.length + ' cell' + (change.length > 1 ? 's' : '') + ')');
autosaveNotification = setTimeout(function () {
$console.text('Changes will be autosaved');
}, 1000);
}
});
}
}
});
var handsontable = $container.data('handsontable');
$parent.find('button[name=load]').click(function () {
$.ajax({
url: "inc/excel_load.php",
dataType: 'json',
type: 'GET',
success: function (res) {
handsontable.loadData(res.data);
$console.text('Data loaded');
}
});
});
$parent.find('button[name=save]').click(function () {
$.ajax({
url: "inc/excel_save.php",
data: {"data": $("#excel").handsontable('getData')},
dataType: 'json',
type: 'POST',
success: function (res) {
if (res.result === 'ok') {
$console.text('Data saved');
}
else {
$console.text('Save error');
}
},
error: function () {
$console.text('Save error. POST method is not allowed on GitHub Pages. Run this example on your own server to see the success message.');
}
});
});
$parent.find('input[name=autosave]').click(function () {
if ($(this).is(':checked')) {
$console.text('Changes will be autosaved');
}
else {
$console.text('Changes will not be autosaved');
}
});
</script>
excel_save.php
<?
foreach($_POST as $key=>$val){//test the var passed
echo "$key=$val<br />";
}
?>
読み込まれたデータ
未定義で保存