私が以下に書いたいくつかのスクリプトは、別々にうまく機能しますが、一緒にすると本来のように機能しません。コードを投稿してから、問題を説明しましょう。
自動保存機能:
<script>
function autosave() {
$('form').each(function() {
var string = $(this).closest('form').serialize();
var $this = $(this);
$.ajax({
type: "POST",
url: "add_room.php",
data: string,
cache: false,
success: function(data){
var saveIcon = $this.siblings('.saveIcon');
$this.siblings('[type=hidden]').val(data);
saveIcon.fadeIn(750);
saveIcon.delay(500).fadeOut(750);
$('#message').text('The id of the inserted information is ' + data);
}
});
});
}
setInterval(autosave, 10 * 1000);
</script>
AJAX ポストおよびリターン スクリプト:
<script>
$(document).ready(function() {
$('body').on('click', '.save', function(e) {
var string = $(this).closest('form').serialize();
var $this = $(this);
$.ajax({
type: "POST",
url: "add_room.php",
data: string,
cache: false,
success: function(data){
var saveIcon = $this.siblings('.saveIcon');
$this.siblings('[type=hidden]').val(data);
saveIcon.fadeIn(750);
saveIcon.delay(500).fadeOut(750);
$('#message').text('The id of the inserted information is ' + data);
}
});
});
});
$(document).ready(function(){
$('#addForm').on('click', function(){
$('<form method="post" action="add_room.php"><label for="itemName[]">Item</label><input type="text" name="itemName[]"><label for="itemPhoto[]">Photo</label><input type="text" name="itemPhoto[]"><input type="hidden" name="itemId[]" value=""><input type="hidden" name="itemParent[]" value="<?=$_GET["room"]?>"><div class="saveIcon" style="display: none; color: green;">SAVED!</div><div class="save">Save Item</div></form>').fadeIn(500).appendTo('.addItem');
});
});
</script>
形：
<form method="post" action="add_room.php">
<label for="itemName[]">Item</label>
<input type="text" name="itemName[]">
<label for="itemPhoto[]">Item</label>
<input type="text" name="itemPhoto[]">
<input type="hidden" name="itemId[]" value="">
<input type="hidden" name="itemParent[]" value="<?=$_GET['room']?>">
<div class="saveIcon" style="display: none; color: green;">SAVED!</div>
<div class="save">Save Item</div>
</form>
PHP:
<?PHP
require_once('dbConfig.php');
$item = $_POST['itemName'];
$photo = $_POST['itemPhoto'];
$id = $_POST['itemId'];
$parentId = $_POST['itemParent'];
foreach($item as $key => $val) {
if(!$id[$key]) {
if ($stmt = $db->prepare("INSERT test (test_title, test_desc, test_parent) VALUES (?, ?, ?)"))
{
// Use an s per variable passed to the string, example - "ss", $firstname, $lastname
$stmt->bind_param("ssi", $val, $photo[$key], $parentId[$key]);
$stmt->execute();
$stmt->close();
echo $db->insert_id;
//echo "success";
}
// show an error if the query has an error
else
{
echo "ERROR: Could not prepare Insert SQL statement.";
}
}
else
{
if ($stmt = $db->prepare("UPDATE test SET test_title = ?, test_desc = ? WHERE test_id = ?"))
{
// Use an s per variable passed to the string, example - "ss", $firstname, $lastname
$stmt->bind_param("ssi", $val, $photo[$key], $id[$key]);
$stmt->execute();
$stmt->close();
echo $id[$key];
//echo "success";
}
// show an error if the query has an error
else
{
echo "ERROR: Could not prepare Update SQL statement.";
}
}
}
?>
さて、2 番目のスクリプトで何が起こるかというと、自動保存なしで単独で使用すると、フォームに入力して [保存] をクリックすると、そのフォーム データが取得され、データベースの必要な行に保存され、id が返されます。保存されたばかりのデータを非表示フィールドに配置して、挿入クエリが必要な場合、または更新クエリが必要な場合 (返された ID が存在する場合) に php スクリプトが機能できるようにします。addForm というクリック可能な div もあります。これは、存在するフォームの下に別のフォーム セットを追加し、保存ボタンがクリックされたときにのみ、このフォームがデータベースに保存/更新されます。コードにあるように自動保存をトリガーすると、自動保存は文字通りすべてのフォームを取得し、それらを新しいエントリとして保存しますが、ID を返さないか、非表示フィールドを更新して更新シーケンスをトリガーしません。これについて何か光を当てることができますか？それは本当に私を悩ませています。これをできる限り説明しようとしましたが、長くなって申し訳ありません。ちょっと複雑な話です！笑