AJAX创建和编辑POST表单到lightbox并获得结果

时间:2017-02-28 作者:Coyote6

因此,我建立了一个Wordpress网站,它有自定义的帖子类型和对其他帖子类型的引用。

示例:

自定义贴子类型1-在两个字段上引用类型1-在多个字段上引用类型2-前端显示和工作正常。问题是我需要一种更简单的方式让我的客户能够编辑引用。我建立了用于创建新帖子或在新选项卡中编辑所选帖子的链接,但我的客户希望所有链接都显示在一个屏幕上,以帮助他管理帖子类型上的众多字段。我的想法是构建一个ajax页面,以便在单击链接时在灯箱中返回表单。然后,从lightbox提交后,获取新帖子的id,并将当前选定的项目更改为新项目(如果要引用创建新帖子)。

我通常在Drupal中构建,这将是Drupal\\u get\\u form()的不二之选,然后用它做我想做的事情,但我在Wordpress中找不到任何关于如何做这件事的文档。(是的,我知道这不是Wordpress的强项,但我需要在Wordpress中完成。)我只考虑重建新岗位。php文件,但我得到一个更新数据库屏幕,上面说我的数据库没有更新,这是一种非常黑客的方式,所以如果可能的话,我宁愿不这样做。

我发现这篇文章很接近我的需要:AJAX post into pop-up div

它的问题是,在提交ajax表单时,它没有创建新的帖子。我猜这是因为我需要通过Wordpress的ajax调用来运行提交,但即使这样也似乎失败了,并返回了0响应。

JavaScript:The#new post form是加载到lightbox中的表单:

$(\'#new-post\').submit(function (e) {
    e.preventDefault();
    var data = $(this).serializeArray();
    data[\'action\'] = \'post_form_ajax\'
    jQuery.post(ajaxurl, data, function(response) {
        alert(\'Got this from the server: \' + response);
    });
});
Wordpress插件:

add_action( \'wp_ajax_post_form_ajax\', \'MYPLUGIN_post_form_ajax\' );

function MYPLUGIN_post_form_ajax () {
    echo \'work\';
    wp_die();
}
非常感谢您的帮助。

更新获得了提交AJAX的表单。我需要不同形式的数据(作为对象),数据[\'action\']行后缺少分号。

要重新格式化数据,我使用了此函数(@请参阅https://stackoverflow.com/questions/1184624/convert-form-data-to-javascript-object-with-jquery)

$.fn.serializeObject = function() {
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || \'\');
        } else {
            o[this.name] = this.value || \'\';
        }
    });
    return o;
};
然后调整提交功能:

$(\'#new-post\').submit(function (e) {
    e.preventDefault();
    var data = $(this).serializeObject();
    data[\'action\'] = \'post_form_ajax\';
    jQuery.post(ajaxurl, data, function(response) {
        alert(\'Got this from the server: \' + response);
    });
});
最后一步是了解如何从我的ajax函数MYPLUGIN\\u post\\u form\\u ajax()动态保存或更新自定义帖子数据。再次感谢。

1 个回复
SO网友:Larzan

您是否考虑过使用ACF 插件?

有了这个很棒的插件(没有连接,我无法想象WP没有它)你就有了这个功能acf_form 要在前端呈现任何内容表单,都需要ajax更新和保存(也可以通过IFrame在弹出窗口中工作)

即使缺少诸如标记和类别之类的侧栏元素,您也可以轻松地用自定义ACF字段替换它们。

以下示例摘自他们的页面,对我来说非常有用:

<?php acf_form_head(); ?>
<?php get_header(); ?>

    <div id="primary">
        <div id="content" role="main">

            <?php /* The loop */ ?>
            <?php while ( have_posts() ) : the_post(); ?>

                <h1><?php the_title(); ?></h1>

                <?php the_content(); ?>

                <?php acf_form(); ?>

            <?php endwhile; ?>

        </div><!-- #content -->
    </div><!-- #primary -->

<?php get_footer(); ?>
请务必阅读文档,了解如何激活标准标题和文本字段的编辑,而不仅仅是自定义字段,本示例仅允许您编辑ACF字段

相关推荐

在AJAX调用中加载oEmbedded IFRAME

我正在尝试加载通过ajax加载的oembed短代码。问题是,oembed短代码似乎很有效,因为我有一个blockquote而不是instagram链接。但是,blockquote没有被iframe替换。应该有一个javascript函数来搜索blockquotes并用iframe替换它,但它没有被激发,因为我没有加载所有页面?有人知道怎么发射这个吗?谢谢