Php 用新添加的数据重新加载页面

在我工作的网站上，我有一个管理员面板，允许管理员将列表项添加到现有无序列表中。这是使用带有jQuery的

.append（）

的AJAX表单完成的。列表项是URL，使用PHP插入到数据库中。这部分是有效的

无论管理员是否登录，我都需要能够用新列表项重新加载页面（如中所示，我希望更新的列表对所有用户可用）。我知道除非我使用会话、cookie或某种本地存储/持久存储实用程序，否则我无法做到这一点

如果我决定使用persistJS之类的东西，我需要保存什么以便以后可以重新加载？整个

？整个文件

如果我使用PHP会话，我将如何进行

下面是一些示例列表和表单

<h3 class="category">
    List 1
</h3>
<ul id="1">
    <li>List item 1</li>
    <li>List item 2</li>
</ul>
<br />
<h3 class="category">
    List 2
</h3>
<ul id="2">
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
</ul>

<form id="addRec_form" action="classes/resources/addResource.php" method="post">
    <p><select name="categoryList" id="categoryList">
        <option value="0">Select a list to add to</option>
        <option value="1">List 1</option>
        <option value="2">List 2</option>
    </select></p>
    <p>Resource name: <input type="text" name="recName" id="recName" /></p>
    <p>Resource URL: <input type="text" name="recURL" id="recURL" /></p>
    <p><input type="submit" name="submitAddRec" value="Add resource" id="submitAddRec" /></p>
</form>

清单1

清单项目1
清单项目2



清单2

清单项目1
清单项目2
清单项目3
清单项目4


选择要添加到的列表
清单1
清单2

资源名称：

资源URL:

还有AJAX：

$.ajax ({
    type: 'post',
    url: '/classes/resources/addResource.php',
    data: {
        recName: $('#recName').val(),
        recURL: $('#recURL').val()
    },
    success: function(data) {
        if (data === 'added') {
            function updateLists() {
                var h3ID = $('#categoryList option:selected').val();
                var title = $('#recName').val();
                var url = $('#recURL').val();
                var newListItem = '<li><a href=\"' + url + '\">' + title + '</a></li>';
                $('ul#' + h3ID).append(newListItem);
            }
        }
        else
            $('span#resError').fadeIn(400).text('There was an error adding this resource');
    }
});

$.ajax({
键入：“post”，
url:“/classes/resources/addResource.php”，
数据：{
recName:$（'#recName'）.val（），
recURL:$（'#recURL'）.val（）
},
成功：功能（数据）{
如果（数据=='已添加'）{
函数updateLists（）{
var h3ID=$（'#categoryList选项：selected'）.val（）；
var title=$（'#recName'）.val（）；
var url=$（'#recURL'）.val（）；
var newListItem='
'；
$（'ul#'+h3ID）.append（newListItem）；
}
}
其他的
$（'span#resError'）.fadeIn（400）.text（'添加此资源时出错'）；
}
});

同样，PHP是有效的。AJAX甚至可以工作，因为我可以看到新的列表项被添加到适当的列表中。当我刷新页面时，新的列表项显然不存在

有道理，无论我需要做什么来保存新的DOM状态，都需要在AJAX成功部分中完成

我只是不知道如何开始。有人能为我提供一些示例代码来说明我正在努力完成的任务吗？不管是服务器端还是客户端

谢谢

---

编辑：有可能在第一个成功后再调用AJAX吗？如中所示，在第一个AJAX请求成功后，将进行一个新的AJAX调用，该调用将使用PHP添加新的列表项，以便它出现在页面重新加载上？

列表是否为db检索列表？否。列表已使用HTML创建。只有使用表单创建的新列表项被添加到dbHello Nojo…看，您应该有一个在页面加载上显示列表和项的方法；您可以用一个php脚本以多种方式实现这一点。@RobertRozas我可以看一个例子吗？您可以重用以下代码：