在一页的两个部分中预先添加html数据

时间:2015-06-13 01:24:23

标签: php ajax

我有ajax设置来提交代码以创建数据库的新类别,然后它将它预先添加回页面并显示它而不刷新页面。我甚至可以立即在页面的不同区域提取完全相同的数据。

这是我被卡住的地方。我的目标是找到一种方法来预先添加两个不同的数据集。一个在新类别之下,就像它已经做的那样,然后另一个只是在一个字段中创建一个新的页面的帖子部分。我认为它可能是一个元素id或者其他东西,但我找不到我正在寻找的东西。

那么是否可以采用前置(html)并将数据提交到两个页面区域?

以下是我提交的代码。

<script type="text/javascript" >
    $(function() {
        $(".update_button").click(function() {
            var boxval = $("#category").val();
            var boxval = encodeURIComponent(boxval);
            var dataString1 = 'category='+ boxval;

            var dataConfirm = 'newFAQCategory=true';
            var dataString = dataString1+'&'+dataConfirm;
            if(boxval=='') {
                alert("Please Enter A Title");
            } else {
                $.ajax({
                    type: "POST",
                    url: "ajax/faqCN.php",
                    data: dataString,
                    cache: false,
                    success: function(html){
                        $("ol#update").prepend(html);
                        $("select#faqc_id").prepend(html);
                        $("ol#update li:first").slideDown("slow");
                        document.getElementById('category').value='';
                        document.getElementById('category').focus();
                    }
                });
            } return false;
        });
    });


 </script>

1 个答案:

答案 0 :(得分:2)

要实现@ Brett的建议,即不是仅向您的AJAX请求发送HTML代码,而是发送带有两个HTML的JSON,您需要这样的内容:

PHP AJAX响应:

$returnValue = array();
$returnValue["html1"] = "<b>html for new categories</b>";
$returnValue["html2"] = "<b>html for new post section</b>";
exit(json_encode($returnValue));

然后在JavaScript中你有:

$.ajax({
    type: "POST",
    url: "ajax/faqCN.php",
    data: dataString,
    dataType: "json", // type of data that you're expecting back from the server
    cache: false
})
.done(function(data) {
    // Put the HTML received in the right place
    $("#html1").prepend(data.html1);
    $("#html2").prepend(data.html2);
});

最后一点,从jQuery 1.8开始,不推荐使用“success”回调,因此建议改为使用.done()