function postForm(form) {
    var $this = $(form);
    var string = $this.serialize();
    $.ajax({
        type: "POST",
        url: "add_room.php",
        data: string,
        cache: false,
        success: function(data){
            var saveIcon = $this.find('.saveIcon');
            $this.find('[type=hidden]').val(data);
            saveIcon.fadeIn(750);
            saveIcon.delay(500).fadeOut(750);
            $('#message').text('The id of the inserted information is ' + data);
        }
    });
}

function autosave() {
    $('form').each(function() {
        postForm(this);
    });
}
setInterval(autosave, 10 * 1000);
$(document).ready(function() {
    $('body').on('click', '.save', function(e) {
        postForm($(this).closest('form').get(0));
    });

    $('#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');
    });
});