添加表单时，PHP重新加载页面(也许需要ajax) [英] PHP reload page when adding forms (maybe needs ajax)

问题描述

很抱歉，该主题的标题可能不正确，但这是我想出的最好的结果.

Sorry for maybe incorrect title for the topic, but this is the best that I came up with.

因此，我正在为网站构建管理面板.

So, I'm building admin panel for a website.

我有一个页面，并且在页面的某些部分中，我想刷新它并加载其他表单.

I have a page, and in some part of the page, i'd like to refresh it and load another form.

让我们添加一个时间表，然后在页面的某个位置上，我希望在单击链接后立即显示此表单.

let's say add a schedule, and somewhere down on the page I'd like to have this form displayed as soon as the link is clicked.

当用户保存它时，我希望该表格消失，而不是让它具有显示所有时间表的列表.

when a user saves it, I'd like that form to disappear and and in stead of that to have a list displaying all of the schedules.

我不想使用框架-我不是框架的支持者.该面板是使用PHP构建的.

I don't want to use frames - I'm not a supporter of frames. The panel is built using PHP.

也许使用Ajax可以实现吗?如果是->怎么样?任何指向好的示例或教程的链接.

Maybe this might be achived with Ajax? If yes -> How? any link to good example or tutorial.

推荐答案

是的，这将使用ajax解决.

yes this will be solved with ajax.

这是应该刷新页面的代码示例

Here is a code example when the page is supposed to refresh

$('#button').click(function() {
    $.ajax({
        url: 'path/to/script.php',
        type: 'post',
        dataType: 'html', // depends on what you want to return, json, xml, html?
                       // we'll say html for this example
        data: formData, // if you are passing data to your php script, needed with a post request
        success: function(data, textStatus, jqXHR) {
            console.log(data); // the console will tell use if we're returning data
            $('#update-menu').html(data); // update the element with the returned data
        },
        error: function(textStatus, errorThrown, jqXHR) {
            console.log(errorThrown); // the console will tell us if there are any problems
        }
    }); //end ajax

    return false; // prevent default button behavior
}); // end click

jQuery Ajax

jQuery Ajax

http://api.jquery.com/jQuery.ajax/

脚本说明了.

1-用户单击按钮.

2-单击功能向服务器发起XHR调用.

2 - Click function initiates an XHR call to the server.

3-url是php脚本，它将根据发布的值处理我们正在发送的数据.

3 - The url is the php script that will process the data we are sending based on the values posted.

4-类型为POST请求，需要数据才能返回数据.

4 - The type is a POST request, which needs data to return data.

5-在这种情况下，数据类型将为html.

5 - The dataType in this case will be html.

6-我们发送给脚本的数据可能是分配给变量formData的form元素的序列化.

6 - The data that we are sending to the script will probably be a serialization of the form element that is assigned to the variable formData.

7-如果XHR返回200，则在控制台中登录返回的数据，以便我们知道我们正在使用什么.然后将数据以html格式放置在所选元素中(#update-menu).

7 - If the XHR returns 200, then log in the console the returned data so we know what we are working with. Then place that data as html inside the selected element (#update-menu).

8-如果有错误，请让控制台为我们记录该错误.

8 - If there is an error have the console log the error for us.

9-返回false以防止出现默认行为.

9 - Return false to prevent default behavior.

10-全部完成.

这篇关于添加表单时，PHP重新加载页面(也许需要ajax)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！